opendevbrowser 0.0.10

package/extension/dist/popup.js

@@ -0,0 +1,150 @@
+import { DEFAULT_AUTO_PAIR, DEFAULT_PAIRING_ENABLED, DEFAULT_PAIRING_TOKEN, DEFAULT_RELAY_PORT } from "./relay-settings.js";
+const statusEl = document.getElementById("status");
+const statusIndicator = document.getElementById("statusIndicator");
+const toggleButton = document.getElementById("toggle");
+const relayPortInput = document.getElementById("relayPort");
+const pairingTokenInput = document.getElementById("pairingToken");
+const pairingEnabledInput = document.getElementById("pairingEnabled");
+const autoPairInput = document.getElementById("autoPair");
+if (!statusEl || !statusIndicator || !toggleButton || !relayPortInput || !pairingTokenInput || !pairingEnabledInput || !autoPairInput) {
+    throw new Error("Popup DOM missing required elements");
+}
+const setStatus = (status) => {
+    const isConnected = status === "connected";
+    statusEl.textContent = isConnected ? "Connected" : "Disconnected";
+    toggleButton.textContent = isConnected ? "Disconnect" : "Connect";
+    if (isConnected) {
+        statusIndicator.classList.add("connected");
+    }
+    else {
+        statusIndicator.classList.remove("connected");
+    }
+};
+const sendMessage = (message) => {
+    return new Promise((resolve) => {
+        chrome.runtime.sendMessage(message, (response) => {
+            resolve(response);
+        });
+    });
+};
+const refreshStatus = async () => {
+    const response = await sendMessage({ type: "status" });
+    setStatus(response.status);
+};
+const fetchTokenFromPlugin = async (port) => {
+    try {
+        const response = await fetch(`http://127.0.0.1:${port}/pair`, {
+            method: "GET",
+            headers: { "Accept": "application/json" }
+        });
+        if (!response.ok) {
+            return null;
+        }
+        const data = await response.json();
+        return typeof data.token === "string" ? data.token : null;
+    }
+    catch {
+        return null;
+    }
+};
+const loadSettings = async () => {
+    const data = await new Promise((resolve) => {
+        chrome.storage.local.get(["pairingToken", "pairingEnabled", "relayPort", "autoPair"], (items) => {
+            resolve(items);
+        });
+    });
+    const autoPair = typeof data.autoPair === "boolean" ? data.autoPair : DEFAULT_AUTO_PAIR;
+    const pairingEnabled = typeof data.pairingEnabled === "boolean"
+        ? data.pairingEnabled
+        : DEFAULT_PAIRING_ENABLED;
+    const rawToken = typeof data.pairingToken === "string" ? data.pairingToken.trim() : "";
+    const tokenValue = pairingEnabled ? (rawToken || DEFAULT_PAIRING_TOKEN || "") : rawToken;
+    const portValue = typeof data.relayPort === "number" ? data.relayPort : DEFAULT_RELAY_PORT;
+    autoPairInput.checked = autoPair;
+    pairingEnabledInput.checked = pairingEnabled;
+    pairingTokenInput.disabled = !pairingEnabled || autoPair;
+    pairingTokenInput.value = tokenValue;
+    relayPortInput.value = Number.isInteger(portValue) ? String(portValue) : String(DEFAULT_RELAY_PORT);
+    const updates = {};
+    if (typeof data.autoPair !== "boolean") {
+        updates.autoPair = autoPair;
+    }
+    if (typeof data.pairingEnabled !== "boolean") {
+        updates.pairingEnabled = pairingEnabled;
+    }
+    if (Object.keys(updates).length > 0) {
+        chrome.storage.local.set(updates);
+    }
+};
+const toggle = async () => {
+    const isConnected = statusEl.textContent === "Connected";
+    if (!isConnected && autoPairInput.checked && pairingEnabledInput.checked) {
+        const port = parseInt(relayPortInput.value, 10) || DEFAULT_RELAY_PORT;
+        const fetchedToken = await fetchTokenFromPlugin(port);
+        if (fetchedToken) {
+            pairingTokenInput.value = fetchedToken;
+            chrome.storage.local.set({ pairingToken: fetchedToken });
+        }
+        else {
+            statusEl.textContent = "Failed to fetch token from plugin";
+            setTimeout(() => refreshStatus(), 2000);
+            return;
+        }
+    }
+    const response = await sendMessage({
+        type: isConnected ? "disconnect" : "connect"
+    });
+    setStatus(response.status);
+};
+toggleButton.addEventListener("click", () => {
+    toggle().catch(() => {
+        setStatus("disconnected");
+    });
+});
+autoPairInput.addEventListener("change", () => {
+    const enabled = autoPairInput.checked;
+    pairingTokenInput.disabled = !pairingEnabledInput.checked || enabled;
+    chrome.storage.local.set({ autoPair: enabled });
+    if (enabled) {
+        pairingTokenInput.placeholder = "Will be fetched automatically";
+    }
+    else {
+        pairingTokenInput.placeholder = "Enter token or enable Auto-Pair";
+    }
+});
+pairingTokenInput.addEventListener("input", () => {
+    const value = pairingTokenInput.value.trim();
+    chrome.storage.local.set({ pairingToken: value });
+});
+pairingEnabledInput.addEventListener("change", () => {
+    const enabled = pairingEnabledInput.checked;
+    pairingTokenInput.disabled = !enabled || autoPairInput.checked;
+    const updates = { pairingEnabled: enabled };
+    if (enabled && !autoPairInput.checked) {
+        const tokenValue = pairingTokenInput.value.trim() || DEFAULT_PAIRING_TOKEN || "";
+        pairingTokenInput.value = tokenValue;
+        updates.pairingToken = tokenValue;
+    }
+    chrome.storage.local.set(updates);
+});
+relayPortInput.addEventListener("input", () => {
+    const raw = relayPortInput.value.trim();
+    if (!raw) {
+        chrome.storage.local.set({ relayPort: DEFAULT_RELAY_PORT });
+        return;
+    }
+    const parsed = Number(raw);
+    if (Number.isInteger(parsed) && parsed > 0 && parsed <= 65535) {
+        chrome.storage.local.set({ relayPort: parsed });
+    }
+});
+refreshStatus().catch(() => {
+    setStatus("disconnected");
+});
+loadSettings().catch(() => {
+    autoPairInput.checked = DEFAULT_AUTO_PAIR;
+    pairingEnabledInput.checked = DEFAULT_PAIRING_ENABLED;
+    pairingTokenInput.disabled = !DEFAULT_PAIRING_ENABLED;
+    pairingTokenInput.value = DEFAULT_PAIRING_TOKEN || "";
+    relayPortInput.value = String(DEFAULT_RELAY_PORT);
+});

