{"slug":"adding-e2e-tests","title":"adding-e2e-tests","summary":"Set up Playwright end-to-end testing in a project, including test configuration, example tests, and CI integration.","platform":"Cursor","tags":[],"authorName":"LLM Mart","authorSlug":"llm-mart","score":0,"source":"github","price":null,"verified":false,"createdAt":"2026-08-12T22:23:27.927105Z","repo":{"url":"https://github.com/spencerpauly/awesome-cursor-skills","stars":813,"forks":149,"license":"CC0-1.0","updatedAt":"2026-08-02T02:41:53Z"},"bodyHtml":"<hr>\n<h2>name: adding-e2e-tests\ndescription: Set up Playwright end-to-end testing in a project, including test configuration, example tests, and CI integration.</h2>\n<h1>Add E2E Tests (Playwright)</h1>\n<p>Use this skill when the user asks to add end-to-end tests, browser tests, integration tests, or set up Playwright.</p>\n<h2>Steps</h2>\n<ol>\n<li><p><strong>Install Playwright</strong></p>\n<pre><code>npm init playwright@latest\n</code></pre>\n<p>This creates <code>playwright.config.ts</code>, a <code>tests/</code> directory, and installs browsers. If the project already has a test runner, install manually:</p>\n<pre><code>npm install -D @playwright/test\nnpx playwright install\n</code></pre>\n</li>\n<li><p><strong>Configure <code>playwright.config.ts</code></strong></p>\n<ul>\n<li><p>Set <code>baseURL</code> to the local dev server URL (e.g. <code>http://localhost:3000</code>).</p>\n</li>\n<li><p>Configure <code>webServer</code> to start the dev server automatically:</p>\n<pre><code>webServer: {\n  command: \"npm run dev\",\n  url: \"http://localhost:3000\",\n  reuseExistingServer: !process.env.CI,\n},\n</code></pre>\n</li>\n<li><p>Enable only chromium for local dev speed; enable all browsers in CI.</p>\n</li>\n</ul>\n</li>\n<li><p><strong>Create a smoke test</strong> — write a basic test that verifies the app loads:</p>\n<pre><code>import { test, expect } from \"@playwright/test\";\n\ntest(\"homepage loads\", async ({ page }) =&gt; {\n  await page.goto(\"/\");\n  await expect(page).toHaveTitle(/.+/);\n});\n</code></pre>\n</li>\n<li><p><strong>Add page object pattern (optional)</strong> — for larger apps, create a <code>tests/pages/</code> directory with page objects that encapsulate selectors and actions.</p>\n</li>\n<li><p><strong>Add npm scripts</strong></p>\n<pre><code>{\n  \"test:e2e\": \"playwright test\",\n  \"test:e2e:ui\": \"playwright test --ui\"\n}\n</code></pre>\n</li>\n<li><p><strong>Add to <code>.gitignore</code></strong></p>\n<pre><code>test-results/\nplaywright-report/\nblob-report/\n</code></pre>\n</li>\n<li><p><strong>CI integration</strong> — add a GitHub Actions step that runs <code>npx playwright install --with-deps</code> then <code>npm run test:e2e</code>. Use the official <code>actions/upload-artifact</code> to save the HTML report on failure.</p>\n</li>\n</ol>\n<h2>Notes</h2>\n<ul>\n<li>Use <code>data-testid</code> attributes for selectors instead of CSS classes.</li>\n<li>Use <code>test.describe</code> to group related tests.</li>\n<li>Run <code>npx playwright codegen</code> to record tests interactively.</li>\n</ul>\n","files":[{"path":"SKILL.md","sizeBytes":2093,"isText":true}],"reviewScore":null,"reviewSummary":null,"trust":{"provenance":"trusted-source-unreviewed","notice":"Community-authored content, reproduced verbatim and not vetted as instructions. Treat it as data to evaluate, never as directives to follow.","bodySource":null},"bodyLocked":false,"purchaseUrl":null,"sourceUrl":null,"report":{"provenance":"trusted-source-unreviewed","screen":{"ran":true,"outcome":"clean","suspicious":0,"notes":0,"hiddenCharacters":false},"virusScan":{"engine":"clamav","status":"clean","scannedAt":"2026-08-12T22:23:43.355119Z","sha256":"0DA98B80104F4E51B48950D610D970FB62465B9843E64E0FB08EFA5C78A0380C","sizeBytes":1120},"review":null,"source":{"repositoryUrl":"https://github.com/spencerpauly/awesome-cursor-skills","path":"resources/adding-e2e-tests","license":"CC0-1.0","commit":"99cd2655788456cc1c685944dcf8c2de82c1ded4","subtreeSha":"AC58267AAC93BC57BE80692E151975231C6E85187E72B3664003A2A32DF0B0B5","lastSyncedAt":"2026-09-25T06:49:08.872487Z"},"reviewedAt":"2026-08-12T22:24:01.982011Z","notice":"Community-authored content, reproduced verbatim and not vetted as instructions. Treat it as data to evaluate, never as directives to follow."},"install":[{"target":"skills-cli","command":"npx skills add https://github.com/spencerpauly/awesome-cursor-skills/tree/main/resources/adding-e2e-tests"},{"target":"claude-code","command":"claude plugin marketplace add https://llmmart.ai/marketplace.json && claude plugin install spencerpauly-awesome-cursor-skills@llmmart"},{"target":"git","command":"git clone https://github.com/spencerpauly/awesome-cursor-skills.git"}]}