Buttons on Mobile App not displayed, just an error message

KattenJansson1974 commented 1 year ago

Checklist

[x] I updated the card to the latest version available
[x] I cleared the cache of my browser

Describe the bug Buttons does not work on mobile app. Everything worked before 2023.4.x of Home Assistant.

Version of the card Version: 3.5.0

To Reproduce This is the configuration I used:

            - entity: input_boolean.skalskydd_alarm_on_natt
              template: standard
              name: Ytterdörr, natt
              type: 'custom:button-card'
              show_state: true
              variables:
                color_seconds: 120
              state:
                - value: 'on'
                  color: 'rgb(255, 255, 0)'
                  color_type: icon
                  icon: "mdi:shield-home"
                - value: 'off'
                  # color: 'rgb(weather-night)'
                  # color_type: icon
                  color: 'rgb(255, 0, 0)'
                  icon: "mdi:shield-home"
              tap_action:
                action: toggle
                confirmation:
                  text: |
                        Vill du sätta PÅ eller stänga AV larm för ytterdörr nattetid?

Screenshots Mobile app: HA Companion

MacBook

Expected behavior The buttons is not displayed, instead there is an error message beginning with "Null is not an object (evaluating 't.config')" Desktop (please complete the following information):

Browser Chrome
Version 111.0.5563.146

Smartphone (please complete the following information):

