Sporadic "custom element doesn't exist: grid-layout" errors

[mneuhaus]

Ok, i'm really fully lost at this point.
i'm trying to set up lovelace minimalist and in theory i've got it running but, sometimes it doesn't work when i try to open it with a browser and get the error: "custom element doesn't exist: grid-layout".
If i reload the page a few seconds later it works and i get the same error if i try to open the dashboard on the android app or if i try to cast that dashboard to a google hub.
I've installed everything through HACS.
I even tried a complete fresh home assistant installation and went through the install guide from scratch, ended up in the exact same behavior.

Any idea what else i could try or how i could debug this?

[mneuhaus]

these issues over in the HA Core kinda sound really similar:

• Dashboard: Sometimes showing error "Custom element doesn't exist: hui-vertical-stack-card" home-assistant/frontend#12330
• Javascript from custom_components not included when casting home-assistant/frontend#11087

Could be related to the time it takes to load/process the custom cards?

I've got HA running as HA OS on a 2014 Mac Mini with 16GB RAM and connected by Ethernet cable, so latency shouldn't really be a problem :(

[ahaverty]

I'm getting the same on a new install of UI Lovelace Minimalist also

[mneuhaus]

Some more information from various tests i did:

• limiting network speed to slow 3G and CPU to x6 slowdown in Chrome Developer tools does not produce this issue
• using the local IP address in the android app instead of Nabu Casa works most of the time, using the Nabu Casa URI always shows that error
• using a fresh chrome inkognito window produces the problem, which persists when doing a normal reload, but if i do a force reload with shift it works, doing a regular reload again produces that exact same problem

This issue really perplexes me, it really smells like some kind of race condition of parallel loading/initialising modules, that in a certain "order" produce this error.

[basbruss]

@mneuhaus The problem as you describe it is most likely related to the cloud service nabu casa uses. Their cache can be different than on your local system. Sadly I dont have a direct solution for it.

[mneuhaus]

that may be one factor, yes, but it also happens sporadically using the local network as well

[mneuhaus]

I tried to look into the code itself a little bit as well, as far as i understand, there is already stuff in the core, that "should" work around race conditions of custom cards already by showing that "Custom element doesn't exist: " content, but replace it when that tag/module is loaded:

https://github.com/home-assistant/frontend/blob/dev/src/panels/lovelace/create-element/create-element-base.ts#L103-L119

[focalfury]

new installation of UI Minimalist here and happening as well

[klaaspieter]

Pretty much the same as @focalfury. I just set it all up and seeing the exact same.

[ayourk]

This error exists for me to using version 1.1.6-hotfix and enabling the setting of Enable Adaptive Dashboard with popup splitview

[ayourk]

My solution was to add all of the different resources to Settings -> Dashboards --> 3 dots stacked on top of each other in top right corner -> Resources and then proceed to add in all of the FrontEnd HACS resources to here. For example, for the button-card Frontend, add /hacsfiles/button-card/button-card.js to the list of JavaScript modules.

[fjeddy]

If you are using the "Include custom card resources it's depending on." option, then that is where the problem lies, with how they are including all the cards (I'm guessing).

Simply disable that option and install all the resources manually and the problem completely vanishes.

PS: It has nothing to do with cloud or remote access, this happens locally as well as remotely.

[JHBoricua]

@fjeddy That's not it. I installed all resources manually and didn't check on the option you mentioned and I'm still getting the same error msg as the OP on a fresh HA install.

[JHBoricua]

The list of lovelace resources shown on the prerequisites/installation pages at https://ui-lovelace-minimalist.github.io/UI/setup/download/ is incomplete:

You'll also need these three lovelace resources:

simple-weather-card
layout-card
state-switch

[BlueskyFR]

Which versions does this affect?

[mmaas70]

You'll also need these three lovelace resources:

simple-weather-card layout-card state-switch

This fixed the 'grid-layout' problem for me.

[argorain]

You'll also need these three lovelace resources:
simple-weather-card layout-card state-switch

This fixed the 'grid-layout' problem for me.

Not sure about simple-weather-card but later two are definitelly what was missing. Thanks!

Edit: Just found this wiki page where exactly those two are mentioned. Not sure why they aren't under dependencies though.

[ascandroli]

as @mmaas70, manually installing these 3 fixed the issue for me. Starting from scratch, I used the "Include custom card resources it's depending on." option but then I needed to manually install layout-card, state-switch and simple-weather-card to make it work.

[dreamonhigh]

as @mmaas70, manually installing these 3 fixed the issue for me. Starting from scratch, I used the "Include custom card resources it's depending on." option but then I needed to manually install layout-card, state-switch and simple-weather-card to make it work.

having same issue.
how can I install it manually ?

[curtisbarnard]

@dreamonhigh Go into HACS > Frontend > Explore & Download Repositories and then search for them. Click Download to install.

[TheS1ngularity]

layout-card

This solved the issue for me, particularly the layout-card one.

Initially I selected the "Include all cards..." during setup, and HA froze, I had to restart from the host.

So my 2 cents on this would be that update is needed for the Installation steps:

1. Update the dependencies with the 3 other add-ons
   simple-weather-card
   layout-card
   state-switch

2. Include only instructions for manually installing all dependencies.

3. Remove the option "Include all cards..." from the add-on configuration panel.

And also, a tip, the Readme page should also indicate that this dashboard works for Dark mode as well. Initially I didn't want to install it just because there was no image/indication of a Dark mode support, I think a lot of people prefer dark mode over pure white and bright dashboard.

Thanks!