Error: "Custom element doesn't exist" on builtin cards #104

rummik · 2022-10-21T13:57:23Z

Describe the bug
There seems to be an issue with embedding builtin cards

To Reproduce
Steps to reproduce the behavior:

Create a custom:room-card
Add a sub-card using any builtin card (ex: picture-glance)
Click on 'save'
Reload the page
See error

Example YAML:

type: custom:room-card
title: Kitchen
cards:
  - camera_view: live
    type: picture-glance
    title: Kitchen
    image: https://demo.home-assistant.io/stub_config/kitchen.png
    entities:
      - entity: sensor.uptime

Expected behavior
Custom room card should be visible with builtin card

Screenshots

Desktop (please complete the following information):

OS: Linux
Browser: Firefox
Version: 105.0.1

Additional context
Looks like this may be related to #64

The text was updated successfully, but these errors were encountered:

marcokreeft87 · 2022-10-21T17:08:26Z

Working on my HA. Which version do you use?

rummik · 2022-10-21T22:46:18Z

Current HA (2022.10.5). Have you saved and reloaded the dashboard?

marcokreeft87 · 2022-10-21T22:50:09Z

Ah on mobile I get it too. Weird, but I might know what's the problem

marcokreeft87 · 2022-10-21T22:51:24Z

Ah on mobile I get it too. Weird, but I might know what's the problem.

Edit: nope that isn't it

rummik · 2022-10-21T23:04:34Z

I've poked at it a little bit the other day, but I don't know enough about how HA handles card loading to submit a fix 😅

At least it's relatively easy to reproduce I guess?

marcokreeft87 · 2022-10-21T23:08:07Z

It is easy to reproduce, but since this is an error HA throws it a pain to debug

marcokreeft87 · 2022-10-22T07:42:03Z

Weird thing is, for example the "entities" card is working..

rummik · 2022-10-26T19:35:06Z

I'm finding that it works if I have the builtin card I want loaded elsewhere on the dashboard. If I can manage to find the time I'll dig around and see if I can get a PR, since I did notice there's an exposed API that doesn't seem to be used by the library you're using, and I'd like to compare what's being done differently

marcokreeft87 · 2022-10-26T19:39:44Z

That would be nice. Good find btw

omayhemo · 2022-11-01T21:32:16Z

I have the same problem.

omayhemo · 2022-11-02T17:29:07Z

FYI latest version I grabbed from HACS didn't solve, but you probably knew that already.

marcokreeft87 · 2022-11-02T17:30:35Z

FYI latest version I grabbed from HACS didn't solve, but you probably knew that already.

Thats why there are release notes in them :P

marcokreeft87 · 2022-11-02T17:34:41Z

@omayhemo Weird thing is, I had this error while developing 1.07.01 but its gone now

omayhemo · 2022-11-02T17:36:29Z

ORLY? I can't be arsed. :)

omayhemo · 2022-11-03T14:12:35Z

@omayhemo Weird thing is, I had this error while developing 1.07.01 but its gone now

Since its WOM, I wonder if your local differs from the repo?
Don't know if it helps or not, but if I goto the edit popup for the element, the card that errors is properly shown. If I make a change and save, the card will now show on the dashboard as well.

marcokreeft87 · 2022-11-03T14:34:59Z

Its the exact same version

omayhemo · 2022-11-03T17:40:24Z

I haven’t tried other browsers just edge, I’ll test others when I can. Just trying to provide a little data no idea if it helps you or not.

omayhemo · 2022-12-19T15:30:57Z

Exists in all browsers, just FYI. Furthermore, I get a a.style can't be on undefined error periodically as well. Refreshes don't help, I have to go in and literally perform an edit on the card and save it and then the whole view will work. There seems to be a rendering timing problem or something. I have to find a different solution at this point.

marcokreeft87 · 2022-12-19T16:46:10Z

Unfortunately I can't test all cards. And tbf it's a nice extra feature, but cards will always work best in a seperate instance.

csthomas2 · 2023-02-08T02:47:24Z

I built a dashboard specifically for mobile with this card. I still get the a.style undefined and element doesn't exist. I temporarily fixed by adding the two built-in cards at the bottom, but I have to scroll all the way down then refresh the page for the a.style error to go away. Then I have to wait until the picture entity cards refresh by themselves for the undefined element to fix itself. I'm using latest versions of the card and HA.

