Search code examples
javascriptfirefox-addonfirefox-addon-webextensions

Firefox web extension, content script registration example not working for other websites


Documentation here: https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Examples

Code here: https://github.com/mdn/webextensions-examples/tree/main/content-script-register

The above example from Firefox's own documentation does not appear to work as expected. Here is the main JS for the extension:

'use strict';

const hostsInput =  document.querySelector("#hosts");
const codeInput =  document.querySelector("#code");

const defaultHosts = "*://*.org/*";
const defaultCode = "document.body.innerHTML = '<h1>This page has been eaten</h1>'";

hostsInput.value = defaultHosts;
codeInput.value = defaultCode;

function registerScript() {
  browser.runtime.sendMessage({
    hosts: hostsInput.value.split(","),
    code: codeInput.value
  });
}

document.querySelector("#register").addEventListener('click', registerScript);

You can see the line const defaultHosts = "*://*.org/*"; which works as expected, however no matter what I do I cannot get it to work for i.e. const defaultHosts = *reddit.com/* or *://*google* etc.

Any ideas why it might be?


Solution

  • A match pattern must specify scheme://host/path, so the first pattern will be *://*.reddit.com/*

    A match pattern's last domain cannot be *, so the second pattern cannot be fixed and you'll have to list all top-level domains explicitly (example).

    P.S. Although it's also possible to use includeGlobs: ['*.google.*/'] when registering the content script in the background script, but it's a terrible workaround as it'll match the text in the wrong part of a URL like /path/ or search?parameter=value.