Skip to content

The spinner display and multi-actions are interrupted prematurely #1060

@il77781

Description

@il77781

Checklist

  • I updated the card to the latest version available
  • I cleared the cache of my browser

Describe the bug
I don't think this is a bug, but I've encountered this: after tapping the button, the spinner is displayed for a time that is even shorter than the time specified in the delay parameter (between actions). Consequently, the time for "locking" the button from subsequent taps is also reduced, and the actions specified after the delay parameter are not executed at all... It feels like the multi-actions are interrupted or "reset"... At the same time, of course, it is necessary to say that I do not switch the page on which the button-card is located, nor do I do any other actions...

Version of the card
Version: 5.1.0-dev.3

To Reproduce
This is the configuration I used:

type: custom:button-card
variables:
  cond35: " [[[ return (states['switch.dmaker_p44_7a6c_physical_control_locked'].attributes['physical_controls_locked'] == true) ? true : false ]]] "
  cond36: |
    [[[
      if ((states['switch.dmaker_p44_7a6c_physical_control_locked'].state == 'on' && !variables.cond35)
      || (states['switch.dmaker_p44_7a6c_physical_control_locked'].state == 'off' && variables.cond35))
        return true
      else return false
    ]]]
styles:
  grid:
    - grid-template-areas: "\"Blanc ChLock\" \"Blanc ChLock\""
    - grid-template-columns: 1fr 1fr
    - grid-template-rows: auto
    - gap: 10px
custom_fields:
  Blanc:
    card:
      type: custom:button-card
      name: Blanc
  ChLock:
    card:
      type: custom:button-card
      entity: switch.dmaker_p44_7a6c_physical_control_locked
      name: Child lock
      styles:
        card:
          - opacity: " [[[ if (variables.cond35) return '0.4' ]]] "
        icon:
          - animation: " [[[ if (variables.cond36) return 'blink 1s linear infinite' ]]] "
      tap_action:
        action: multi-actions
        actions:
          - action: perform-action
            perform_action: switch.toggle
            target:
              entity_id: switch.dmaker_p44_7a6c_physical_control_locked
          - delay: 20s
          - action: perform-action
            perform_action: xiaomi_miot.get_properties
            data:
              entity_id: fan.dmaker_p44_7a6c_fan
              update_entity: true
              mapping:
                - siid: 7
                  piid: 1
      state:
        - value: "on"
          styles:
            card:
              - background-color: rgb(158, 158, 158)
              - opacity: " [[[ if (!variables.cond35) return '0.4' ]]] "

But this configuration is working correctly.:

type: custom:button-card
styles:
  grid:
    - grid-template-areas: "\"Blanc ChLock\" \"Blanc ChLock\""
    - grid-template-columns: 1fr 1fr
    - grid-template-rows: auto
    - gap: 10px
custom_fields:
  Blanc:
    card:
      type: custom:button-card
      name: Blanc
  ChLock:
    card:
      type: custom:button-card
      entity: switch.dmaker_p44_7a6c_physical_control_locked
      name: Child lock
      styles:
        card:
          - opacity: " [[[[ if (states['switch.dmaker_p44_7a6c_physical_control_locked'].attributes['physical_controls_locked'] == true) return '0.4' ]]]] "
        icon:
          - animation: |
              [[[[
                if ((states['switch.dmaker_p44_7a6c_physical_control_locked'].state == 'on' && (states['switch.dmaker_p44_7a6c_physical_control_locked'].attributes['physical_controls_locked'] == false))
                || (states['switch.dmaker_p44_7a6c_physical_control_locked'].state == 'off' && (states['switch.dmaker_p44_7a6c_physical_control_locked'].attributes['physical_controls_locked'] == true)))
                  return 'blink 1s linear infinite'
              ]]]]
      tap_action:
        action: multi-actions
        actions:
          - action: perform-action
            perform_action: switch.toggle
            target:
              entity_id: switch.dmaker_p44_7a6c_physical_control_locked
          - delay: 20s
          - action: perform-action
            perform_action: xiaomi_miot.get_properties
            data:
              entity_id: fan.dmaker_p44_7a6c_fan
              update_entity: true
              mapping:
                - siid: 7
                  piid: 1
      state:
        - value: "on"
          styles:
            card:
              - background-color: rgb(158, 158, 158)
              - opacity: " [[[[ if (states['switch.dmaker_p44_7a6c_physical_control_locked'].attributes['physical_controls_locked'] == false) return '0.4' ]]]] "

Expected behavior
Correct display of the spinner and execution of all multi-actions for the configuration specified in the first example

Smartphone (please complete the following information):
Chrome WebView (Android companion app 2025.8.7 - Android 11)
Home Assistant 2025.10.1

Additional context
The two configurations difference is that in the second configuration the JavaScript templates in the nested button-card are enclosed in the "correct" (corresponding to the level of nesting of the button-card) number of square brackets ([[[[ ]]]] instead of [[[ ]]] in the thirst example).
And if the specified delay time between actions is longer than the sensor (which is specified in the JavaScript template in the nested card) update interval, the spinner (and the "blocking" of the card from being tapped) is displayed until the state (or attribute value) of the sensor is updated. At this point, the nested button-card is probably "recalculated" and the multi-actions are reset - actions (after a delay) are not executed...
To be honest, I don't know if there's any way to do something about it... Or if there's even a need to do anything... Maybe, at the very least, it should be specified in the documentation that the number of square brackets for JavaScript templates in the nested cards must be strictly followed, at least when multi-actions are used...
At the same time, of course, I want to say that the "mismatch" in the number of square brackets with the level of nesting of the card works without any problems in all other cases... In my specific case, I used triple square brackets (instead of [[[[ ]]]]) for javascript templates in nested cards to access variables defined in the main ("parent") button-card (as far as I understand, there is currently no other way to do this, maybe this will solve the problem from a different angle)...

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions