快速开始

vitest-environment-web-ext是一个专为浏览器扩展（Browser Extension）设计的Vitest测试环境，用于实现浏览器扩展的端到端（E2E）测试。该项目基于Playwright构建，提供对Chrome扩展的完整测试支持。

安装依赖

npm

pnpm

bun

yarn

npm i -D vitest-environment-web-ext

配置Vitest

vitest.config.ts

import { defineConfig } from 'vitest/config'

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

类型定义

为了获得更好的类型检查和智能提示，您需要配置类型。

tsconfig.json

{
  "compilerOptions": {
    "types": ["vitest-environment-web-ext/types"]
  }
}

更新`package.json`

package.json

{
  "scripts": {
    "test": "vitest"
  }
}

编写测试

test/extension.test.ts

import { expect, test } from 'vitest'

test('弹出窗口应正确显示', async () => {
  const popupPage = await browser.getPopupPage()

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