marcokreeft87 · 2023-02-08T05:36:22Z

Can you share your yaml?

csthomas2 · 2023-02-09T01:30:32Z

Sure
yaml.yaml.txt

marcokreeft87 · 2023-02-09T07:59:50Z

Sure yaml.yaml.txt

I think the problem here is that you put cards in a horizontal stack in a room card.

csthomas2 · 2023-02-09T12:28:47Z

I removed the horizontal-stacks from the room-cards and loaded the dashboard up in an incognito window. I first get this error (got this before as well). Then the page reloads itself (in incognito, I have to sign in again). Then I proceed to get the "Custom element doesn't exist". I would also get the "Custom element doesn't exist" for the horizontal-stack. Scrolling down and waiting eventually loads my horizontal stacks and the pictures within. The pictures do end up loading without the horizontal-stack as welll, since I have the extra card at the bottom.

edit: actually, this is really weird. The behavior is different without the horizontal-stacks. Even with the built in card at the bottom, I can't get it to eventually load without editing the dashboard as mentioned above.

marcokreeft87 · 2023-02-09T12:45:46Z

Hmm some cards of HA work different from the others. For example the picture entity. But you now get the error like the rest in this topic. I will take the horizontal-card into the test when I finally find the solution to this bug :)

NeonOby · 2023-02-28T19:47:37Z

Not sure if this is helpfull but this problem also happens when I nest the mushroom card inside the room card.
When I reload the dashboard in chrome or when restarting the android app I get either this:

or

Room cards without nested cards work fine and the mushroom card by itself also works fine.

marcokreeft87 · 2023-02-28T20:05:56Z

Why would you put the mushroom card in a room card? Thats just weird haha. But you have this error because you dont pass any entities to the room card @adoby

NeonOby · 2023-03-01T06:57:23Z

"Why would you put the mushroom card in a room card?"
Because I want to categorize my entities by room, I thought this is the meaning of the room/entities/auto entities cards.
Create one room card and then add all the entities that are inside that room inside the room card.
This way it's just a little bit faster and nicer looking to change the brightness or change the cover position.

"But you have this error because you dont pass any entities to the room card"
Doesn't seem so. I have multiple room cards in my dashboard every card that doesn't contain "cards:" works fine.
As soon as I add a single nested mushroom card it breaks the room card.

I tested nesting the build in light card and it works.
At least for me it happens for custom cards, not build in cards even though I haven't tested all of them.

I did change the entitiy ids in the screenshot.
The screenshot only shows one of the possible errors, the other one "custom element doesn't exist" still also happens randomly.

marcokreeft87 · 2023-03-01T06:59:53Z

Ah ok. I think this will help. It gives me a direction to search for at least. Thanks for trying multiple configurations

cookie050 · 2023-06-21T13:53:10Z

In app, still same problem. If i change webviewer on android to chrome it works

marcokreeft87 · 2023-06-21T17:14:46Z

Crap @paulonutor seems like your solution doesn't seem to work for everyone. Can you check my note to self solution?

paulonutor · 2023-06-21T18:03:41Z

My PR fixed something else. Nested entities didn't update on state change. This bug seems interesting and I'm going to take a look at it.

elninosi · 2023-06-26T16:58:41Z

Looks like some elements are loaded before room card's code and this is causing a problem on slow mobile connection dashboard is almost always loaded properly.

paulonutor · 2023-06-27T18:38:20Z

Could anyone check if it was fixed by #248 ?

elninosi · 2023-06-27T18:51:09Z

@paulonutor I can't see that there are any updates available (current version 1.07.24).

marcokreeft87 · 2023-06-27T19:16:20Z

I need to make a release for that. But I have to review it first

marcokreeft87 · 2023-06-30T06:42:21Z

@elninosi I've made a new release, can you try now?

elninosi · 2023-06-30T06:55:42Z

No errors are shown on the front-end on companion app for Android. Some cards are not shown. Will try to debug in the following days and report as much info as I can get. V V pet., 30. jun. 2023 ob 08:42 je oseba Marco Kreeft < ***@***.***> napisala:

…

@elninosi <https://github.com/elninosi> I've made a new release, can you try now? — Reply to this email directly, view it on GitHub <#104 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ACURVVFIEJ54RGCG32W2FV3XNZYNTANCNFSM6AAAAAARLGKLFY> . You are receiving this because you were mentioned.Message ID: ***@***.***>

