ESPHome shows blank black validate, install, and log window for every device. ESPHome is installed on the latest stable HAOS on raspberry pi. I did a fresh install completely from scratch and still have this problem. I can program my ESP8266 module with VSCode (VSCodium) with no problem. The configuration log shows expected activity and appears to be doing something, but the web ui interface has a black display window.
Am I viewing a black text on black screen display?
Can I change either the screen color or text color?
I originally posted this under HassOS because I thought the problem could be with the operating system text configuration. I found others with this problem, but never found a solution. I spent all week on this with no success.
[SOLVED]
I figured out a work around that lets me see the text on the black window in firefox:
In ESPHome: OPEN WEB UI or click the ESPHome icon in left sidebar.
Click “Validate” in any configuration.
Black window with no text is displayed.
Click mouse right in black window and a menu pops up.
Click “This Frame” → “Only Show This Frame” in menu.
The ESPHome window is reloaded without a sidebar on the left side.
Click “Validate” in any configuration. [Again]
Black window shows up, this time there is text in it.
My guess is that somehow embedding the ESPHome web ui inside the home assistant ui is broken on current firefox browsers. Anyway, now I can see what is happening in ESPHome and make adjustments to my configurations.
I have chrome (and edge) and I am also getting a black screen. The option you mention in nr 5 doesn’t appear for me. Do you know how to resolve this for chrome?
I’ve got the same issue, black screen, but I see it in Firefox, Edge, and Chrome and the Firefox workaround does not seem to work for me. I see this with Validate, Install, Log, and Download. Only “edit” shows me a white screen with text in it. When I inspect the black window and look at the underlying code, I only see a blank div tag with no content, which leads me to believe that something else is going on for me. <div class="log"></div> Not really sure what to do except maybe rip ESPHome out and reinstall it again.
Edit----
In case it helps anyone, I think I narrowed down my issue. When trying to access ESPHome outside of my home network (coming in via a duckdns url), it doesn’t look like ESPHome handles that out of the box. I’m sure there is probably some sort of workaround config setup, but the easiest solution for me seems to be to make sure I’m connecting directly to the HA instance with the local reference rather than the global URL.
Also having the same issue, looked at the ESPHome addon log and saw this error
2022-12-22 11:20:02,039 ERROR Uncaught exception GET /info?configuration=esphome-web-5509cb.yaml (0.0.0.0)
HTTPServerRequest(protocol='http', host='192.168.0.5:8123', method='GET', uri='/info?configuration=esphome-web-5509cb.yaml', version='HTTP/1.1', remote_ip='0.0.0.0')
Traceback (most recent call last):
File "/usr/local/lib/python3.9/dist-packages/tornado/web.py", line 1711, in _execute
result = method(*self.path_args, **self.path_kwargs)
File "/esphome/esphome/dashboard/dashboard.py", line 133, in decorator
return func(self, *args, **kwargs)
File "/esphome/esphome/dashboard/dashboard.py", line 158, in decorator
return func(self, *args, **kwargs)
File "/esphome/esphome/dashboard/dashboard.py", line 807, in get
self.write(DashboardEntry(yaml_path).storage.to_json())
AttributeError: 'NoneType' object has no attribute 'to_json'
2022-12-22 11:20:02,044 ERROR 500 GET /info?configuration=esphome-web-5509cb.yaml (0.0.0.0) 7.52ms
i dont know what i did to get this working just now, i thought it was something to do with different versions of python being installed on the host so i started messing around with trying to install a SSH certificate to get into the Host CLI but then installed Home Assistant Community Add-on: SSH & Web Terminal instead as it was an easier way to get Host cli access and for some reason its working the ESPhome screen is now working and showing actions for updating, compiling, etc…
Update: it stopped working again same error just a couple of hours later, i reimaged my machine with fresh install of HA OS and same error message straight away.
I am having the same issue. I’ve been using Home Assistant for years on RPi but just now decided to take ESPHome for a spin. The validate, install, and log modals are all blank when running through my nginx proxy but work fine when directly connected without SSL on port 8123.
Looking at the network traffic in the browser tools, I see the WebSocket disconnects immediately when on the nginx proxy.
The SSL traffic is also port fowarded by my OPNSense router. The WebSocket traffic for other requests such as streaming the CPU and memory metrics works fine.
OK so I ended up switching from the “Let’s Encypt” + “NGINX Home Assistant SSL proxy” add-ons to the “Nginx Proxy Manager” add-on and added the custom location and proxy_set_header directive. Now it’s working as expected.
This was also failing for me (Chrome / installed app on PC, using NGINX SSL Proxy addon), but worked if I accessed it through the unproxied IP and port. Other addons were all working fine.
The verify/compile endpoints are websockets, and the frontend was connecting to the right URL, and getting a 101 status correctly, but the supervisor logs showed:
Sadly, that config is already included on the NGINX SSL Proxy addon config, so this didn’t help.
I ended up using a sniffer to intercept the connection between the supervisor and the esphome container, and this is what happens:
HTTP/1.1 403 Forbidden
Cross origin websockets not allowed
It seems that the ESPHome container requires the Origin and Host headers to match, including the port, and the default config doesn’t add the port to the Host header, but it’s present on the Origin header.
I fixed it updating the solution on the link above taking this into account. So, to fix this, make sure that default is uncommented on the customize config of the NGINX addon, and create a file at /share/nginx_proxy_default_ingress.conf, with this content:
