diff --git a/README.md b/README.md index 6256432..44e7cc6 100644 --- a/README.md +++ b/README.md @@ -241,7 +241,12 @@ extension/ "description": "Inspect Angular components, signals, DI, and routes.", "devtools_page": "devtools.html", "permissions": ["scripting"], - "host_permissions": [""], + "host_permissions": [ + "http://localhost/*", + "https://localhost/*", + "http://127.0.0.1/*", + "https://127.0.0.1/*" + ], "icons": { "128": "icon-128.png" } diff --git a/docs/privacy-policy.html b/docs/privacy-policy.html index 4424314..daffa8e 100644 --- a/docs/privacy-policy.html +++ b/docs/privacy-policy.html @@ -32,16 +32,16 @@

Data Collection

What the Extension Accesses

-

The Extension accesses the following information only on the page you are actively inspecting via Chrome DevTools:

+

The Extension accesses the following information from pages where its content scripts run and from the page you are actively inspecting via Chrome DevTools:

All data processing happens entirely within your browser and your local machine. No information ever leaves your device.

Host Permissions

-

The Extension requests host permissions (<all_urls>) solely to inject a lightweight content script that detects Angular on any page. The content script only checks for the presence of Angular and does not read or modify page content.

+

The Extension requests host permissions only for localhost and 127.0.0.1, to reach the devframe server on the developer's own machine. The detect-angular.js content script runs on every page, including when DevTools is closed. It reads only the ng-version attribute and whether window.ng exists, to detect Angular. It does not modify page content.

Data Storage

The Extension does not persist any data between sessions. All inspection data exists only in memory while the DevTools panel is open and is discarded when the panel is closed.

diff --git a/extension/content-script.js b/extension/content-script.js index 2662092..c9e594e 100644 --- a/extension/content-script.js +++ b/extension/content-script.js @@ -1,11 +1,3 @@ -// Inject a page-level script to detect Angular, since content scripts -// can't access the page's JS globals directly. - -const script = document.createElement('script'); -script.src = chrome.runtime.getURL('detect-angular.js'); -script.onload = () => script.remove(); -(document.head || document.documentElement).appendChild(script); - // Listen for the detection result posted from the page context window.addEventListener('message', (event) => { if (event.source !== window) return; diff --git a/extension/manifest.json b/extension/manifest.json index bcc4f23..8caffbf 100644 --- a/extension/manifest.json +++ b/extension/manifest.json @@ -3,14 +3,26 @@ "name": "Angular DevTools", "version": "0.0.1", "description": "Inspect Angular components, signals, dependency injection, and routes.", + "minimum_chrome_version": "111", "devtools_page": "devtools.html", "permissions": [], - "host_permissions": [""], + "host_permissions": [ + "http://localhost/*", + "https://localhost/*", + "http://127.0.0.1/*", + "https://127.0.0.1/*" + ], "content_scripts": [ { "matches": [""], "js": ["content-script.js"], - "run_at": "document_idle" + "run_at": "document_start" + }, + { + "matches": [""], + "js": ["detect-angular.js"], + "run_at": "document_idle", + "world": "MAIN" } ], "background": { @@ -20,11 +32,5 @@ "16": "icons/icon-16.png", "48": "icons/icon-48.png", "128": "icons/icon-128.png" - }, - "web_accessible_resources": [ - { - "resources": ["detect-angular.js"], - "matches": [""] - } - ] + } } diff --git a/extension/panel-bridge.js b/extension/panel-bridge.js index e42a0d3..b1623d1 100644 --- a/extension/panel-bridge.js +++ b/extension/panel-bridge.js @@ -5,6 +5,7 @@ const frame = document.getElementById('devtools-frame'); const status = document.getElementById('status'); const tabId = chrome.devtools.inspectedWindow.tabId; +const LOCAL_HOSTS = ['localhost', '127.0.0.1']; // Try to find the devframe connection on the inspected page function detectConnection() { @@ -35,7 +36,7 @@ function detectConnection() { return null; })()`, (result, err) => { - if (result && result.base) { + if (result && paths.includes(result.base)) { loadPanel(result.base); } else { // No live devframe found — load in standalone/static mode @@ -55,8 +56,12 @@ function loadPanel(baseURL) { if (baseURL) { // Get the inspected page's origin to build the full baseURL chrome.devtools.inspectedWindow.eval('location.origin', (origin) => { - const fullBase = origin + baseURL; - frame.src = `${panelUrl}?baseURL=${encodeURIComponent(fullBase)}`; + const url = new URL(baseURL, origin); + if (!LOCAL_HOSTS.includes(url.hostname)) { + frame.src = panelUrl; + return; + } + frame.src = `${panelUrl}?baseURL=${encodeURIComponent(url.href)}`; }); } else { frame.src = panelUrl;