Mihail Marian
Mihail Marian

Reputation: 59

How to run integration / e2e tests for a Chrome extension in 2021?

I'm building a Chrome extension that removes some content from a website. I wanted to set up some integration and e2e tests on it in order to check...

  1. functions that set values in the chrome.storage API
  2. interactions with the extension's UI (i.e. when you click the extension icon next to the address bar)
  3. whether the extension works well from an e2e standpoint

I'm a beginner in testing and I'm struggling to figure out what would be the best approach. Here's the options I've looked at so far:

Is Selenium still the only option in 2021 for testing Chrome extensions?

Upvotes: 3

Views: 1841

Answers (2)

Stephane Benayoun
Stephane Benayoun

Reputation: 121

Playwright supports testing of Chrome extensions out of the box and it's covering your 3 questions:

  1. It lets you evaluate code in the background script during tests. After setting up playwright like described in this article, you can manipulate the chrome.storage like this :
test('setting storage key during a test', async ({ page, backgroundPage }) => {
  await backgroundPage.evaluate(() => {
    chrome.storage.sync.set('SomeKey', 'SomeValue');
  })
  ...
});

backgroundPage is coming from a fixture that should define like explained in the article (depending if you extension run in manifest v2 or v3).

  1. You can navigate your extension pages under chrome-extension:// like your popup.html, simply like this :
test('popup page', async ({ page, extensionId }) => {
  await page.goto(`chrome-extension://${extensionId}/popup.html`);
  await expect(page.locator('body')).toHaveText('my-extension popup');
});
  1. Of course you can navigate to any web page and test your extension behavior on them.

Upvotes: 4

Mihail Marian
Mihail Marian

Reputation: 59

After working on it for a week, I came to the conclusion that the best way to do this is with Selenium and Jest. The setup takes a bit to get used to it, but once you do it's pretty straightforward. My resources:

Upvotes: 1

Related Questions