Skip to content

Commit

Permalink
docs: update the extensions guide
Browse files Browse the repository at this point in the history
  • Loading branch information
OrKoN committed Apr 17, 2024
1 parent ef8c4c8 commit c0992ef
Showing 1 changed file with 47 additions and 19 deletions.
66 changes: 47 additions & 19 deletions docs/guides/chrome-extensions.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,8 @@ Puppeteer can be used for testing Chrome Extensions.

:::caution

Extensions in Chrome/Chromium currently only work in non-headless mode and
experimental Chrome headless mode.
Extensions are not available in chrome-headless-shell (headless: 'shell'),
also known as the old headless mode.

:::

Expand All @@ -17,22 +17,19 @@ an extension whose source is located in `./my-extension`:
import puppeteer from 'puppeteer';
import path from 'path';

(async () => {
const pathToExtension = path.join(process.cwd(), 'my-extension');
const browser = await puppeteer.launch({
headless: 'new',
args: [
`--disable-extensions-except=${pathToExtension}`,
`--load-extension=${pathToExtension}`,
],
});
const backgroundPageTarget = await browser.waitForTarget(
target => target.type() === 'background_page'
);
const backgroundPage = await backgroundPageTarget.page();
// Test the background page as you would any other page.
await browser.close();
})();
const pathToExtension = path.join(process.cwd(), 'my-extension');
const browser = await puppeteer.launch({
args: [
`--disable-extensions-except=${pathToExtension}`,
`--load-extension=${pathToExtension}`,
],
});
const backgroundPageTarget = await browser.waitForTarget(
target => target.type() === 'background_page'
);
const backgroundPage = await backgroundPageTarget.page();
// Test the background page as you would any other page.
await browser.close();
```

:::note
Expand All @@ -42,8 +39,39 @@ Chrome Manifest V3 extensions have a background ServiceWorker of type

:::

```ts
import puppeteer from 'puppeteer';
import path from 'path';

const pathToExtension = path.join(process.cwd(), 'my-extension');
const browser = await puppeteer.launch({
args: [
`--disable-extensions-except=${pathToExtension}`,
`--load-extension=${pathToExtension}`,
],
});

const workerTarget = await browser.waitForTarget(
target => target.type() === 'service_worker' && idMatches(target)
);

const worker = workerTarget.worker();

// Open a popup (available for Canary channels).
await worker.evaluate('chrome.action.openPopup();');

const popup = await browser.waitForTarget(
target => target.type() === 'page' && target.url().endsWith('popup.html')
);

const popupPage = popup.asPage();

// Test the background page as you would any other page.
await browser.close();
```

:::note

It is not yet possible to test extension popups or content scripts.
It is not yet possible to test extension content scripts.

:::

0 comments on commit c0992ef

Please sign in to comment.