Stack-in-card "custom element doesn't exist" error

[myriaxis (Francois Boucher)]

Hi,
I’m customizing my dashbord using “Stack-in-card” HACS dashboard integration.
I installed “core-2026.1.3” yesterday and started to see an error box instead of the card.
Custom element doesn't exist: vertical-stack.
Now, this error is not always present.
What I mean by that is: if the error is present and I move to another page, like settings or HACS or another dashboard, and return to the dashboard with the stack-in-card mod, the card is shown correctly (no error). I’m not sure what triggers the error, but at some point I just refreshed the browser and the error showed up.
I’m also using the ios HA companion app on an iPad mini to view the customized dashboard and it shows the same error, but only when I start up the app. If the error is shown, I move to another page, like settings, and when I return to the dashboard, the card is shown correctly.

Can someone please help me diagnose the issue?
Before anyone asks, I did clear the web browser cache and restart HA a few times.

While on the subject, I’m using “stack-in-card”, but I also noticed “vertical-stack-in-card” on HACS. They both seems to have their last update 2 years ago. Which one should I be using? Or, would it be preferable to use the HA Vertical stack card?

Thanks for your help.

[Ildar_Gabdullin]

@myriaxis

Custom element doesn’t exist: vertical-stack

This is strange since the thread is titled “Stack-in-card “custom element doesn’t exist” error”.
Please clarify what card you are trying to use.
Also, which SIMPLIFIED code causes this.
Also, a screenshot of the problem.

Also, purge a browser cache on PC, purge a frontend cache (settings - debug - there is a button) in Companion app.

@myriaxis

’m using “stack-in-card”, but I also noticed “vertical-stack-in-card” on HACS. They both seems to have their last update 2 years ago. Which one should I be using? Or, would it be preferable to use the HA Vertical stack card?

Both have own issues.
Myself using stack-in-card. What does not work as expected - I fix by card-mod.

[myriaxis (Francois Boucher)]

Thanks @Ildar_Gabdullin for the reply.

As I said previously, browser cache was purged, twice.
Frontend cache cleared also.
Problem remains when I refresh the web page.
Problem remains when I open the ios app.
Problem clears when I go to another page and back on both the web page and ios app.

The error message specifically say vertical-stack even if I’m using stack-in-card. But, on the same dashboard, I have a Vertical-stack card and a Stack-in-card card. Could this be the issue?

Here is the code:

views:
  - title: One
    type: sections
    max_columns: 3
    icon: mdi:numeric-1
    sections:
      - type: grid
        cards:
          - type: heading
            heading: Météo
            heading_style: title
          - type: vertical-stack
            cards:
              - clock_style: digital
                clock_size: large
                show_seconds: false
                no_background: false
                type: clock
                face_style: markers
                grid_options:
                  columns: full
                  rows: 2
                card_mod:
                  style: |
                    ha-card {
                      font-style: normal;
                      font-weight: bold;
                      font-family: 'Expansiva', sans-serif;
                      color: var(--primary-color);
                    }
              - show_current: true
                show_forecast: true
                type: weather-forecast
                entity: weather.maison
                forecast_type: daily
      - type: grid
        cards:
          - type: heading
            heading: New section
          - type: custom:stack-in-card
            cards:
              - type: custom:clock-weather-card
                entity: weather.maison
                locale: fr
                weather_icon_type: fill
                hide_clock: false
                hide_date: false
                date_pattern: cccc, d MMMM
                forecast_rows: 3
                show_decimal: true
                hide_forecast_section: true
                card_mod:
                  style: |
                    ha-card {
                      font-family: 'Titan One', sans-serif;
                      color: var(--primary-color);
                    }
              - show_current: false
                show_forecast: true
                type: weather-forecast
                entity: weather.maison
                forecast_type: hourly
                forecast_slots: 6
              - type: custom:clock-weather-card
                entity: weather.maison
                locale: fr
                weather_icon_type: fill
                hide_clock: true
                hide_date: true
                forecast_rows: 3
                show_decimal: true
                hide_today_section: true
    badges:
      - type: entity
        show_name: false
        show_state: true
        show_icon: true
        entity: weather.maison
        state_content:
          - state
          - temperature
    cards: []

[Ildar_Gabdullin]

The error “vertical-stack does not exist” is shown for a section containing “stack-in-card”, no idea why it says so.
Try removing the card & installing it again with HACS.

[myriaxis (Francois Boucher)]

I separated the Vertical Stack and Stack-in-card cards on different dashboards.
I unsinstalled stack-in-card.
I restarted HA.
I reinstalled stack-in-card.
I restarted HA.
I still have the same error, which is corrected when I navigate to other pages.

[Ildar_Gabdullin]

Weird that you see a “vertical-stack does not exist” error.
Just a silly test, can you move your cards to Masonry layout view?

Btw, the stack-in-card does not have “vertical-stack” string in it’s code. So it in unclear which part shows it.
Have you installed the stack-in-card in HACS from an ORIGINAL repo?

