Experimental sections not correctly handling conditional cards on earlier versions of webview

snigehere commented 3 months ago

Checklist

[X] I have updated to the latest available Home Assistant version.
[X] I have cleared the cache of my browser.
[X] I have tried a different browser to see if it is related to my browser.
[X] I have tried reproducing the issue in safe mode to rule out problems with unsupported custom resources.

Describe the issue you are experiencing

When using a conditional card in a section containing multiple cards the card displays a white space when the logic says it should be hidden. This issue occurs on earlier versions of android webview but is ok on later versions.

On a tablet running android 5.01 and webview 95.0.4638.74 the content is hidden but the card remains displayed

On my PC where I run the latest chrome browser and on my phone which runs android 14 the cards are correctly hidden.

In edit mode you can see the conditional cards

If I use mozilla firefox on the android device the display is correct. As far as I understand this is because firefox uses its own webview rather than the system provided one.

Describe the behavior you expected

When the logic of a conditional card is met I expect the whole card to be hidden rather than just the contents

This worked fine using standard views within HA

Steps to reproduce the issue

run with chrome on an old tablet Old tablet with prior versions of webview
define some conditional cards
observe behaviour ...

What version of Home Assistant Core has the issue?

2024.6.1

What was the last working version of Home Assistant Core?

No response

In which browser are you experiencing the issue with?

Google chrome 95.0.4638.74

Which operating system are you using to run this browser?

android 5

State of relevant entities

Example code

type: conditional
conditions:
  - entity: sensor.oven_oven_machine_state
    state: running
card:
  square: false
  columns: 3
  type: grid
  cards:
    - type: entity
      entity: sensor.oven_oven_job_state
      name: Main Oven
      icon: mdi:stove
    - type: entity
      entity: sensor.oven_oven_set_point
      icon: mdi:temperature-celsius
      name: Target
    - type: gauge
      entity: sensor.oven_temperature_measurement
      min: 0
      max: 250
      severity:
        green: 0
        yellow: 80
        red: 160
      needle: true

Problem-relevant frontend configuration

Experimental Section functions

Javascript errors shown in your browser console/inspector

Unable to inspect these values on an android tablet

Additional information

Android 5.01 Android webview 95.0.4638.74

snigehere commented 3 months ago

Just to add here .. while it works with Firefox I am unable to switch to Firefox - the tablet runs fullykiosk to manage what's on the display and fully kiosk uses the tablets android webview code to render pages.

snigehere commented 2 months ago

any updates?

Mosher23 commented 1 month ago

I have same issue in section view. Even conditional card is not displayed it blocks free space.

Same behavior in Firefox and iOS App.

home-assistant / frontend