Skip to content

Commit 214e9d0

Browse files
sm17psm17p
committed
fix(firefox): re-enable screenshots
1 parent fc164f0 commit 214e9d0

15 files changed

Lines changed: 822 additions & 65 deletions

File tree

‎.changeset/eager-eyes-press.md‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"amgiflol": patch
3+
---
4+
5+
fix: re-enable capture mode for firefox

‎.github/workflows/playwright.yml‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
name: Playwright Tests
2+
on:
3+
push:
4+
branches: [main, master]
5+
pull_request:
6+
branches: [main, master]
7+
jobs:
8+
test:
9+
timeout-minutes: 60
10+
runs-on: ubuntu-latest
11+
steps:
12+
- uses: actions/checkout@v4
13+
- uses: actions/setup-node@v4
14+
with:
15+
node-version: lts/*
16+
- name: Install dependencies
17+
run: npm install -g pnpm && pnpm install
18+
- name: Install Playwright Browsers
19+
run: pnpm exec playwright install --with-deps
20+
- name: Run Playwright tests
21+
run: pnpm exec playwright test
22+
- uses: actions/upload-artifact@v4
23+
if: ${{ !cancelled() }}
24+
with:
25+
name: playwright-report
26+
path: playwright-report/
27+
retention-days: 30

‎.gitignore‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,4 +25,10 @@ web-ext.config.ts
2525
*.sln
2626
*.sw?
2727
tmp/
28-
.env*
28+
.env*
29+
30+
# Playwright
31+
/test-results/
32+
/playwright-report/
33+
/blob-report/
34+
/playwright/.cache/

‎e2e/example.spec.ts‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import { expect, test } from "@playwright/test";
2+
3+
test("has title", async ({ page }) => {
4+
await page.goto("https://playwright.dev/");
5+
6+
// Expect a title "to contain" a substring.
7+
await expect(page).toHaveTitle(/Playwright/);
8+
});
9+
10+
test("get started link", async ({ page }) => {
11+
await page.goto("https://playwright.dev/");
12+
13+
// Click the get started link.
14+
await page.getByRole("link", { name: "Get started" }).click();
15+
16+
// Expects page to have a heading with the name of Installation.
17+
await expect(page.getByRole("heading", { name: "Installation" }))
18+
.toBeVisible();
19+
});

‎e2e/fixutes.ts‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
import { type BrowserContext, chromium, firefox, test as base } from "@playwright/test";
2+
import path from "path";
3+
4+
const pathToExtension = path.resolve("dist/firefox-mv3");
5+
6+
export const test = base.extend<{
7+
context: BrowserContext;
8+
extensionId: string;
9+
}>({
10+
context: async ({}, use) => {
11+
const context = await firefox.launchPersistentContext("", {
12+
headless: false,
13+
args: [
14+
`--disable-extensions-except=${pathToExtension}`,
15+
`--load-extension=${pathToExtension}`,
16+
],
17+
});
18+
await use(context);
19+
await context.close();
20+
},
21+
extensionId: async ({ context }, use) => {
22+
let background: { url(): string };
23+
if (pathToExtension.endsWith("-mv3")) {
24+
[background] = context.serviceWorkers();
25+
if (!background) {
26+
background = await context.waitForEvent("serviceworker");
27+
}
28+
} else {
29+
[background] = context.backgroundPages();
30+
if (!background) {
31+
background = await context.waitForEvent("backgroundpage");
32+
}
33+
}
34+
35+
const extensionId = background.url().split("/")[2];
36+
await use(extensionId);
37+
},
38+
});
39+
export const expect = test.expect;

‎e2e/pages/popup.ts‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import { Page } from "@playwright/test";
2+
3+
export async function openPopup(page: Page, extensionId: string) {
4+
await page.goto(`chrome-extension://${extensionId}/popup.html`);
5+
6+
await page.waitForSelector("#counter");
7+
8+
const popup = {
9+
getCounter: () => page.waitForSelector("#active"),
10+
clickCounter: async () => {
11+
const counter = await popup.getCounter();
12+
await counter.click();
13+
},
14+
getCounterText: async () => {
15+
const counter = await popup.getCounter();
16+
return await counter.evaluate((el) => el.textContent);
17+
},
18+
};
19+
return popup;
20+
}

‎e2e/tests/popup-counter.spec.ts‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
import { createFixture, withExtension } from "playwright-webextext";
2+
3+
import path from "node:path";
4+
import { firefox } from "playwright";
5+
import { expect } from "playwright/test";
6+
7+
let extensionPath = path.resolve("dist/firefox-mv3");
8+
console.log("🚀 ~ extensionPath:", extensionPath);
9+
10+
const browser = await withExtension(firefox, extensionPath).launch({
11+
headless: false
12+
});
13+
14+
// const { test, expect } = createFixture(extensionPath);
15+
16+
// test("Popup counter increments when clicked", async ({ page, }) => {
17+
18+
// });
19+
20+
(async () => {
21+
const page = await browser.newPage();
22+
await page.goto("https://example.com/");
23+
})();

‎package.json‎

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -17,14 +17,22 @@
1717
"fmt": "dprint fmt",
1818
"lint": "oxlint",
1919
"postinstall": "wxt prepare",
20+
"test:e2e": "playwright test",
2021
"wxt": "wxt",
2122
"zip": "wxt zip",
2223
"zip:all": "pnpm zip && pnpm zip:firefox",
2324
"zip:firefox": "wxt zip -b firefox --mv3"
2425
},
26+
"dependencies": {
27+
"@lucide/svelte": "^0.525.0",
28+
"@wxt-dev/analytics": "0.5.0",
29+
"bits-ui": "^2.8.10"
30+
},
2531
"devDependencies": {
2632
"@changesets/cli": "^2.29.5",
33+
"@playwright/test": "^1.54.1",
2734
"@tsconfig/svelte": "^5.0.4",
35+
"@types/node": "^24.0.14",
2836
"@unocss/extractor-svelte": "^66.3.3",
2937
"@unocss/preset-attributify": "^66.3.3",
3038
"@unocss/preset-rem-to-px": "^66.3.3",
@@ -33,6 +41,8 @@
3341
"@wxt-dev/unocss": "^1.0.1",
3442
"dprint": "0.50.1",
3543
"oxlint": "1.6.0",
44+
"playwright": "^1.54.1",
45+
"playwright-webextext": "^0.0.4",
3646
"runed": "^0.29.2",
3747
"svelte": "^5.28.2",
3848
"svelte-check": "^4.1.6",
@@ -44,10 +54,5 @@
4454
"engines": {
4555
"node": ">=24"
4656
},
47-
"packageManager": "pnpm@10.12.3+sha512.467df2c586056165580ad6dfb54ceaad94c5a30f80893ebdec5a44c5aa73c205ae4a5bb9d5ed6bb84ea7c249ece786642bbb49d06a307df218d03da41c317417",
48-
"dependencies": {
49-
"@lucide/svelte": "^0.525.0",
50-
"@wxt-dev/analytics": "^0.5.0",
51-
"bits-ui": "^2.8.10"
52-
}
57+
"packageManager": "pnpm@10.12.3+sha512.467df2c586056165580ad6dfb54ceaad94c5a30f80893ebdec5a44c5aa73c205ae4a5bb9d5ed6bb84ea7c249ece786642bbb49d06a307df218d03da41c317417"
5358
}

‎playwright.config.ts‎

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
import { defineConfig, devices } from "@playwright/test";
2+
3+
/**
4+
* Read environment variables from file.
5+
* https://github.com/motdotla/dotenv
6+
*/
7+
// import dotenv from 'dotenv';
8+
// import path from 'path';
9+
// dotenv.config({ path: path.resolve(__dirname, '.env') });
10+
11+
/**
12+
* See https://playwright.dev/docs/test-configuration.
13+
*/
14+
export default defineConfig({
15+
testDir: "./e2e",
16+
/* Run tests in files in parallel */
17+
fullyParallel: true,
18+
/* Fail the build on CI if you accidentally left test.only in the source code. */
19+
forbidOnly: !!process.env.CI,
20+
/* Retry on CI only */
21+
retries: process.env.CI ? 2 : 0,
22+
/* Opt out of parallel tests on CI. */
23+
workers: process.env.CI ? 1 : undefined,
24+
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
25+
reporter: "html",
26+
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
27+
use: {
28+
/* Base URL to use in actions like `await page.goto('/')`. */
29+
// baseURL: 'http://localhost:3000',
30+
31+
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
32+
trace: "on-first-retry",
33+
},
34+
35+
/* Configure projects for major browsers */
36+
projects: [
37+
{
38+
name: "chromium",
39+
use: { ...devices["Desktop Chrome"] },
40+
},
41+
42+
{
43+
name: "firefox",
44+
use: { ...devices["Desktop Firefox"] },
45+
},
46+
/* Test against mobile viewports. */
47+
// {
48+
// name: 'Mobile Chrome',
49+
// use: { ...devices['Pixel 5'] },
50+
// },
51+
// {
52+
// name: 'Mobile Safari',
53+
// use: { ...devices['iPhone 12'] },
54+
// },
55+
56+
/* Test against branded browsers. */
57+
// {
58+
// name: 'Microsoft Edge',
59+
// use: { ...devices['Desktop Edge'], channel: 'msedge' },
60+
// },
61+
// {
62+
// name: 'Google Chrome',
63+
// use: { ...devices['Desktop Chrome'], channel: 'chrome' },
64+
// },
65+
],
66+
timeout: 5* 60 * 1000,
67+
/* Run your local dev server before starting the tests */
68+
// webServer: {
69+
// command: 'npm run start',
70+
// url: 'http://localhost:3000',
71+
// reuseExistingServer: !process.env.CI,
72+
// },
73+
});

0 commit comments

Comments
 (0)