메뉴
Adds or updates extension E2E tests using the project Playwright setup and fixture (load unpacked extension, popup/background). Use when adding e2e for a feature, fixing failing e2e, or when changing popup/options/background flows.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Refines GitHub issues using the block template and label table below. Tracking lives on GitHub; use when triaging issues, refining a new issue, or when the user asks to refine an issue.
Creates a GitHub PR for the current work using GitHub MCP; links to an existing issue with Closes
Checklist for updating project skills when the codebase or workflow changes. Use when applying the skill-maintenance rule, after dependency upgrades or script/e2e/release/issue-format changes, or when the user asks how to keep skills up to date.
Cross-language code quality principles for review and refactors. Use when reviewing structure and naming, applying Kent Beck-style patterns, or when working with the code-quality dev agent. Canonical text lives under .agents/.
Provides project context for the amgiflol WXT + Svelte 5 browser extension. Use when adding or editing extension code, adding entrypoints, fixing extension bugs, or when working in src/entrypoints or wxt.config.ts.
Uses changesets for versioning and changelog; avoids manual version bumps; aligns with build/zip and workflow_dispatch. Use when cutting a release, adding a changeset, preparing for publish, or when touching version or changelog.
| name | e2e-playwright-extension |
| description | Adds or updates extension E2E tests using the project Playwright setup and fixture (load unpacked extension, popup/background). Use when adding e2e for a feature, fixing failing e2e, or when changing popup/options/background flows. |
Aligned with WXT’s Playwright E2E example: Chromium only, extension loaded from dist/chrome-mv3.
webServer + custom static server:
e2e/serve-fixtures.mjsplaywright.config.ts points webServer.url at http://localhost:51234/inspector-playground.htmluse.baseURL is http://localhost:51234/inspector-playground.htmlThe fixture extends Playwright with:
dist/chrome-mv3Use context and extensionId in tests. Import the extended test and expect from the fixture.
Navigate to chrome-extension://${extensionId}/popup.html. Use helpers like openPopup(page, extensionId) from e2e/pages/popup.ts for consistent setup. Tests: "popup opens and shows active toggle" (Popup), "inspector root and app load on supported page" (Content injection), "when domain is enabled in storage, inspector is active on page load" (Per-domain activation).
CI: .github/workflows/playwright.yml uses jdx/mise-action then pnpm install --frozen-lockfile.
First-time: pnpm exec playwright install chromium (installs Chromium and headless shell; do not use --no-shell or default tests will fail).
Build the extension: pnpm build so dist/chrome-mv3 exists.
Run tests: pnpm test:e2e
playwright-webextext is in devDependencies for potential future use; current tests use the custom extension fixture in fixtures.ts.
When a test needs deterministic inspector target setup (distances/side panel), prefer triggering the inspector via a synthetic mouseover on a known element (see toolbar-distances.spec.ts) rather than relying on hit-testing/hover in the presence of the overlay.