package/extension/dist/popup.jsx

@@ -0,0 +1,150 @@
+import { DEFAULT_AUTO_PAIR, DEFAULT_PAIRING_ENABLED, DEFAULT_PAIRING_TOKEN, DEFAULT_RELAY_PORT } from "./relay-settings";
+const statusEl = document.getElementById("status");
+const statusIndicator = document.getElementById("statusIndicator");
+const toggleButton = document.getElementById("toggle");
+const relayPortInput = document.getElementById("relayPort");
+const pairingTokenInput = document.getElementById("pairingToken");
+const pairingEnabledInput = document.getElementById("pairingEnabled");
+const autoPairInput = document.getElementById("autoPair");
+if (!statusEl || !statusIndicator || !toggleButton || !relayPortInput || !pairingTokenInput || !pairingEnabledInput || !autoPairInput) {
+    throw new Error("Popup DOM missing required elements");
+}
+const setStatus = (status) => {
+    const isConnected = status === "connected";
+    statusEl.textContent = isConnected ? "Connected" : "Disconnected";
+    toggleButton.textContent = isConnected ? "Disconnect" : "Connect";
+    if (isConnected) {
+        statusIndicator.classList.add("connected");
+    }
+    else {
+        statusIndicator.classList.remove("connected");
+    }
+};
+const sendMessage = (message) => {
+    return new Promise((resolve) => {
+        chrome.runtime.sendMessage(message, (response) => {
+            resolve(response);
+        });
+    });
+};
+const refreshStatus = async () => {
+    const response = await sendMessage({ type: "status" });
+    setStatus(response.status);
+};
+const fetchTokenFromPlugin = async (port) => {
+    try {
+        const response = await fetch(`http://127.0.0.1:${port}/pair`, {
+            method: "GET",
+            headers: { "Accept": "application/json" }
+        });
+        if (!response.ok) {
+            return null;
+        }
+        const data = await response.json();
+        return typeof data.token === "string" ? data.token : null;
+    }
+    catch {
+        return null;
+    }
+};
+const loadSettings = async () => {
+    const data = await new Promise((resolve) => {
+        chrome.storage.local.get(["pairingToken", "pairingEnabled", "relayPort", "autoPair"], (items) => {
+            resolve(items);
+        });
+    });
+    const autoPair = typeof data.autoPair === "boolean" ? data.autoPair : DEFAULT_AUTO_PAIR;
+    const pairingEnabled = typeof data.pairingEnabled === "boolean"
+        ? data.pairingEnabled
+        : DEFAULT_PAIRING_ENABLED;
+    const rawToken = typeof data.pairingToken === "string" ? data.pairingToken.trim() : "";
+    const tokenValue = pairingEnabled ? (rawToken || DEFAULT_PAIRING_TOKEN || "") : rawToken;
+    const portValue = typeof data.relayPort === "number" ? data.relayPort : DEFAULT_RELAY_PORT;
+    autoPairInput.checked = autoPair;
+    pairingEnabledInput.checked = pairingEnabled;
+    pairingTokenInput.disabled = !pairingEnabled || autoPair;
+    pairingTokenInput.value = tokenValue;
+    relayPortInput.value = Number.isInteger(portValue) ? String(portValue) : String(DEFAULT_RELAY_PORT);
+    const updates = {};
+    if (typeof data.autoPair !== "boolean") {
+        updates.autoPair = autoPair;
+    }
+    if (typeof data.pairingEnabled !== "boolean") {
+        updates.pairingEnabled = pairingEnabled;
+    }
+    if (Object.keys(updates).length > 0) {
+        chrome.storage.local.set(updates);
+    }
+};
+const toggle = async () => {
+    const isConnected = statusEl.textContent === "Connected";
+    if (!isConnected && autoPairInput.checked && pairingEnabledInput.checked) {
+        const port = parseInt(relayPortInput.value, 10) || DEFAULT_RELAY_PORT;
+        const fetchedToken = await fetchTokenFromPlugin(port);
+        if (fetchedToken) {
+            pairingTokenInput.value = fetchedToken;
+            chrome.storage.local.set({ pairingToken: fetchedToken });
+        }
+        else {
+            statusEl.textContent = "Failed to fetch token from plugin";
+            setTimeout(() => refreshStatus(), 2000);
+            return;
+        }
+    }
+    const response = await sendMessage({
+        type: isConnected ? "disconnect" : "connect"
+    });
+    setStatus(response.status);
+};
+toggleButton.addEventListener("click", () => {
+    toggle().catch(() => {
+        setStatus("disconnected");
+    });
+});
+autoPairInput.addEventListener("change", () => {
+    const enabled = autoPairInput.checked;
+    pairingTokenInput.disabled = !pairingEnabledInput.checked || enabled;
+    chrome.storage.local.set({ autoPair: enabled });
+    if (enabled) {
+        pairingTokenInput.placeholder = "Will be fetched automatically";
+    }
+    else {
+        pairingTokenInput.placeholder = "Enter token or enable Auto-Pair";
+    }
+});
+pairingTokenInput.addEventListener("input", () => {
+    const value = pairingTokenInput.value.trim();
+    chrome.storage.local.set({ pairingToken: value });
+});
+pairingEnabledInput.addEventListener("change", () => {
+    const enabled = pairingEnabledInput.checked;
+    pairingTokenInput.disabled = !enabled || autoPairInput.checked;
+    const updates = { pairingEnabled: enabled };
+    if (enabled && !autoPairInput.checked) {
+        const tokenValue = pairingTokenInput.value.trim() || DEFAULT_PAIRING_TOKEN || "";
+        pairingTokenInput.value = tokenValue;
+        updates.pairingToken = tokenValue;
+    }
+    chrome.storage.local.set(updates);
+});
+relayPortInput.addEventListener("input", () => {
+    const raw = relayPortInput.value.trim();
+    if (!raw) {
+        chrome.storage.local.set({ relayPort: DEFAULT_RELAY_PORT });
+        return;
+    }
+    const parsed = Number(raw);
+    if (Number.isInteger(parsed) && parsed > 0 && parsed <= 65535) {
+        chrome.storage.local.set({ relayPort: parsed });
+    }
+});
+refreshStatus().catch(() => {
+    setStatus("disconnected");
+});
+loadSettings().catch(() => {
+    autoPairInput.checked = DEFAULT_AUTO_PAIR;
+    pairingEnabledInput.checked = DEFAULT_PAIRING_ENABLED;
+    pairingTokenInput.disabled = !DEFAULT_PAIRING_ENABLED;
+    pairingTokenInput.value = DEFAULT_PAIRING_TOKEN || "";
+    relayPortInput.value = String(DEFAULT_RELAY_PORT);
+});

