Quick Start

vitest-environment-web-ext is a Vitest test environment designed specifically for Browser Extensions, enabling end-to-end (E2E) testing of browser extensions. This project is built on Playwright and provides complete testing support for Chrome extensions.

Install Dependencies

npm
pnpm
bun
yarn
npm i -D vitest-environment-web-ext

Configure Vitest

vitest.config.ts
import { defineConfig } from 'vitest/config'

export default defineConfig({
  test: {
    environment: 'web-ext',
    environmentOptions: {
      'web-ext': {
        path: './dist',
      },
    },
  },
})

Update package.json

package.json
{
  "scripts": {
    "test": "vitest"
  }
}

Write Tests

test/extension.test.ts
import { expect, test } from 'vitest'

test('popup should display correctly', async () => {
  const popupPage = await browser.getPopupPage()

  const title = await popupPage.title()
  expect(title).toBeTruthy()
})

Run Tests

npm
pnpm
bun
yarn
npm run test