ci: add e2e setup script

Author: sheepzh

.github/workflows/end-to-end-tests.yml

@@ -1,5 +1,5 @@
 name: End-to-end tests CI
-on: [pull_request]
+on: [pull_request, workflow_dispatch]
 jobs:
     test:
         runs-on: ubuntu-latest
@@ -8,20 +8,13 @@ jobs:
             - name: Test using Node.js
               uses: actions/setup-node@v1
               with:
-                  node-version: "v20.11.0"
+                  node-version: "v22"
             - name: Install dependencies
               run: npm install
-            - name: Install http-server
-              run: npm install -g http-server pm2
-            - name: Build e2e outputs
-              run: npm run dev:e2e
-            - name: Build production outputs
-              run: npm run build
-
-            - name: Start up mock server
-              run: |
-                  pm2 start 'http-server ./test-e2e/example -p 12345'
-                  pm2 start 'http-server ./test-e2e/example -p 12346'
+            - name: Setup e2e environment
+              run: bash script/setup-e2e.sh --all
+            - name: Start test servers
+              run: bash script/setup-e2e.sh --start-servers
 
             - name: Run tests
               env:

CONTRIBUTING.md

@@ -85,7 +85,7 @@ npm run build:firefox
 npm run build:safari
 ```
 
-### 5. Testing Your Extension
+### 5. Debugging
 
 #### Chrome/Edge
 
@@ -126,23 +126,24 @@ This will generate coverage reports in the `coverage/` directory.
 
 #### Setup E2E Testing
 
-1. Build the test environment:
+Use the provided setup script to initialize the e2e testing environment:
 
 ```shell
-npm run dev:e2e
-npm run build
+# Initialize e2e environment (install dependencies and build outputs)
+bash script/setup-e2e.sh --init --build
+
+# Start test servers
+bash script/setup-e2e.sh --start-servers
 ```
 
-2. Start test servers:
+The setup script will:
 
-```shell
-npm install -g http-server pm2
-
-pm2 start 'http-server ./test-e2e/example -p 12345'
-pm2 start 'http-server ./test-e2e/example -p 12346'
-```
+-   Install/upgrade global dependencies (`http-server`, `pm2`)
+-   Download browser for Puppeteer (if needed)
+-   Build e2e test output (`dist_e2e/`)
+-   Start test servers on ports 12345 and 12346
 
-3. Run E2E tests:
+#### Run E2E Tests
 
 ```shell
 npm run test-e2e
@@ -157,6 +158,35 @@ export USE_HEADLESS_PUPPETEER=true
 npm run test-e2e
 ```
 
+#### Stop Test Servers
+
+After testing, stop the servers:
+
+```shell
+pm2 stop all && pm2 delete all
+```
+
+#### Setup Script Options
+
+The `setup-e2e.sh` script supports multiple options:
+
+```shell
+# Show help
+bash script/setup-e2e.sh --help
+
+# Initialize only (install dependencies)
+bash script/setup-e2e.sh --init
+
+# Build e2e output only
+bash script/setup-e2e.sh --build
+
+# Initialize and build
+bash script/setup-e2e.sh --init --build
+
+# Run all steps (init + build + build production)
+bash script/setup-e2e.sh --all
+```
+
 ## Code Quality
 
 ### Code Formatting
@@ -234,7 +264,8 @@ time-tracker-4-browser/
 ├── types/                                 # TypeScript declarations
 ├── rspack/                                # Build configuration
 ├── script/                                # Build and utility scripts
-│   └── android-firefox.sh                 # Android development helper
+│   ├── android-firefox.sh                 # Android development helper
+│   └── setup-e2e.sh                       # E2E test environment setup
 ├── public/                                # Static assets
 ├── doc/                                   # Documentation
 ├── dist_dev/                              # Chrome/Edge dev build

jest.config.ts

@@ -1,5 +1,12 @@
-import { type Config } from "@jest/types"
-import { compilerOptions } from './tsconfig.json'
+import { readFileSync } from 'fs'
+import type { Config } from "jest"
+import { dirname, join } from 'path'
+import { fileURLToPath } from 'url'
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = dirname(__filename)
+const tsconfig = JSON.parse(readFileSync(join(__dirname, 'tsconfig.json'), 'utf-8'))
+const { compilerOptions } = tsconfig
 
 const { paths } = compilerOptions
 
@@ -13,7 +20,7 @@ Object.entries(paths).forEach(([alias, sourceArr]) => {
     if (!aliasMatch) {
         return
     }
-    if (sourceArr.length !== 1) {
+    if (!Array.isArray(sourceArr) || sourceArr.length !== 1) {
         return
     }
     const sourceMath = sourceArr[0]?.match(sourcePattern)
@@ -30,7 +37,7 @@ Object.entries(paths).forEach(([alias, sourceArr]) => {
 console.log("The moduleNameMapper parsed from tsconfig.json: ")
 console.log(moduleNameMapper)
 
-const config: Config.InitialOptions = {
+const config: Config = {
     moduleNameMapper,
     roots: [
         "<rootDir>/test",

package.json

@@ -38,7 +38,6 @@
         "@swc/jest": "^0.2.39",
         "@types/chrome": "0.1.29",
         "@types/decompress": "^4.2.7",
-        "@types/jest": "^30.0.0",
         "@types/node": "^24.10.1",
         "@types/punycode": "^2.1.4",
         "@vue/babel-plugin-jsx": "^2.0.1",