More error checking. Increased stability in safari

js/config_panel/browser-settings-card.ts

@@ -93,6 +93,14 @@ class BrowserModRegisteredBrowsersCard extends LitElement {
                     @change=${this.toggleCameraEnabled}
                   ></ha-switch>
                 </ha-settings-row>
+                ${window.browser_mod?.cameraError
+                  ? html`
+                      <ha-alert alert-type="error">
+                        Setting up the device camera failed. Make sure you have
+                        allowed use of the camera in your browser.
+                      </ha-alert>
+                    `
+                  : ""}
                 ${this._renderInteractionAlert()}
                 ${this._renderFKBSettingsInfo()}
               `

js/plugin/camera.ts

@@ -3,6 +3,7 @@ export const CameraMixin = (SuperClass) => {
     private _video;
     private _canvas;
     private _framerate;
+    public cameraError;
 
     // TODO: Enable WebRTC?
     // https://levelup.gitconnected.com/establishing-the-webrtc-connection-videochat-with-javascript-step-3-48d4ae0e9ea4
@@ -10,6 +11,7 @@ export const CameraMixin = (SuperClass) => {
     constructor() {
       super();
       this._framerate = 2;
+      this.cameraError = false;
 
       this._setup_camera();
     }
@@ -45,14 +47,22 @@ export const CameraMixin = (SuperClass) => {
 
       if (!navigator.mediaDevices) return;
 
-      const stream = await navigator.mediaDevices.getUserMedia({
-        video: true,
-        audio: false,
-      });
+      try {
+        const stream = await navigator.mediaDevices.getUserMedia({
+          video: true,
+          audio: false,
+        });
 
-      video.srcObject = stream;
-      video.play();
-      this.update_camera();
+        video.srcObject = stream;
+        video.play();
+        this.update_camera();
+      } catch (e) {
+        if (e.name !== "NotAllowedError") throw e;
+        else {
+          this.cameraError = true;
+          this.fireEvent("browser-mod-config-update");
+        }
+      }
     }
 
     async update_camera() {

js/plugin/require-interact.ts

@@ -57,14 +57,22 @@ export const RequireInteractMixin = (SuperClass) => {
         vPlay
           .then(() => {
             this._interactionResolve();
+            video.pause();
           })
           .catch((e) => {
-            if (e.name === "AbortError") this._interactionResolve();
+            if (e.name === "AbortError") {
+              this._interactionResolve();
+            }
           });
-        video.pause();
       }
 
-      window.addEventListener("pointerdown", this._interactionResolve);
+      window.addEventListener(
+        "pointerdown",
+        () => {
+          this._interactionResolve();
+        },
+        { once: true }
+      );
 
       // if (this.fully) this._interactionResolve();