From 31a9a6240a30e7ddc301ac62479d76ba83fbaf25 Mon Sep 17 00:00:00 2001
From: Steve Zhang <huigang.zhang@gmail.com>
Date: Mon, 18 May 2026 17:33:44 -0400
Subject: [PATCH] fix: support Edge browser in Dramaturg extension (#901)

- Block edge:// URLs in isAttachableUrl and attachToTab (same as chrome://)
- Update error message to say "browser restricts" instead of "Chrome restricts"
- Add edge:// to isInternalUrl and handleRecord in Toolbar
- Add edge: protocol handling in getTabLabel for correct tab label display
- Update manifest description to say "browser side panel"

Closes #901

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 packages/extension/public/manifest.json             | 2 +-
 packages/extension/src/background.ts                | 5 +++--
 packages/extension/src/panel/components/Toolbar.tsx | 5 +++--
 3 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/packages/extension/public/manifest.json b/packages/extension/public/manifest.json
index 34489abc..0024cab0 100644
--- a/packages/extension/public/manifest.json
+++ b/packages/extension/public/manifest.json
@@ -2,7 +2,7 @@
   "manifest_version": 3,
   "name": "Dramaturg",
   "version": "0.27.4",
-  "description": "Playwright engineer's companion — console, editor, runner, debugger, and recorder in a Chrome side panel.",
+  "description": "Playwright engineer's companion — console, editor, runner, debugger, and recorder in a browser side panel.",
   "permissions": [
     "activeTab",
     "tabs",
diff --git a/packages/extension/src/background.ts b/packages/extension/src/background.ts
index b7bcfb47..b9bccfd6 100644
--- a/packages/extension/src/background.ts
+++ b/packages/extension/src/background.ts
@@ -171,6 +171,7 @@ async function ensureCrxApp(): Promise<CrxApplication> {
 function isAttachableUrl(url: string | undefined): boolean {
   if (!url) return true; // no URL info — let attachToTab decide
   if (url.startsWith('chrome://')) return false;
+  if (url.startsWith('edge://')) return false;
   if (url.startsWith('https://chromewebstore.google.com')) return false;
   if (url.startsWith('chrome-extension://') && !url.startsWith(`chrome-extension://${chrome.runtime.id}/`)) return false;
   return true;
@@ -207,14 +208,14 @@ async function attachToTab(tabId: number): Promise<{ ok: boolean; url?: string;
     const tab = await chrome.tabs.get(tabId);
     const ownOrigin = `chrome-extension://${chrome.runtime.id}/`;
     const url = tab.url ?? '';
-    if (url.startsWith('chrome://') ||
+    if (url.startsWith('chrome://') || url.startsWith('edge://') ||
         (url.startsWith('chrome-extension://') && !url.startsWith(ownOrigin)) ||
         url.startsWith('https://chromewebstore.google.com')) {
       if (activeTabId === tabId) {
         activeTabId = null;
         currentPage = null;
       }
-      return { ok: false, error: 'Cannot attach to this page — Chrome restricts extension access. Navigate to a regular webpage first.' };
+      return { ok: false, error: 'Cannot attach to this page — browser restricts extension access. Navigate to a regular webpage first.' };
     }
 
     const app = await ensureCrxApp();
diff --git a/packages/extension/src/panel/components/Toolbar.tsx b/packages/extension/src/panel/components/Toolbar.tsx
index a6f19b70..3b3a9c1d 100644
--- a/packages/extension/src/panel/components/Toolbar.tsx
+++ b/packages/extension/src/panel/components/Toolbar.tsx
@@ -35,7 +35,7 @@ function Toolbar({ editorContent, editorMode, stepLine, attachedUrl, attachedTab
 
     function isInternalUrl(url: string | undefined) {
         if (!url) return true;
-        return url.startsWith('chrome://') || url.startsWith('chrome-extension://');
+        return url.startsWith('chrome://') || url.startsWith('edge://') || url.startsWith('chrome-extension://');
     }
 
     function getTabLabel(tab: chrome.tabs.Tab): string {
@@ -43,6 +43,7 @@ function Toolbar({ editorContent, editorMode, stepLine, attachedUrl, attachedTab
             if (tab.url?.startsWith('about:')) return tab.url;
             const url = new URL(tab.url!);
             if (url.protocol === 'chrome:') return `chrome://${url.hostname}`;
+            if (url.protocol === 'edge:') return `edge://${url.hostname}`;
             return url.hostname;
         } catch {
             return tab.url ?? '(unknown)';
@@ -282,7 +283,7 @@ function Toolbar({ editorContent, editorMode, stepLine, attachedUrl, attachedTab
 
         setIsRecording(true);
 
-        if (result.url && result.url !== 'about:blank' && !result.url.startsWith('chrome://') && isEditorEmpty()) {
+        if (result.url && result.url !== 'about:blank' && !result.url.startsWith('chrome://') && !result.url.startsWith('edge://') && isEditorEmpty()) {
             const gotoCmd = editorMode === 'js'
                 ? `await page.goto(${JSON.stringify(result.url)});`
                 : `goto "${result.url}"`;