Accessing background page for firefox add-on in puppeteer

Viewed 641

Is it possible to get background_page target for Firefox Add-on in puppeteer?

For testing chrome extensions, I can easily access the background_page when extension is loaded by doing the following:

// Bring up chrome browser with extension loaded
const browser = await puppeteer.launch({
  headless: false,
  defaultViewport: null,
  ignoreHTTPSErrors: true,
  timeout: 0,
  args: [
    `--disable-extensions-except=${CRX_PATH}`,
    `--load-extension=${CRX_PATH}`,
    '--ignore-certificate-errors',
    '--no-sandbox',
    '--disable-setuid-sandbox',
    '--window-size=1920,1080',
  ],
});

// Fetch browser targets
const targets = await browser.targets();

// Filter out background_page for extension from the targets
const backgroundPageTarget = targets.find((target) => {
  return target.type() === 'background_page';
});

I was able to load my firefox add-on by following these guides:

However, I've been unable to access the background_page of the add-on. I need that to intercept and validate requests and responses made by the add-on.

1 Answers

I managed to make it work with Selenium by following these steps:

  1. Open up the same Firefox browser application that you're making Puppeteer connect to.

  2. Load the extension the same way that you make Puppeteer load it (there's different ways, I did it by loading an unsigned version with Firefox dev edition).

  3. Activate the popup window for the extension, then right click and select View page source.

  4. In the URL, you should see this pattern view-source:moz-extension://<extension-id>/<extension-page-name>.html

  5. Using this extension ID, you can make your script go to the background page by having the browser navigate to moz-extension://<extension-id>/<background-page-name>.html

Related