From 248588371ab00a5cab76d5da127fd954cd4f34f9 Mon Sep 17 00:00:00 2001
From: "irvingouj@Devolutions" <jou@devolutions.net>
Date: Mon, 24 Mar 2025 17:55:39 -0400
Subject: [PATCH] fix(web): re-introduce shadow root but also delegate focus
 (#717)

---
 .../iron-remote-gui/src/iron-remote-gui.svelte | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

diff --git a/web-client/iron-remote-gui/src/iron-remote-gui.svelte b/web-client/iron-remote-gui/src/iron-remote-gui.svelte
index 8cc2ffe6..af261776 100644
--- a/web-client/iron-remote-gui/src/iron-remote-gui.svelte
+++ b/web-client/iron-remote-gui/src/iron-remote-gui.svelte
@@ -1,4 +1,17 @@
-<svelte:options customElement={{ tag: 'iron-remote-gui', shadow: 'none' }} />
+<svelte:options
+    customElement={{
+        tag: 'iron-remote-gui',
+        shadow: 'none',
+        extend: (elementConstructor) => {
+            return class extends elementConstructor {
+                constructor() {
+                    super();
+                    this.attachShadow({ mode: 'open', delegatesFocus: true });
+                }
+            };
+        },
+    }}
+/>
 
 <script lang="ts">
     import { onMount } from 'svelte';
@@ -28,8 +41,7 @@
             capturingInputs: ${document.activeElement === canvas}
             current active element: ${document.activeElement}
         `);
-
-        return document.activeElement === canvas;
+        return document.activeElement?.shadowRoot?.firstElementChild === inner;
     };
 
     let inner: HTMLDivElement;