frigate-hass-card: Frigate Card Not Found error on some devices

Checklist:

I updated to the latest version available
I cleared the cache of my browser Yes Release with the issue:

Last working release (if known): I believe it still worked with V3.0 RC1 Browser and Operating System: Chrome on WIndows 11

Description of problem: When frigate detects an object, I display the camera feed on a Google Nest Home device. The following is my lovelace card config:

  - type: "custom:frigate-card"
    cameras:
     - camera_name: sideyard
        title: Front Yard
        live_provider: frigate-jsmpeg

I would like to use webrtc, but this has not worked for awhile. Since then I switched to frigate-jsmpeg which only lagged webrtc by a couple seconds and has been working for a couple months now. Since I updated to the latest release, however, I now get an error on the Google Display saying “Custom Element doesn’t exist: frigate-card”. The files exist in the correct directories, so not sure what is going on. The view displays correctly in a browser.

Javascript errors shown in the web inspector (if applicable):

Additional information:

About this issue

Original URL
State: closed
Created 2 years ago
Comments: 25 (11 by maintainers)

Most upvoted comments

I have encountered the same problem on a iPad Mini 2 running iOS 12.5.
Version 4.0.0 of the card doesn’t seem to be loaded properly. On the device it says “Custom Element doesn’t exist: frigate-card”.

The following output can be seen in the Web Inspector:

iMarvinS on Nov 25, 2022

Logger: frontend.js.latest.202304061 Source: components/system_log/init.py:257 First occurred: 6:16:13 AM (9 occurrences) Last logged: 11:47:31 AM

http://hass.fubar.lcl:8123/hacsfiles/frigate-hass-card/card-b71c94d3.js:75:3295 Uncaught SyntaxError: Unexpected token .

It’s been awhile, and I have used the webrtc card because it just worked. Went back and looked and I’m still getting the custom card not found. but this is what is being logged on home assistant (2023.4.1) I’m using core python 3.10 with frigate rc2 card 4 beta

PXL_20230407_175707484 MP

l33tconsultant on Apr 7, 2023

Assuming you are not using a version of the card you built yourself, just wait for v4 (very soon I hope!) and try then. I consider this issue resolved in the code (so no extra debug info is necessary), just not yet released in a public build.

dermotduffy on Jun 24, 2022

Update: Made progress on this. Purchased a Nest hub, got Chrome remote debugging working with Home Assistant casting (future reference: requires building a local version of the cast sender application so you can match the application ID used in the sender application with the same id you associate with your own personal Chromecast device – via the Chromecast Developer Console). All in all, a many step process to get remote debugging working, but without it would be very hard to track down the problem.

The culprit is indeed between the range we were suspecting, it’s the very harmless looking: https://github.com/dermotduffy/frigate-hass-card/pull/373

  if (!lang) {
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
    const hass = (document.querySelector('home-assistant') as any)?.hass;
    lang = hass.selectedLanguage || hass.language;
  }

In the above – on the Chromecast device only – hass ends up undefined, which causes the hass.selectedLanguage to throw an error. Since localization is used everywhere, this immediately kills the card.

So a fairly easy fix. I’m going to have to find another way to get the hass object though if I want to keep translations (which I do) – so I’ll spend a little time experimenting.

I also found a few other problems with the card on cast which I’ll need to work on. I also learned (but some of you likely knew) that video using the streaming component is just plain not supported by HA dashboard casting at the moment (source).

dermotduffy on May 10, 2022

@oyvindhauge I think you may have multiple issues mixed together. If you cannot see the video stream in HA itself (separate from the card), then your issue is with HA or the integration, not the card. The integration would be the right place to file a bug or seek support for that.

With that said, sounds like you are also experiencing the “Frigate Card Not Found” issue on “hub” devices – so lets keep this issue focused on that one.

[Still haven’t found the time to experiment with this on a Samsung TV, I’m hoping that can let me replicate the issue and bisect the 157 commits …]

dermotduffy on Mar 27, 2022

Confirmed. It doesn’t work on samsung tv internet browser, and fails with the same error. Custom Element doesn’t exist: frigate-card

l33tconsultant on Mar 20, 2022

OK – so that means the issue is in this sea of 157 commits: https://github.com/dermotduffy/frigate-hass-card/compare/v3.0.0-rc.1...v3.0.0-rc.2

dermotduffy on Mar 20, 2022