[myriaxis (Francois Boucher)]

Copied the stack-in-card card in a masonry dashboard.
Same error and navigation fixes it.
A refresh of the page returns the error.

The error specifies vertical-stack.

[Ildar_Gabdullin]

Then double check if you are using the original stack-in-card

[myriaxis (Francois Boucher)]

[Ildar_Gabdullin]

I am out of versions then. As I said, the stack-in-card cannot say anything about “vertical-stack” since this string is absent in the card’s code.

[myriaxis (Francois Boucher)]

I hear you, but I don’t invent the error.

In the hope of isolating the problem, I deleted the dashboard with the Vertical Stack card and restarted HA.
Now, the error is permanent on the stack-in-card card. Even if I navigate to another page, the error remains.
It sounds like the stack-in-card integration is intertwined with the vertical-card HA card.

Tomorrow I’ll reinstall yesterday’s backup and see if the problem was there as well.

In the mean time, @Ildar_Gabdullin, can you have a look at my other post?

How to use a custom entity-picture in Mushroom Climate card

Hi, I’m trying to change the entity icon picture in a Mushroom Climate card and struggling to find the solution. I managed to do it in a Mushroom Template card, but would prefer to do it in a Mushroom Climate card. Here is my code in the Mushroom Template card: type: custom:mushroom-template-card entity: climate.neviweb130_climate_salle_a_diner features_position: bottom primary: "{{ state_attr(entity, 'temperature') }}" picture: | {% set heat_level = state_attr(entity, 'heat_level') | floa…

Thanks

[Ildar_Gabdullin]

@myriaxis

It sounds like the stack-in-card integration is intertwined with the vertical-card HA card.

I will think about it once again.
Internally the “stack-in-card” uses a “hui-vertical-stack-card” element which internally in HA Frontend is considered as a “custom element” - in fact all UI elements in the Frontend code are “custom” (apart from a standard abstract LItElement and imported 3rd party buttons, checkboxes etc).
My guess is that due to some unknown for me reasons Frontend glitches with that “hui-vertical-stack-card” element, just a fruitless speculation…

@myriaxis

can you have a look at my other post?

Would be glad to help, but I am not using Mushrooms, sorry ((((

[LiQuid_cOOled]

I am fairly certain this is the second person to experience this. I’ll look back at my previous conversation with that user to verify. It was a head scratcher!!

[myriaxis (Francois Boucher)]

Thanks @LiQuid_cOOled for your help.
Reading your previous conversation, it ends with no solution, unless you conversed privately with the OP afterward.

I’ll install a previous backup and see if I have the same problem. I’ll keep you posted.

[LiQuid_cOOled]

The conversation went to DMs, but yes, we did not identify the source. It may be worth comparing the other user’s code with yours…

[myriaxis (Francois Boucher)]

I reinstalled a backup from when I started playing around with stack-in-card and the problem showed up.
I installed a fresh install with hacs and stack-in-card only and the problem isn’t there.

So, there is definitely something wrong in my setup. I’ll try with an even older backup.

Also, when I install card-mod, the readme indicates that I have to add it to the configuration.yaml like:

frontend:
  extra_module_url:
    - /hacsfiles/lovelace-card-mod/card-mod.js?hacstag=12345678901

Do I have to do the same thing with stack-in-card and clock-weather-card?

[Ildar_Gabdullin]

@myriaxis

Do I have to do the same thing with stack-in-card and clock-weather-card?

Not needed.

@myriaxis

readme indicates that I have to add it to the configuration.yaml like:

Guess you may register card-mod ONLY as “extra_module_url” (not as a resource too what HACS automatically did for you) - unless you use cast (then card-mod must be registered as a resource too).

[myriaxis (Francois Boucher)]

In my previous install, with the error message, I listed all the dashboard javascript resources under extra_module_url: as indicated by card-mod.
Could this be the source of the problem?

[Ildar_Gabdullin]

@myriaxis

Could this be the source of the problem?

yes, probably, that is why I asked how the card was installed…

[myriaxis (Francois Boucher)]

@Ildar_Gabdullin, just to confirm, I should replace:

frontend:
  themes: !include_dir_merge_named themes
  extra_module_url:
    - /hacsfiles/button-card/button-card.js?hacstag=146194325701
    - /hacsfiles/lovelace-card-mod/card-mod.js?hacstag=190927524410
    - /hacsfiles/lovelace-mushroom/mushroom.js?hacstag=444350375509
    - /hacsfiles/stack-in-card/stack-in-card.js?hacstag=248954055020
    - /hacsfiles/clock-weather-card/clock-weather-card.js?hacstag=522634019292

with only this:

frontend:
  themes: !include_dir_merge_named themes
  extra_module_url:
    - /hacsfiles/lovelace-card-mod/card-mod.js?hacstag=190927524410

since they are all declared by HACS in the Dashboard/resources section.
Right?