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 bb406aa
Show file tree
Hide file tree
Showing 2 changed files with 48 additions and 19 deletions.
67 changes: 48 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,40 @@ 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 = await workerTarget.worker();

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

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

const popupPage = popupTarget.asPage();

// Test the popup 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.

:::
Empty file.

0 comments on commit bb406aa

Please sign in to comment.