Cannot toggle row by tapping on mobile when clickable is set to true
mateuszdrab opened this issue · 9 comments
My Home Assistant version: 2021.11.5
Fold-entity-row version (FROM BROWSER CONSOLE): 20.0.12
What I am doing: Setting a row with the clickable property set to true. Don't want to see the overall group details pane.
What I expected to happen: On both mobile and PC, the row should unfold, tapping the toggle should toggle the group/switch.
What happened instead:
Tapping the row works fine and it unfolds however tapping the toggle does nothing on mobile (tried on an iPhone and Android device) in the home assistant app. I am unable to toggle the group group.ambientlights. On PC, everything works fine.
I've gone ahead and disabled each lovelace module to make sure none conflict and this behavior didn't change. It is only resolved when "clickable: true " is removed.
Minimal steps to reproduce:
type: entities
title: Light Control
entities:
- type: custom:fold-entity-row
head:
entity: group.ambientlights
secondary_info: last-changed
name: Ambient Lights
clickable: true
entities:
- entity: ...
- entity: ...Error messages from the browser console:
Unable to check on mobile
By putting an X in the boxes ([X]) below, I indicate that I:
- Understand that this is a channel for reporting bugs, not a support forum (https://community.home-assistant.io/).
- Have made sure I am using the latest version of the plugin.
- Have followed the troubleshooting steps of the "Common Problems" section of https://github.com/thomasloven/hass-config/wiki/Lovelace-Plugins.
- Understand that leaving one or more boxes unticked or failure to follow the template above may increase the time required to handle my bug-report, or cause it to be closed without further action.
Tried on iPad Air 2 (iOS 15.0.2), I confirm the issue:
type: entities
entities:
- type: custom:fold-entity-row
open: false
clickable: true
padding: 0
head:
entity: input_boolean.test_boolean
entities:
- entity: sun.sun
- entity: sun.sun
- entity: sun.sun
The toggle cannot be toggled.
It can if clickable: false.
As for iPhone 5s (iOS 12.5.5) - the card is not displayed properly (see the code fro the previous post).
This card is the 1st on the page, all other cards below simply are not displayed.
#198
clickable: true is meant as a workaround for exceptional cases.
When you can, you should use
tap_action:
action: fire-dom-event
fold_row: trueinstead.
I have update the readme to clarify this.
This example still not working on iPad Air 2 (iOS 15.0.2): the card is displayed properly, it folds/unfolds, the toggle cannot be changed.
Strange - sometimes I manage to change the toggle!
It happens in ~1 case from 20.
I am tapping on the toggle, it is getting a "ripple effect" but does not change.
And in case if iPhone 5S (which has an old iOS 12.5.5) the toggle changes a bit more often (let's say "~1 case from 10").
That example still isn't using tap_action, though...
This example - I cannot fold/unfold by tapping on the PC (Win10, Chrome)
type: entities
entities:
- type: custom:fold-entity-row
open: false
tap_action:
action: fire-dom-event
fold_row: true
padding: 0
head:
entity: input_boolean.test_boolean
entities:
- entity: sun.sun
- entity: sun.sun
- entity: sun.sun
type: entities
entities:
- type: custom:fold-entity-row
open: false
padding: 0
head:
entity: input_boolean.test_boolean
tap_action:
action: fire-dom-event
fold_row: true
entities:
- entity: sun.sun
- entity: sun.sun
- entity: sun.sun
Oh, I misplaced the tap_action.
Thanks a lot, Thomas!
Unfolds fine on PC, iPad, iPhone.
clickable: trueis meant as a workaround for exceptional cases.
When you can, you should usetap_action: action: fire-dom-event fold_row: trueinstead.
I have update the readme to clarify this.
Thanks! Will check it out in a bit.
So many things on my to-do