On Manifest v3, create new window extension cannot access contents of the page

4,708 views

Skip to first unread message

J

unread,

Apr 29, 2022, 5:43:16 AM4/29/22

to Chromium Extensions

I am currently trying develop an extension in version Manifest v3. I change the code from this tutorial: https://developer.chrome.com/docs/extensions/mv3/getstarted/

Code: https://github.com/GoogleChrome/chrome-extensions-samples/tree/main/tutorials/getting-started

Which is an extension can change the background color of the currently focused page.

Now i wanna when i click the extension, it will create a new windows page. (The purpose of this is to allow the user to have a better operating space).

So i change the background.js code to:

----

// background.js let color = '#3aa757'; chrome.action.onClicked.addListener(createPanel);

function createPanel(tab) {

if (!tab) return; const contentWindowId = tab.windowId;

try { const panelWindowInfo = chrome.windows.create({

url: chrome.runtime.getURL("popup.html"),

type:"popup",

height: 500,

width: 300, });

} catch (error) { console.log(error); }

}

---

And i delete the default_popup code in manifest.json

---

{ "name": "Getting Started Example", "description": "Build an Extension!", "version": "1.0", "manifest_version": 3, "background": { "service_worker": "background.js" }, "permissions": ["storage", "activeTab", "scripting"], "action": { "default_icon": { "16": "/images/get_started16.png", "32": "/images/get_started32.png", "48": "/images/get_started48.png", "128": "/images/get_started128.png" } }, "icons": { "16": "/images/get_started16.png", "32": "/images/get_started32.png", "48": "/images/get_started48.png", "128": "/images/get_started128.png" }, "options_page": "options.html" }

---

The rest of the code is still the same.

When i click the extension, it will create a new windows page. And the content of this page will be popup.html. Can see that, when i select green color on the options page, the button from the extension window will also be green color. (Select red, button will also be red, and so on). Which means the options page is run correctly.

But when i click the button from the extension windows(the red circle one). The webpage will not change the background color of the current webpage will not change. The extension windows F12 (DevTools) show this message:

Uncaught (in promise) Error: Cannot access contents of the page. Extension manifest must request permission to access the respective host.

How to let this new extension windows work properly like the previous default_popup one? Does anyone know how to solve this problem?

Thanks.

Simeon Vincent

unread,

Apr 29, 2022, 4:16:15 PM4/29/22

to J, Chromium Extensions

I think I see what's going on here.

A critical component of the getting started tutorial is the activeTab permission, which grants temporary access to a page for the duration of the users session on that page when the extension is invoked.

Previously, activeTab was granted when the user clicked the action button to open the popup. When you moved the popup into a separate window, you also unintentionally changed how and when script injection occurs. Instead of interacting with the currently focused tab, the page now has a cached tab reference for the page that was focused when the extension was invoked. The error you're seeing indicates that the extension can't run on that tab. The main reasons for this are:

1) you navigated the tab that was focused, invalidating the activeTab grant

2) the focused tab was on a page that does not allow script injection. Notably these include Chrome pages (chrome://) and extension pages (chrome-extension://)

So, the two main options I see are:

1) You can move from activeTab to statically requesting host permissions you want in your manifest using the host_permissions array.

2) Change how you handle script injection so that scripts are only injected in response to one of the actions that grant activeTab.

Simeon - @dotproto

Chrome Extensions DevRel

--
You received this message because you are subscribed to the Google Groups "Chromium Extensions" group.
To unsubscribe from this group and stop receiving emails from it, send an email to chromium-extens...@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/chromium-extensions/4ddf595d-0143-4fdd-8c93-dfd0c56e20e4n%40chromium.org.

Simeon Vincent
Developer Relations Engineer

img1.png

img2.png

Reply all

Reply to author

Forward

0 new messages