iPhone Custom Element Doesn't exist

[jn3va]

I have an iPhone XR with iOS 15.5 The latest HomeAssistant mobile app I'm using the latest SAK from HACS v2.4.6 Home Assistant is 2023.4.4

lovelace:
  mode: storage
  # Add yaml dashboards
  dashboards:
    sak-examples:
      mode: yaml
      title: Swiss Army Knife Examples
      icon: mdi:hospital-box
      show_in_sidebar: true
      filename: sak-examples-dashboard.yaml

I was able to get the examples to run on Chrome and Edge on Windows and also on a Fire Tablet running Fully Kiosk browser

The iPhone is the only endpoint that will not work.

In sak-examples-dashboard.yaml I've commented out all of the views except sake7

When the dashboard loads on the iPhone I briefly see the title flash up Swiss Army Knife Examples and then get an error: Custom element doesn't exist: swiss-army-knife-card

I also tried this with views 5 and 9 (sake5.yml and sake9.yml) with the same result. The boards will display on all devices but the iPhone

I've tried clearing the iPhone app cache by off-loading and re-installing the HomeAssistant app. I've also tried clearing the safari browser cache restarting home assistant several times

The declutter card seems to load (no errors and its listed above the SAK-card in the sake7.yml) as well as other custom cards (e.g. custom-button apex etc.) with no issues

Anyone else seen this and have any solutions to try?

[github-actions[bot]]

Thank you for creating your first issue for the Swiss Army Knife custom card!

[stinobook]

Have you tried this ?

It's in the app settings under debugging at the bottom

[jn3va]

Hi Stinobook. The current version of the app doesn't appear to have that option. I deleted the app and re-installed which should do the same as clearing the cache but that did not work. Thank you for the suggestion. I will keep looking!

[stinobook]

i dont know its in different places because im an admin and the mrs is not or because she has android and i have ios. for me it is hidden here: menu (where you can select overview, history, ...) settings (main settings for your HASS server) companion app debugging (all the way at the bottom)

For her she has to press menu -> her name

[AmoebeLabs]

Resetting the frontend cache after installation and updates is very important. The companion apps caches a lot for performance reasons, but after a software or yaml view update that results in things getting mixed up (old and new definitions and software), and thus crashes.

With every small change I make during development, I have to clear the mobile caches, otherwise I don’t see those changes.

your iPhone should simply work. I can’t test anymore for iOS 15, but it should not crash!

[AmoebeLabs]

You must have the following folder in your config:

Now try the following to find out if alphabetic order is the problem:

• rename the folders, and only the folders to the following to force ordering:
  • a-colorstops
  • b-swatches
  • c-derived
  • d-toolsets
  • z-layouts

I already renamed swatches folder to cswatches to fix swatches templates not found.

See if that helps. Don't forget to clear all caches on mobile and desktop browser.

[jn3va]

This appears to be an iOS issue. I ended up upgrading iOS from 15.5 to 16.5 and now its working. So I assume there was something the previous browser engine in iOS 15 did not support. I don't have all of the folders listed above in templates though (but it's working). I'm missing swatches. I am hoping to get back and design some dashboards this weekend and if any issues I'll check the folders.

[jn3va]

Resetting the frontend cache after installation and updates is very important. The companion apps caches a lot for performance reasons, but after a software or yaml view update that results in things getting mixed up (old and new definitions and software), and thus crashes.

With every small change I make during development, I have to clear the mobile caches, otherwise I don’t see those changes.

your iPhone should simply work. I can’t test anymore for iOS 15, but it should not crash!

I wanted to mention in case it helps anyone else - you might not always need to reset the front end cache after making a change to a dashboard yaml code. In my config I have \config\lovelace\views\sak-example-views and in this folder file like view-sake5.yml The dashboard that references this view is \config\sak-examples-dashboard.yaml

If I make a change to sake5.yml, in order for the change to be seen, just add a couple spaces to any line in sak-examples-dashboard.yaml and then hit refresh on the browser. That should be enough (at least on the desktop) to get it to recognize something new needs to be loaded without needing to clear the browser cache.

[jn3va]

Marco - this is a beautiful and awesome addition to home assistant. Thanks for creating this! I'm leaving this open in case any other questions or comment but can close this in a few days if nothing else. Thanks to you and stinobook for your tips and help!

[Makhuta]

I have similar problem except I am using Android. I tried clearing app and browser cache, even tried full reinstall of both neither of this helped to me. I am sure that I installed everything right because if I try to comment out the "include" of swiss module in recources it even shows error on PC otherwise not showing any error whatsoever. I am helpless, I tried everything I was able to find most of the things helped in some way but not with the "swiss". Any help will be appreciated.

Home Assistant app version is the latest server version is also latest. Browser tried (on Android) was Opera and Chrome. Android version: 9