@playwright-repl/runner 0.21.6 → 0.21.7

package/dist/chrome-extension/devtools/console.js

@@ -1,17 +1,33 @@
 import "../modulepreload-polyfill.js";
 import { c as clientExports, j as jsxRuntimeExports, r as reactExports } from "../index.js";
-import { aa as panelReducer, ab as initialState, g as attachToTab, ac as onConsoleEvent, a5 as Console } from "../index2.js";
+import { aa as panelReducer, ab as initialState, ac as onConsoleEvent, a5 as Console, g as attachToTab } from "../index2.js";
 import "../sw-debugger-core.js";
 function DevToolsConsole() {
   const [state, dispatch] = reactExports.useReducer(panelReducer, initialState);
   reactExports.useEffect(() => {
-    if (chrome.devtools?.inspectedWindow) {
-      const tabId = chrome.devtools.inspectedWindow.tabId;
-      attachToTab(tabId).then((res) => {
-        if (res.ok && res.url)
-          dispatch({ type: "ATTACH_SUCCESS", url: res.url, tabId });
-      }).catch((e) => console.warn("[pw-repl] auto-attach failed:", e));
+    const inspectedTabId = chrome.devtools?.inspectedWindow?.tabId;
+    async function doAttach(tabId) {
+      const [res, tab] = await Promise.all([
+        attachToTab(tabId),
+        chrome.tabs.get(tabId).catch(() => null)
+      ]);
+      if (res.ok && res.url) {
+        const idx = (tab?.index ?? 0) + 1;
+        dispatch({ type: "ATTACH_SUCCESS", url: res.url, tabId });
+        dispatch({ type: "ADD_LINE", line: { text: `Attached to tab ${idx}: ${res.url}`, type: "info" } });
+      }
+    }
+    if (inspectedTabId) {
+      doAttach(inspectedTabId).catch((e) => console.warn("[pw-repl] auto-attach failed:", e));
     }
+    const onActivated = (info) => {
+      if (!inspectedTabId || info.tabId !== inspectedTabId) return;
+      doAttach(inspectedTabId).catch((e) => console.warn("[pw-repl] re-attach failed:", e));
+    };
+    chrome.tabs.onActivated.addListener(onActivated);
+    return () => {
+      chrome.tabs.onActivated.removeListener(onActivated);
+    };
   }, []);
   reactExports.useEffect(() => {
     onConsoleEvent((level, args) => {

package/dist/chrome-extension/devtools/console.js.map

@@ -1 +1 @@
-{"version":3,"file":"console.js","sources":["../../src/devtools/console.tsx"],"sourcesContent":["/**\r\n * DevTools REPL Console — mounts the Console component in a DevTools panel.\r\n */\r\nimport '../panel/panel.css';\r\nimport { createRoot } from 'react-dom/client';\r\nimport { useReducer, useEffect } from 'react';\r\nimport { panelReducer, initialState } from '../panel/reducer';\r\nimport { attachToTab } from '../panel/lib/bridge';\r\nimport { Console } from '../panel/components/Console';\r\nimport { onConsoleEvent } from '../panel/lib/sw-debugger';\r\n\r\nfunction DevToolsConsole() {\r\n  const [state, dispatch] = useReducer(panelReducer, initialState);\r\n\r\n  // Auto-attach to the inspected tab\r\n  useEffect(() => {\r\n    if (chrome.devtools?.inspectedWindow) {\r\n      const tabId = chrome.devtools.inspectedWindow.tabId;\r\n      attachToTab(tabId).then(res => {\r\n        if (res.ok && res.url)\r\n          dispatch({ type: 'ATTACH_SUCCESS', url: res.url, tabId });\r\n      }).catch(e => console.warn('[pw-repl] auto-attach failed:', e));\r\n    }\r\n  }, []);\r\n\r\n  // Forward console.log/error from the page\r\n  useEffect(() => {\r\n    onConsoleEvent((level, args) => {\r\n      for (const arg of args) {\r\n        const type = level === 'error' ? 'error' : level === 'warn' ? 'info' : 'success';\r\n        dispatch({ type: 'ADD_LINE', line: { text: '', type, value: arg } });\r\n      }\r\n    });\r\n    return () => onConsoleEvent(null);\r\n  }, [dispatch]);\r\n\r\n  return <Console outputLines={state.outputLines} dispatch={dispatch} />;\r\n}\r\n\r\ncreateRoot(document.getElementById('root')!).render(<DevToolsConsole />);\r\n"],"names":["useReducer","useEffect","jsx","createRoot"],"mappings":";;;;AAWA,SAAS,kBAAkB;AACzB,QAAM,CAAC,OAAO,QAAQ,IAAIA,aAAAA,WAAW,cAAc,YAAY;AAG/DC,eAAAA,UAAU,MAAM;AACd,QAAI,OAAO,UAAU,iBAAiB;AACpC,YAAM,QAAQ,OAAO,SAAS,gBAAgB;AAC9C,kBAAY,KAAK,EAAE,KAAK,CAAA,QAAO;AAC7B,YAAI,IAAI,MAAM,IAAI;AAChB,mBAAS,EAAE,MAAM,kBAAkB,KAAK,IAAI,KAAK,OAAO;AAAA,MAC5D,CAAC,EAAE,MAAM,CAAA,MAAK,QAAQ,KAAK,iCAAiC,CAAC,CAAC;AAAA,IAChE;AAAA,EACF,GAAG,CAAA,CAAE;AAGLA,eAAAA,UAAU,MAAM;AACd,mBAAe,CAAC,OAAO,SAAS;AAC9B,iBAAW,OAAO,MAAM;AACtB,cAAM,OAAO,UAAU,UAAU,UAAU,UAAU,SAAS,SAAS;AACvE,iBAAS,EAAE,MAAM,YAAY,MAAM,EAAE,MAAM,IAAI,MAAM,OAAO,IAAA,EAAI,CAAG;AAAA,MACrE;AAAA,IACF,CAAC;AACD,WAAO,MAAM,eAAe,IAAI;AAAA,EAClC,GAAG,CAAC,QAAQ,CAAC;AAEb,SAAOC,kCAAAA,IAAC,SAAA,EAAQ,aAAa,MAAM,aAAa,UAAoB;AACtE;AAEAC,cAAAA,WAAW,SAAS,eAAe,MAAM,CAAE,EAAE,OAAOD,kCAAAA,IAAC,mBAAgB,CAAE;"}
+{"version":3,"file":"console.js","sources":["../../src/devtools/console.tsx"],"sourcesContent":["/**\r\n * DevTools REPL Console — mounts the Console component in a DevTools panel.\r\n */\r\nimport '../panel/panel.css';\r\nimport { createRoot } from 'react-dom/client';\r\nimport { useReducer, useEffect } from 'react';\r\nimport { panelReducer, initialState } from '../panel/reducer';\r\nimport { attachToTab } from '../panel/lib/bridge';\r\nimport { Console } from '../panel/components/Console';\r\nimport { onConsoleEvent } from '../panel/lib/sw-debugger';\r\n\r\nfunction DevToolsConsole() {\r\n  const [state, dispatch] = useReducer(panelReducer, initialState);\r\n  // Auto-attach to the inspected tab, re-attach when user switches back\r\n  useEffect(() => {\r\n    const inspectedTabId = chrome.devtools?.inspectedWindow?.tabId;\r\n\r\n    async function doAttach(tabId: number) {\r\n      const [res, tab] = await Promise.all([\r\n        attachToTab(tabId),\r\n        chrome.tabs.get(tabId).catch(() => null),\r\n      ]);\r\n      if (res.ok && res.url) {\r\n        const idx = (tab?.index ?? 0) + 1;\r\n        dispatch({ type: 'ATTACH_SUCCESS', url: res.url, tabId });\r\n        dispatch({ type: 'ADD_LINE', line: { text: `Attached to tab ${idx}: ${res.url}`, type: 'info' } });\r\n      }\r\n    }\r\n\r\n    if (inspectedTabId) {\r\n      doAttach(inspectedTabId).catch(e => console.warn('[pw-repl] auto-attach failed:', e));\r\n    }\r\n\r\n    const onActivated = (info: chrome.tabs.TabActiveInfo) => {\r\n      if (!inspectedTabId || info.tabId !== inspectedTabId) return;\r\n      doAttach(inspectedTabId).catch(e => console.warn('[pw-repl] re-attach failed:', e));\r\n    };\r\n    chrome.tabs.onActivated.addListener(onActivated);\r\n\r\n    return () => {\r\n      chrome.tabs.onActivated.removeListener(onActivated);\r\n    };\r\n  }, []);\r\n\r\n  // Forward console.log/error from the page\r\n  useEffect(() => {\r\n    onConsoleEvent((level, args) => {\r\n      for (const arg of args) {\r\n        const type = level === 'error' ? 'error' : level === 'warn' ? 'info' : 'success';\r\n        dispatch({ type: 'ADD_LINE', line: { text: '', type, value: arg } });\r\n      }\r\n    });\r\n    return () => onConsoleEvent(null);\r\n  }, [dispatch]);\r\n\r\n  return <Console outputLines={state.outputLines} dispatch={dispatch} />;\r\n}\r\n\r\ncreateRoot(document.getElementById('root')!).render(<DevToolsConsole />);\r\n"],"names":["useReducer","useEffect","jsx","createRoot"],"mappings":";;;;AAWA,SAAS,kBAAkB;AACzB,QAAM,CAAC,OAAO,QAAQ,IAAIA,aAAAA,WAAW,cAAc,YAAY;AAE/DC,eAAAA,UAAU,MAAM;AACd,UAAM,iBAAiB,OAAO,UAAU,iBAAiB;AAEzD,mBAAe,SAAS,OAAe;AACrC,YAAM,CAAC,KAAK,GAAG,IAAI,MAAM,QAAQ,IAAI;AAAA,QACnC,YAAY,KAAK;AAAA,QACjB,OAAO,KAAK,IAAI,KAAK,EAAE,MAAM,MAAM,IAAI;AAAA,MAAA,CACxC;AACD,UAAI,IAAI,MAAM,IAAI,KAAK;AACrB,cAAM,OAAO,KAAK,SAAS,KAAK;AAChC,iBAAS,EAAE,MAAM,kBAAkB,KAAK,IAAI,KAAK,OAAO;AACxD,iBAAS,EAAE,MAAM,YAAY,MAAM,EAAE,MAAM,mBAAmB,GAAG,KAAK,IAAI,GAAG,IAAI,MAAM,OAAA,GAAU;AAAA,MACnG;AAAA,IACF;AAEA,QAAI,gBAAgB;AAClB,eAAS,cAAc,EAAE,MAAM,CAAA,MAAK,QAAQ,KAAK,iCAAiC,CAAC,CAAC;AAAA,IACtF;AAEA,UAAM,cAAc,CAAC,SAAoC;AACvD,UAAI,CAAC,kBAAkB,KAAK,UAAU,eAAgB;AACtD,eAAS,cAAc,EAAE,MAAM,CAAA,MAAK,QAAQ,KAAK,+BAA+B,CAAC,CAAC;AAAA,IACpF;AACA,WAAO,KAAK,YAAY,YAAY,WAAW;AAE/C,WAAO,MAAM;AACX,aAAO,KAAK,YAAY,eAAe,WAAW;AAAA,IACpD;AAAA,EACF,GAAG,CAAA,CAAE;AAGLA,eAAAA,UAAU,MAAM;AACd,mBAAe,CAAC,OAAO,SAAS;AAC9B,iBAAW,OAAO,MAAM;AACtB,cAAM,OAAO,UAAU,UAAU,UAAU,UAAU,SAAS,SAAS;AACvE,iBAAS,EAAE,MAAM,YAAY,MAAM,EAAE,MAAM,IAAI,MAAM,OAAO,IAAA,EAAI,CAAG;AAAA,MACrE;AAAA,IACF,CAAC;AACD,WAAO,MAAM,eAAe,IAAI;AAAA,EAClC,GAAG,CAAC,QAAQ,CAAC;AAEb,SAAOC,kCAAAA,IAAC,SAAA,EAAQ,aAAa,MAAM,aAAa,UAAoB;AACtE;AAEAC,cAAAA,WAAW,SAAS,eAAe,MAAM,CAAE,EAAE,OAAOD,kCAAAA,IAAC,mBAAgB,CAAE;"}

package/dist/chrome-extension/devtools/devtools.js

@@ -1,6 +1,6 @@
 import "../modulepreload-polyfill.js";
 chrome.devtools.panels.create(
-  "REPL",
+  "Playwright",
   "icons/dramaturg_icon_16.png",
   "devtools/console.html"
 );

package/dist/chrome-extension/devtools/devtools.js.map

@@ -1 +1 @@
-{"version":3,"file":"devtools.js","sources":["../../src/devtools/devtools.ts"],"sourcesContent":["/**\r\n * DevTools entry point — creates a \"REPL\" panel in Chrome DevTools.\r\n */\r\nchrome.devtools.panels.create(\r\n  'REPL',\r\n  'icons/dramaturg_icon_16.png',\r\n  'devtools/console.html',\r\n);\r\n"],"names":[],"mappings":";AAGA,OAAO,SAAS,OAAO;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AACF;"}
+{"version":3,"file":"devtools.js","sources":["../../src/devtools/devtools.ts"],"sourcesContent":["/**\r\n * DevTools entry point — creates a \"REPL\" panel in Chrome DevTools.\r\n */\r\nchrome.devtools.panels.create(\r\n  'Playwright',\r\n  'icons/dramaturg_icon_16.png',\r\n  'devtools/console.html',\r\n);\r\n"],"names":[],"mappings":";AAGA,OAAO,SAAS,OAAO;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AACF;"}

package/dist/chrome-extension/manifest.json

@@ -1,7 +1,7 @@
 {
   "manifest_version": 3,
   "name": "Dramaturg",
-  "version": "0.20.0",
+  "version": "0.21.6",
   "description": "Playwright engineer's companion — console, editor, runner, debugger, and recorder in a Chrome side panel.",
   "permissions": [
     "activeTab",

package/dist/chrome-extension/panel/panel.js

@@ -118,10 +118,11 @@ function Toolbar({ editorContent, editorMode, stepLine, attachedUrl, attachedTab
   const lines = reactExports.useMemo(() => editorContent.split("\n"), [editorContent]);
   function isInternalUrl(url) {
     if (!url) return true;
-    return url.startsWith("chrome://") || url.startsWith("chrome-extension://") || url.startsWith("about:");
+    return url.startsWith("chrome://") || url.startsWith("chrome-extension://");
   }
   function getTabLabel(tab) {
     try {
+      if (tab.url?.startsWith("about:")) return tab.url;
       const url = new URL(tab.url);
       if (url.protocol === "chrome:") return `chrome://${url.hostname}`;
       return url.hostname;
@@ -134,7 +135,7 @@ function Toolbar({ editorContent, editorMode, stepLine, attachedUrl, attachedTab
     const tabs = await chrome.tabs.query({});
     const ownOrigin = `chrome-extension://${chrome.runtime.id}/`;
     const panelUrl = `${ownOrigin}panel/panel.html`;
-    setAvailableTabs(tabs.filter((t) => t?.url && !t.url.startsWith("about:") && !t.url.startsWith(panelUrl) && (!t.url.startsWith("chrome-extension://") || t.url.startsWith(ownOrigin))));
+    setAvailableTabs(tabs.filter((t) => t?.url && !t.url.startsWith(panelUrl) && (!t.url.startsWith("chrome-extension://") || t.url.startsWith(ownOrigin))));
   }
   async function checkActiveTab() {
     if (!chrome.tabs?.query) return;
@@ -2126,14 +2127,13 @@ function App() {
       const tab = tabs[0];
       const url = tab?.url ?? "";
       const ownOrigin = `chrome-extension://${chrome.runtime.id}/`;
-      if (tab?.id && !url.startsWith("chrome://") && !url.startsWith("about:") && (!url.startsWith("chrome-extension://") || url.startsWith(ownOrigin))) {
+      if (tab?.id && !url.startsWith("chrome://") && (!url.startsWith("chrome-extension://") || url.startsWith(ownOrigin))) {
         doAttach(tab.id);
       }
     });
     const onActivated = async (info) => {
       const tab = await chrome.tabs.get(info.tabId).catch(() => null);
       const url = tab?.url ?? "";
-      if (url.startsWith("about:")) return;
       if (url.startsWith("chrome-extension://") && !url.startsWith(`chrome-extension://${chrome.runtime.id}/`)) return;
       if (url.startsWith("chrome://")) {
         attachedTabRef.current = null;
@@ -2148,7 +2148,7 @@ function App() {
         if (changeInfo.url) dispatch({ type: "UPDATE_URL", url: changeInfo.url });
         return;
       }
-      if (changeInfo.url && !changeInfo.url.startsWith("chrome://") && !changeInfo.url.startsWith("about:") && (!changeInfo.url.startsWith("chrome-extension://") || changeInfo.url.startsWith(`chrome-extension://${chrome.runtime.id}/`))) {
+      if (changeInfo.url && !changeInfo.url.startsWith("chrome://") && (!changeInfo.url.startsWith("chrome-extension://") || changeInfo.url.startsWith(`chrome-extension://${chrome.runtime.id}/`))) {
         chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
           if (tabs[0]?.id === tabId) doAttach(tabId);
         });