How do you open Chrome extension options page from a web page?

Question

My Chrome extension has a content script that uses the following to inject HTML into the page:

var optionsUrl = chrome.extension.getURL("src/options/options.html"); 
var content = '<a href="' + optionsUrl + '" target="_blank">Options</a>';

This produces:

 <a href="chrome-extension://gdocgfhmbfbbbmhnhmmejncjdcbjkhfc/src/options/options.html" target="_blank">Options</a>

When I click the link, it opens a new browser tab and nothing more.

If I paste the href attribute chrome-extension://gdocgfhmbfbbbmhnhmmejncjdcbjkhfc/src/options/options.html into the address bar, I see the options page for my Chrome extension displayed correctly.

Why doesn't the link work?
Is there some extra permission that I'm missing?

score 21 · Accepted Answer · answered Apr 08 '14 at 19:56

21

In the manifest file insert:

"web_accessible_resources": ["src/options/options.html"],

more info see documentation.

answered Apr 08 '14 at 19:56

Skalár Wag

2,247
2
18
21

2

saved me a lot of time, i've been going crazy over this :) – Kevin Jan 21 '15 at 12:49

score 1 · Answer 2 · answered Mar 27 '22 at 18:40

Updating for Manifest v3. The following worked for me:

  "web_accessible_resources": [
    {
      "resources": [ "options.html" ],
      "matches": ["<all_urls>"]
    }
  ]

Further. I trigger the options page in a content script via:

  `chrome-extension://${chrome.runtime.id}/options.html`

How do you open Chrome extension options page from a web page?

2 Answers2

Linked