package/extension/dist/relay-settings.js

@@ -0,0 +1,4 @@
+export const DEFAULT_RELAY_PORT = 8787;
+export const DEFAULT_PAIRING_TOKEN = null;
+export const DEFAULT_PAIRING_ENABLED = true;
+export const DEFAULT_AUTO_PAIR = false;

package/extension/dist/services/CDPRouter.js

@@ -0,0 +1,176 @@
+export class CDPRouter {
+    debuggee = null;
+    callbacks = null;
+    handleEventBound = (source, method, params) => {
+        this.handleEvent(source, method, params);
+    };
+    handleDetachBound = (source) => {
+        this.handleDetach(source);
+    };
+    setCallbacks(callbacks) {
+        this.callbacks = callbacks;
+    }
+    async attach(tabId) {
+        if (this.debuggee?.tabId === tabId) {
+            return;
+        }
+        if (this.debuggee) {
+            await this.detach();
+        }
+        this.debuggee = { tabId };
+        try {
+            await this.runDebuggerAction((done) => {
+                chrome.debugger.attach(this.debuggee, "1.3", done);
+            });
+            chrome.debugger.onEvent.addListener(this.handleEventBound);
+            chrome.debugger.onDetach.addListener(this.handleDetachBound);
+        }
+        catch (error) {
+            this.debuggee = null;
+            throw error;
+        }
+    }
+    async detach() {
+        if (!this.debuggee)
+            return;
+        const current = this.debuggee;
+        this.debuggee = null;
+        chrome.debugger.onEvent.removeListener(this.handleEventBound);
+        chrome.debugger.onDetach.removeListener(this.handleDetachBound);
+        await this.runDebuggerAction((done) => {
+            chrome.debugger.detach(current, done);
+        });
+    }
+    getAttachedTabId() {
+        return this.debuggee?.tabId ?? null;
+    }
+    async handleCommand(command) {
+        if (!this.debuggee || !this.callbacks) {
+            this.callbacks?.onResponse({ id: command.id, error: { message: "No tab attached" } });
+            return;
+        }
+        const { method, params, sessionId } = command.params;
+        if (sessionId && method !== "Target.sendMessageToTarget") {
+            const message = JSON.stringify({ id: command.id, method, params });
+            try {
+                await this.sendCommand("Target.sendMessageToTarget", { sessionId, message });
+            }
+            catch (error) {
+                this.callbacks.onResponse({ id: command.id, error: { message: getErrorMessage(error) } });
+            }
+            return;
+        }
+        try {
+            const result = await this.sendCommand(method, params ?? {});
+            this.callbacks.onResponse({ id: command.id, result });
+        }
+        catch (error) {
+            this.callbacks.onResponse({ id: command.id, error: { message: getErrorMessage(error) } });
+        }
+    }
+    async sendCommand(method, params) {
+        if (!this.debuggee) {
+            throw new Error("No tab attached");
+        }
+        return new Promise((resolve, reject) => {
+            chrome.debugger.sendCommand(this.debuggee, method, params, (result) => {
+                const lastError = chrome.runtime.lastError;
+                if (lastError) {
+                    reject(new Error(lastError.message));
+                    return;
+                }
+                resolve(result);
+            });
+        });
+    }
+    async runDebuggerAction(action) {
+        return new Promise((resolve, reject) => {
+            action(() => {
+                const lastError = chrome.runtime.lastError;
+                if (lastError) {
+                    reject(new Error(lastError.message));
+                    return;
+                }
+                resolve();
+            });
+        });
+    }
+    handleEvent(source, method, params) {
+        if (!this.matchesDebuggee(source) || !this.callbacks) {
+            return;
+        }
+        if (method === "Target.receivedMessageFromTarget" && params && isRecord(params)) {
+            const nested = parseNestedMessage(params.message);
+            const sessionId = typeof params.sessionId === "string" ? params.sessionId : undefined;
+            if (nested && (typeof nested.id === "string" || typeof nested.id === "number")) {
+                const error = normalizeError(nested.error);
+                this.callbacks.onResponse({
+                    id: nested.id,
+                    result: nested.result,
+                    error,
+                    sessionId
+                });
+                return;
+            }
+            if (nested && typeof nested.method === "string") {
+                this.callbacks.onEvent({
+                    method: "forwardCDPEvent",
+                    params: {
+                        method: nested.method,
+                        params: nested.params,
+                        sessionId
+                    }
+                });
+                return;
+            }
+        }
+        this.callbacks.onEvent({
+            method: "forwardCDPEvent",
+            params: {
+                method,
+                params
+            }
+        });
+    }
+    handleDetach(source) {
+        if (!this.matchesDebuggee(source) || !this.callbacks) {
+            return;
+        }
+        this.callbacks.onDetach();
+    }
+    matchesDebuggee(source) {
+        if (!this.debuggee)
+            return false;
+        return source.tabId === this.debuggee.tabId;
+    }
+}
+const parseNestedMessage = (value) => {
+    if (typeof value !== "string")
+        return null;
+    try {
+        const parsed = JSON.parse(value);
+        return parsed;
+    }
+    catch {
+        return null;
+    }
+};
+const isRecord = (value) => {
+    return typeof value === "object" && value !== null;
+};
+const getErrorMessage = (error) => {
+    if (error instanceof Error) {
+        return error.message;
+    }
+    return "Unknown error";
+};
+const normalizeError = (value) => {
+    if (!isRecord(value)) {
+        return undefined;
+    }
+    const message = value.message;
+    if (typeof message !== "string") {
+        return undefined;
+    }
+    return { message };
+};