Bottom card issue

[exus85]

Hi, I have an issue with sidebar card: when I refresh the page the bottom section of the sidebar doesn't appear and home assistant reports this error: .../hacsfiles/sidebar-card/sidebar-card.js:462:2818 TypeError: a.setConfig is not a function

If I keep refreshing the page it shows up sometimes (with no errors reported) but most of the times it doesn't

browser console error reported: Uncaught TypeError: a.setConfig is not a function firstUpdated http://ipaddress:8123/hacsfiles/sidebar-card/sidebar-card.js:462 setTimeout handlerfirstUpdated http://ipaddress:8123/hacsfiles/sidebar-card/sidebar-card.js:462 performUpdate http://ipaddress:8123/hacsfiles/sidebar-card/sidebar-card.js:134 _enqueueUpdate http://ipaddress:8123/hacsfiles/sidebar-card/sidebar-card.js:134 requestUpdateInternal http://ipaddress:8123/hacsfiles/sidebar-card/sidebar-card.js:134 initialize http://ipaddress:8123/hacsfiles/sidebar-card/sidebar-card.js:134 initialize http://ipaddress:8123/hacsfiles/sidebar-card/sidebar-card.js:159 q http://ipaddress:8123/hacsfiles/sidebar-card/sidebar-card.js:134 K http://ipaddress:8123/hacsfiles/sidebar-card/sidebar-card.js:159 http://ipaddress:8123/hacsfiles/sidebar-card/sidebar-card.js:412 Ie http://ipaddress:8123/hacsfiles/sidebar-card/sidebar-card.js:412 Ie http://ipaddress:8123/hacsfiles/sidebar-card/sidebar-card.js:412 async http://ipaddress:8123/hacsfiles/sidebar-card/sidebar-card.js:661 sidebar-card.js:462:2818

[kongjudas]

I have the same issue on my Lenovo Android using Chrome after upgrading to 2021.12 b1. It doesn't show at all. On my Mac, using Safari, it shows up randomly after some refreshes.

[Gilles-Clemenceau]

Same for me, it just appeared today.

[ivo-gofilex]

Same here, happens every time on HA 2021.12.1 / 0.1.8.3

[wtrbuit]

We are looking into the issue.

[wtrbuit]

@exus85, @kongjudas, @Gilles-Clemenceau and @ivo-gofilex can you provide a snippet of your bottomCard setup?

[ivohulsman]

Here is my bottomCard (I am ivo-gofilex, accidentally posted on the wrong account):

bottomCard:
  type: vertical-stack
  cardOptions:
    cards:
      - type: custom:battery-state-card
        entities:
          - entity: sensor.op8pro_battery_level
            name: "OP8P"
          - entity: sensor.op6_battery_level
            name: "OP6"
          - entity: sensor.liv_tablet_battery_level
            name: "Tablet Office"
  cardStyle: |
    :host {
      width: 100%;
    }

[wtrbuit]

What we have learned so far is that there is an issue with custom cards and with at least vertical-stack cards. Entities card does work. We will update you when we know more.

[Denow]

It seems to be related to a timing issue. If I open another page and then switch to the sidebar page, the bottom card is loaded. When I refresh on the sidebar page the bottom bar card does not load and gives the same error mentioned in this issue.

[Gilles-Clemenceau]