NeonOby · 2023-06-30T15:41:22Z

Home Assistant didn't show me any update, so I clicked on the redownload button in the options menu which let me select the .25 version and install it.

I have the same errors like before

Cannot read properties of undefined
Custom element doesn't exist
Randomly one of them or rarely it will work.
Both in the mobile app and desktop browser (chrome)
Also cleared the browser cache for the website.

I did not yet restart Home Assistant yet.
Do I need to restart to check if it works?

elninosi · 2023-07-14T08:23:04Z

It looks like the problem is in one of the libraries. Uncaught TypeError: a is undefined

When I'm throttling internet connection everything is loaded properly. So looks like dependencies are no loaded quickly enough. V V pet., 30. jun. 2023 ob 17:41 je oseba ADoby ***@***.***> napisala:

…

Home Assistant didn't show me any update, so I clicked on the redownload button in the options menu which let me select the .25 version and install it. I have the same errors like before - Cannot read properties of undefined - Custom element doesn't exist Randomly one of them or rarely it will work. Both in the mobile app and desktop browser (chrome) Also cleared the browser cache for the website. I did not yet restart Home Assistant yet. Do I need to restart to check if it works? — Reply to this email directly, view it on GitHub <#104 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ACURVVGLGZV2NZY5VUXWQB3XN3XS5ANCNFSM6AAAAAARLGKLFY> . You are receiving this because you were mentioned.Message ID: ***@***.***>

marcokreeft87 · 2023-10-13T09:33:08Z

I havent had this in a while now. Anyone in here who has had it since the october release?

marcokreeft87 · 2023-10-14T11:28:54Z

@elninosi Can you try with the new release?

cookie050 · 2023-10-14T11:57:23Z

Use latest update, and still got this error. Before the update i modified it a little bit that if it errors it reloads. Not perfect and loop sensitive but it worked

marcokreeft87 · 2023-10-14T12:01:53Z

Use latest update, and still got this error. Before the update i modified it a little bit that if it errors it reloads. Not perfect and loop sensitive but it worked

Can you share your yaml?

cookie050 · 2023-10-14T12:03:46Z

It js but i can look in backup if i can find it. It updated and i forgot to pull the js before updating.

marcokreeft87 · 2023-10-14T12:08:03Z

I mean your yaml of the Configuration in HA

cookie050 · 2023-10-14T12:10:18Z

But the error and yaml,

Cannot read properties of undefined (reading 'style')

type: custom:room-card
title: Overloop & Sanitair
style: []
cards:
  - type: vertical-stack
    cards:
      - square: true
        columns: 4
        type: grid
        cards:
          - show_name: true
            show_icon: true
            type: button
            tap_action:
              action: toggle
            entity: light.lamp_hal_boven
            name: Hal boven
            icon: mdi:ceiling-light
          - show_name: true
            show_icon: true
            type: button
            tap_action:
              action: toggle
            entity: light.lamp_hal_voordeur
            name: Hal beneden
            icon: mdi:ceiling-light
          - show_name: true
            show_icon: true
            type: button
            tap_action:
              action: toggle
            entity: light.lamp_overloop_z
            name: Overloop
            icon: mdi:ceiling-light
          - show_name: true
            show_icon: true
            type: button
            entity: switch.lamp_zolder_switch
            tap_action:
              action: toggle
            name: Zolder
            icon: mdi:ceiling-light
  - type: vertical-stack
    cards:
      - square: true
        columns: 4
        type: grid
        cards:
          - show_name: true
            show_icon: true
            type: button
            tap_action:
              action: toggle
            entity: light.lamp_badkamer
            name: Badkamer
            icon: mdi:ceiling-light
          - show_name: true
            show_icon: true
            type: button
            tap_action:
              action: toggle
            entity: light.lumi_lumi_switch_l1aeu1_light
            icon: mdi:ceiling-light
            name: Toilet

The style is still in there because i test it if that's the problem .

And still this one time by time

marcokreeft87 · 2023-10-14T12:18:59Z

But why do you use room-card for this? You are using room-card like a container now, and not where it is designed for: Showing entities per room

marcokreeft87 · 2023-10-14T13:04:55Z

Doesn't take away the fact that it should work btw

marcokreeft87 · 2023-10-14T19:00:37Z

@cookie050 can you test it with v1.08.00 thanks to Scott ( don't know your github handle bro ) it should be fixed :)

cookie050 · 2023-10-14T19:07:23Z

Seem to do the trick, have used it on multiple devices all work in one time now :)