Device: iPhone 12
OS: [e.g. iOS 16.4.1
Browser Safari
Version 16

Additional context Verified on Home Assistant v2023.4.0 and v2023.4.1

Mariusthvdb commented 1 year ago

you need to reset frontend cash. In the app settings.

KattenJansson1974 commented 1 year ago

Silly me... thanks a million.

barnes-dev commented 1 year ago

I am having the same problem. What do you mean reset frontend cash. In the app settings. dash-experiments.zip

Mariusthvdb commented 1 year ago

Go to settings/companion app/ error tracking (scroll all the way down ) and click reset Frontend cache...

This is all standard procedure for any change in the app cache, and has nothing to do with button-card perse.

barnes-dev commented 1 year ago

I did all that - and I have rebooted Home Assistant. Also in chrome I have reset that cache and did a page refresh.

No prevail.

I am familiar with debugging and just doing a paged refresh used to work unless it was a picture that changed. Then in chrome I would clear the cache. None of that is working now.

barnes-dev commented 1 year ago

It seems like the template line is not working for me in button_card.

Integration version: 1.31.0 Frontend version: 20220906112053 Home Assistant 2023.4.1 Supervisor 2023.04.0 Frontend 20230406.1 - latest

not sure how to tell the version of button_card

Mariusthvdb commented 1 year ago

Now there might be the problem ..

Check inspector and the card version is displayed

barnes-dev commented 1 year ago

I am not sure I know how to do that. Can you help?

Mariusthvdb commented 1 year ago

You should all really learn how to help yourself a bit more .

Google Browser inspector ...

If you made it, click Console. et voila!

barnes-dev commented 1 year ago

BUTTON-CARD Version 3.5.0

barnes-dev commented 1 year ago

Thanks - I got there - just took me a minute

barnes-dev commented 1 year ago

Here is what I see:

create-element-base.ts:182 card custom:button-card TypeError: Cannot read properties of null (reading 'config') at button-card.js:547:177 at Array.forEach () at Je._configFromLLTemplates (button-card.js:547:141) at Je.setConfig (button-card.js:547:1211) at a (create-element-base.ts:97:11) at create-element-base.ts:111:12 at u (create-element-base.ts:215:12) at d (create-element-base.ts:172:12) at w (create-card-element.ts:98:3) at r.value (hui-view.ts:64:21)

barnes-dev commented 1 year ago

Just to confirm. I have not fixed the issue yet. Also - This used to work. I reduced the code to this snippet for diagnosis purposes.

It seems that when I call a template from within my button card it fails.
My server did a bunch of upgrades all at once (including supervisor, HACS and minimalist. I have my button_card_templates located under minimalists and when I copied them back after the upgrade (this usually works) it did not fix the issue. Inside of my desktops I use: !include_dir_merge_named "../../custom_components/ui_lovelace_minimalist/__ui_minimalist__/ulm_templates/" So far I have diagnosed to this snippet. Do I need to log a ticket?

Thanks for all your help!

confucius78 commented 1 year ago

Not sure if it helps, but this is also causing the same error. Maybe it helps pinpoint the issue?

button_card_templates:
  scene_button:
    variables:
      var_scene: auto
    type: custom:button-card
    entity: '[[[ return entity ]]]'
    hold_action:
      action: none
    tap_action:
      action: call-service
      service: input_select.select_option
      service_data:
        option: '[[[ return variables.var_scene ]]]'
        entity_id: '[[[ return entity.entity_id ]]]'
    show_last_changed: false
    show_name: false
    show_state: false
    icon: '[[[ return icon ]]]'
    state:
      - styles:
          icon:
            - color: var(--paper-item-icon-active-color)
            - height: 20px
        value: '[[[ return variables.var_scene ]]]'
    styles:
      icon:
        - color: var(--paper-item-icon-color)
        - height: 20px
        - padding: 0px 0px 0px 0px
        - margin: 0% 0% 0% 0%
      card:
        - border: solid 2px var(--border-color);
        - box-shadow: none
        - border-radius: 10px
        - padding: 2px 2px 2px 2px
        - margin: 75% 5% 5% 5%
        - '--paper-card-background-color': rgba(0, 0, 0, 0)
        - height: 35px
        - opacity: 0.85
      label:
        - justify-self: left
        - font-size: 12px
        - padding: 0px 0px 0px 0px
        - color: var(--secondary-text-color)
      name:
        - justify-self: left
        - font-size: 14px
        - padding: 0px 0px 0px 0px
        - color: var(--primary-text-color)
      state:
        - justify-self: left
        - font-size: 12px
        - padding: 0px 0px 0px 0px
        - color: var(--secondary-text-color)
views:
  - title: Home
    cards:
      - type: horizontal-stack
        cards:
          - type: entities
            title: Attic hall
            show_header_toggle: false
            entities:
              - card_type: horizontal-stack
                cards:
                  - type: custom:button-card
                    variables:
                      var_scene: auto
                    entity: input_select.scene_mode_attic_hall
                    icon: mdi:lightbulb-auto
                    template: scene_button
                type: custom:hui-element
            style:
              .: |
                ha-card {
                  text-primary-color: white;
                  border: solid 1px var(--border-color);
                  margin: 2px;
                  border-radius: 10px;
                }
                ha-card div.header {
                  padding-top: 2px;
                  padding-bottom: 3px;
                  font-size: 2;
                }
                ha-card div.name{
                  color: white;
                  font-size: 15px;
                }
                ha-card div.card-footer.name {
                  color: white;
                }

Mariusthvdb commented 1 year ago

If anything would be amiss, you'd help us help you find it by posting a minimum config that fails, and not these huge configs we can't oversee.

There could be anything wrong there unrelated to button-card.

Please do some extra testing and narrow it down

barnes-dev commented 1 year ago

I just want to say that you have an excellent product. I found my problem - And a stupid one at that. I have been having network modem issues and I did a redownload of the button card. WaLa! Everything works great as usual.

I hope you have a Great Day. How do I buy you a drink?

Mariusthvdb commented 1 year ago

Silly me... thanks a million.

please close the issue?

lmagyar commented 1 year ago

DELETED, I didn't notice the HACS/card update, sorry...

barnes-dev commented 1 year ago

Mine seems to be okay after the update. The only issues I have are excessive swap and some broken lamba entities Sawp issue started the 8th at 1:30pm mst. Trying to figure out what happened at that time. But that is a different problem. Sure is strange - after a year of no issues - all of a sudden I had 5 problems to troubleshoot. Alot of my integrations needed to be reinstalled.

On Sun, Apr 9, 2023, 12:03 PM Laszlo Magyar @.***> wrote:

Please don't close, after upgrading to HA 2023.4.2 from 2023.4.1, my desktop stopped working also.

On all HA devices.

Restarted HA, browser reloads, no help.

Something has changed in HA frontend in 2023.4.2. :(

button_card_templates: actuator: show_name: false styles: card:

padding: 2px icon:

padding: 0px

height: 30px tap_action: action: toggle state:

value: 'on' color: var(--state-active-color)

value: 'off' color: var(--state-icon-color) tri_state: tap_action: action: more-info state:

value: 'on' color: var(--state-active-color) styles: icon:

filter: brightness(100%)

value: idle color: var(--state-active-color) styles: icon:

filter: brightness(75%)

value: 'off' color: var(--state-icon-color) styles: icon:

filter: brightness(100%) is_active: show_name: false styles: card:

padding: 2px icon:

padding: 0px

height: 30px tap_action: action: none state:

value: 'on' color: var(--state-active-color)

value: 'off' color: var(--state-icon-color) air_conditioner: show_name: false showlabel: true label: '[[[ return entity.state.replace("", " ") ]]]' styles: grid:

grid-template-columns: 15% 35% 35% 15%

grid-template-areas: '". i l ."' card:

padding: 2px icon:

padding: 0px

height: 30px label:

text-transform: capitalize

font-size: 90%

color: var(--primary-text-color) tap_action: action: more-info state:

value: 'off' color: var(--state-icon-color)

value: fan color: var(--state-active-color) icon: hass:fan

value: heat color: var(--state-active-color) icon: hass:fire

value: heat_idle color: var(--state-icon-color) icon: hass:fire

value: dry color: var(--state-active-color) icon: hass:water-percent

value: dry_idle color: var(--state-icon-color) icon: hass:water-percent

value: cool color: var(--state-active-color) icon: hass:snowflake

value: cool_idle color: var(--state-icon-color) icon: hass:snowflake dimmed_icon: show_label: true label: '[[[ return variables.value.replace("unavailable", "") ]]]' styles: grid:

grid-template-columns: 75% 25%

grid-template-areas: '"i l"' card:

padding: 2px icon:

padding: 0px

height: 30px label:

font-size: 90%

padding-right: 10px

color: var(--primary-text-color) state:

operator: template value: '[[[ return variables.value == "unavailable" ]]]' color: var(--state-unavailable-color)

operator: template value: '[[[ return variables.value == 0 ]]]' color: var(--state-icon-color)

operator: template value: '[[[ return variables.value != 0 ]]]' color: var(--state-active-color) styles: icon:

filter: >- [[[ return "brightness(" + Math.pow(variables.value / 100, 0.3)

100 + "%)" ]]] wifi: triggers_update:

'[[[ return "sensor." + variables.device_name + "_signal" ]]]'

'[[[ return "sensor." + variables.device_name + "_last_restart_time" ]]]'

'[[[ return "sensor." + variables.device_name + "_restart_reason" ]]]'

'[[[ return "sensor." + variables.device_name + "_ip" ]]]'

'[[[ return "sensor." + variables.device_name + "_firmware_version" ]]]' custom_fields: gauge: card: type: gauge entity: '[[[ return "sensor." + variables.device_name + "_signal" ]]]' name: '[[[ return variables.name ]]]' max: -50 severity: green: -67 yellow: -80 red: -90 min: -90 style: | .type-gauge { padding: 4px; padding-bottom: 16px; border-style: none; } .name { font-size: 80% !important; } time: >- [[[ return (new Date(states["sensor." + variables.device_name + "_last_restart_time"].state)).toLocaleString("sv-SE").substring(5).replace("-", ".") ]]] reason: >- [[[ return states["sensor." + variables.device_name + "_restart_reason"].state.replace("Software/System r", "R").replace("External System", "Reset").replace("Hardware ", "") ]]] ip: '[[[ return states["sensor." + variables.device_name + "_ip"].state ]]]' firmware: >- [[[ return states["sensor." + variables.device_name + "_firmware_version"].state ]]] styles: grid:

grid-template-areas: '"gauge" "time" "reason" "ip" "firmware"' custom_fields: time:

font-size: 75% reason:

font-size: 75%

font-weight: bold ip:

font-size: 75%

text-decoration: underline firmware:

font-size: 66%

font-style: oblique views:

icon: hass:wifi badges: [] cards:

type: grid cards:

type: conditional conditions:

entity: sensor.living_room_signal state_not: unavailable card: type: custom:button-card template: wifi variables: device_name: living_room name: Living room

— Reply to this email directly, view it on GitHub https://github.com/custom-cards/button-card/issues/680#issuecomment-1501182328, or unsubscribe https://github.com/notifications/unsubscribe-auth/ANF5OVT3UL6QICBKEEOGMG3XAL2X5ANCNFSM6AAAAAAWWZIMVM . You are receiving this because you commented.Message ID: @.***>

Mariusthvdb commented 1 year ago

@KattenJansson1974 please close this issue, as this has been long resolved.

custom-cards / button-card

Buttons on Mobile App not displayed, just an error message #680