I have a lot of custom elements, but it was working since the last HA core update.

  bottomCard:
    type: vertical-stack
    cardOptions:
      cards:
        - type: custom:meteofrance-weather-card
          style: |
            ha-card {
              background: none;
              color: #fff;
              padding: 0px !important;
            }
          [...]
        - type: horizontal-stack
          style: |
            ha-card {
              background: none;
              color: #fff;              
            }
          cards:
            - type: entity
              entity: sensor.temperature_exterieure_temperature
              name: Exterieur
              style: |
                ha-card {
                  background: none;
                  padding: 0px!important;
                  margin: 0px!important;
                }
            - type: entity
              entity: sensor.temperature_salon_temperature
              name: Salon
              style: |
                ha-card {
                  background: none;
                  padding: 0px!important;
                  margin: 0px!important;
                }
            - type: entity
              entity: sensor.ipx800v4_piscine
              name: Piscine
              style: |
                ha-card {
                  background: none;
                  padding: 0px!important;
                  margin: 0px!important;
                }
        - type: custom:bar-card
          positions:
            icon: 'off'
          min: 0
          max: 5000
          animation:
            '0':
              state: 'on'
          entities:
            - entity: sensor.envoy_current_energy_consumption
              name: Consommation
            - entity: sensor.envoy_current_energy_production
              name: Production
          entity_row: true
    cardStyle: |
      :host {
        width: 100%;
        background: none;
      }

[nyffchanium]

What we have learned so far is that there is an issue with custom cards and with at least vertical-stack cards. Entities card does work. We will update you when we know more.

For me, entities card doesn't work either:

sidebar:
  bottomCard:
    type: entities
    entities:
      - entity: sun.sun

hui-calendar-card.ts:31 Uncaught Error: Entities must be specified
    at HTMLElement.value (hui-calendar-card.ts:31)
    at sidebar-card.js?hacstag=2418255740184:462

Not sure whether the calendar card does have anything to do it.

[mvanlijden]

I also have the same error in my console with initially loading the sidebard bottom card. Switching to another dashboard and back to the dashboard with the sidecard does work. In my mind this error appeared when the 0.1.8.4 update, but this could also be the december HA update.

My config:

  bottomCard:
    type: vertical-stack
    cardStyle: |
      :host {
        width: 100%;
      }
    cardOptions:
      cards:
        - type: weather-forecast
          entity: weather.openweathermap_hourly
          show_forecast: false
          name: ' '
          tap_action:
            action: navigate
            navigation_path: /lovelace-wallpanel/weer-detail
        - type: picture-entity
          camera_image: camera.buienradar
          entity: camera.buienradar
          show_state: false
          show_name: false
          camera_view: live

[pafftis]

Good afternoon, I have the same problem the bottom panel does not work at all. I've tried all your versions. the problem does not go away. Apparently this is due to the latest Ha update I really want you to fix it soon. bottomCard: type: vertical-stack cardOptions: cards: - type: custom:layout-card layout_type: custom:masonry-layout layout: width: 220 max_cols: null cards: - type: custom:simple-weather-card entity: weather.cherepovets name: Череповец tap_action: action: navigate navigation_path: /dashboard-galaxy-tab/weather primary_info: - wind_bearing - humidity secondary_info: - precipitation - precipitation_probability backdrop: day: ' var (- primary-color) ' night: ' # 40445a '

[fammastrodaiuto]

Good afternoon, I have the same problem the bottom panel does not work at all.

Version side bar: 0.1.8.4 Version HA: core-2021.12.7 Version HA Supervisor: Home Assistant OS 7.1

Code: bottomCard: type: horizontal-stack cardOptions: cards: - type: entity-filter entities: - person.michael state_filter: - home card: type: custom:badge-card

Please fix it as soon as possible. Thank you very much!

[Djhik]

Hello, I have this problem too, the display of the lower part of the sidebar is random. I am available to do tests if necessary.

Error:

sidebar-card.js?hacstag=2418255740180:18071 
        
       Uncaught TypeError: cardElement.setConfig is not a function
    at :8123/hacsfiles/sidebar-card/sidebar-card.js?hacstag=2418255740180:18071:33

Info:

• Version HA: core-2021.12.10
• Version Supervisor: supervisor-2022.01.0
• Version Sidebar : 0.1.8.4