marcokreeft87 · 2023-10-14T19:09:17Z

Seem to do the trick, have used it on multiple devices all work in one time now :)

Finally! Haha thanks for testing

marcokreeft87 · 2023-10-14T19:51:14Z

@rummik can you test this?

mdecourcy · 2023-10-14T19:52:16Z

Works for me across several devices so far

NeonOby · 2023-10-15T06:42:32Z

I also tested version 1.08.00 and can not reproduce the problems anymore.
Tested with mobile browser, android app and latest chrome browser.

Thanks, now I can finally use my new dashboard.

rummik added the bug Something isn't working label Oct 21, 2022

marcokreeft87 linked a pull request Oct 14, 2023 that will close this issue

Custom element doesn't exist should be fix #274

Merged

3 tasks

marcokreeft87 closed this as completed in #274 Oct 14, 2023

marcokreeft87 reopened this Oct 14, 2023

marcokreeft87 closed this as completed Oct 14, 2023

Error: "Custom element doesn't exist" on builtin cards #104

Error: "Custom element doesn't exist" on builtin cards #104

Comments

rummik commented Oct 21, 2022

marcokreeft87 commented Oct 21, 2022 • edited Loading

rummik commented Oct 21, 2022 • edited Loading

marcokreeft87 commented Oct 21, 2022

marcokreeft87 commented Oct 21, 2022

rummik commented Oct 21, 2022

marcokreeft87 commented Oct 21, 2022

marcokreeft87 commented Oct 22, 2022

rummik commented Oct 26, 2022

marcokreeft87 commented Oct 26, 2022

omayhemo commented Nov 1, 2022

omayhemo commented Nov 2, 2022

marcokreeft87 commented Nov 2, 2022

marcokreeft87 commented Nov 2, 2022

omayhemo commented Nov 2, 2022

omayhemo commented Nov 3, 2022 • edited Loading

marcokreeft87 commented Nov 3, 2022

omayhemo commented Nov 3, 2022

omayhemo commented Dec 19, 2022

marcokreeft87 commented Dec 19, 2022

csthomas2 commented Feb 8, 2023

marcokreeft87 commented Feb 8, 2023

csthomas2 commented Feb 9, 2023 • edited Loading

marcokreeft87 commented Feb 9, 2023

csthomas2 commented Feb 9, 2023 • edited Loading

marcokreeft87 commented Feb 9, 2023

NeonOby commented Feb 28, 2023

marcokreeft87 commented Feb 28, 2023 • edited Loading

NeonOby commented Mar 1, 2023

marcokreeft87 commented Mar 1, 2023

cookie050 commented Jun 21, 2023

marcokreeft87 commented Jun 21, 2023

paulonutor commented Jun 21, 2023

elninosi commented Jun 26, 2023

paulonutor commented Jun 27, 2023

elninosi commented Jun 27, 2023

marcokreeft87 commented Jun 27, 2023

marcokreeft87 commented Jun 30, 2023

elninosi commented Jun 30, 2023 via email

NeonOby commented Jun 30, 2023

elninosi commented Jul 14, 2023 via email

marcokreeft87 commented Oct 13, 2023

marcokreeft87 commented Oct 14, 2023

cookie050 commented Oct 14, 2023

marcokreeft87 commented Oct 14, 2023

cookie050 commented Oct 14, 2023

marcokreeft87 commented Oct 14, 2023

cookie050 commented Oct 14, 2023 • edited Loading

marcokreeft87 commented Oct 14, 2023

marcokreeft87 commented Oct 14, 2023

marcokreeft87 commented Oct 14, 2023

cookie050 commented Oct 14, 2023

marcokreeft87 commented Oct 14, 2023

marcokreeft87 commented Oct 14, 2023

mdecourcy commented Oct 14, 2023

NeonOby commented Oct 15, 2023

marcokreeft87 commented Oct 21, 2022 •

edited

Loading

rummik commented Oct 21, 2022 •

edited

Loading

omayhemo commented Nov 3, 2022 •

edited

Loading

csthomas2 commented Feb 9, 2023 •

edited

Loading

csthomas2 commented Feb 9, 2023 •

edited

Loading

marcokreeft87 commented Feb 28, 2023 •

edited

Loading

cookie050 commented Oct 14, 2023 •

edited

Loading