Code:

  bottomCard:
    type: vertical-stack
    cardOptions:
      cards:
        - type: 'horizontal-stack'
          cards:
            - type: custom:button-card
              entity: person.perso1
              triggers_update:
                ['person.perso1', 'sensor.time']
              style:
                width: 15%
              tap_action: !include views/popup/perso1.yaml
              hold_action: !include views/popup/perso1.yaml
              template: temp_person2

            - type: custom:button-card
              entity: person.perso2
              triggers_update:
                ['person.perso2', 'sensor.time']
              style:
                width: 15%
              tap_action: !include views/popup/perso2.yaml
              hold_action: !include views/popup/perso2.yaml
              template: temp_person2

        - type: 'custom:mini-media-player'
          entity: media_player.volumio
          hide:
            name: true
            power: true
            source: true
            volume: true

        - type: 'custom:mini-graph-card'
          icon: 'mdi:home-thermometer-outline'
          entities:
            - sensor.sensor_chambre_perso3

[Gilles-Clemenceau]

Any news about this bug ?

[alinalihassan]

I can confirm it's still happening on my setup too. I had two dashboard and on one of them it works properly, the other one it doesn't with the same code, just different views. And if I first go to the functional dashboard, the other one works as well until I refresh.

[Desaydrone]

Hello everyone,

If i write here, of course i got the same problem in the bottom part. But i realise something, when i put a card in my dashboard with the same yaml code i put in the bottom part, it works

A little exemple

[Alindil]

I have the same problem too

[neuroverflow]

It is indeed a "timer issue". Current value is 2ms, I changed it to 5000ms and it loads properly

[Gilles-Clemenceau]

It is indeed a "timer issue". Current value is 2ms, I changed it to 5000ms and it loads properly

Where to change this value?

[flixlix]

It is indeed a "timer issue". Current value is 2ms, I changed it to 5000ms and it loads properly

Where to change this value?

I couldn't find this value either

[neuroverflow]

Line 462 But let's be clear, this is a really ugly patch. Don't forget to delete the .js.gz file and only keep your modified sidebar-card.js as HASS always prefer to read that file first.

[pqpxo]

Hey there!

I attempted to amend the file with the same '5000' value but my HA went into Safe Mode.

Any certain way of making this change?

[Gilles-Clemenceau]

I've made the change but it's not working for me. :-/

[neuroverflow]

Make sure you delete the .gz file if you changed the. Js. Otherwise Hass read the Js inside the archive.

[neuroverflow]

Hey there!

I attempted to amend the file with the same '5000' value but my HA went into Safe Mode.

Any certain way of making this change?

You probably remove a character like the comma. Make sure your editor supports the encoding, avoid notepad ;)

[pqpxo]

Hey there! I attempted to amend the file with the same '5000' value but my HA went into Safe Mode. Any certain way of making this change?

You probably remove a character like the comma. Make sure your editor supports the encoding, avoid notepad ;)

False alarm! It looks like I changed something else and hadn't restarted in quite some time.

Made the correction and now the bottom card works!

[Gilles-Clemenceau]

Make sure you delete the .gz file if you changed the. Js. Otherwise Hass read the Js inside the archive.

Yes & I've checked in lovelace, I can see the modification & the error arrive later. Maybe I have another bug.

[atika1988]

Mindenképpen törölje a .gz fájlt, ha módosította a. Js. Ellenkező esetben Hass elolvasta a J-ket az archívumban.

a .gz where can i find the file? I FOUND IT! :)

.gz has been deleted but still does not appear :(

what the problem?

[ghost]

I think I have a similar issue. My error in the log is:

Logger: frontend.js.latest.202202031 Source: components/system_log/init.py:190 First occurred: 13:14:48 (1 occurrences) Last logged: 13:14:48

http://dietpi:8123/hacsfiles/sidebar-card/sidebar-card.js:462:18967 TypeError: a.setConfig is not a function. (In 'a.setConfig(e)', 'a.setConfig' is undefined)

It's a custom:button that only shows after a refreshing the screen.

Happy to make this a different issue if necessary.