mcpbeat

E2e Test Writing

shopify/e2e-test-writing

> Guide for writing high-quality Playwright E2E tests for Hydrogen. Use when the user asks to "write e2e tests", "add playwright tests", "test this feature end-to-end", "write recipe tests", "add integration tests", or mentions Playwright, E2E testing, or test coverage for user-facing features.

421 tokens
context cost
the whole folder, loaded on every use
1
files
instructions only
0
copies elsewhere
how many repositories repackaged it
2082
stars on the repo
on the repository, not the skill itself

Install

one command, takes just this skill from the repository
npx skills add https://github.com/Shopify/hydrogen --skill e2e-test-writing

The instruction itself

6 sections, as written by the author

/e2e-test-writing - E2E Test Writing for Hydrogen

Use this skill when implementing or reviewing Playwright E2E tests in this repository.

Syntax

/e2e-test-writing <task>

Examples:

  • /e2e-test-writing add recipe coverage for cart drawer quantity changes
  • /e2e-test-writing review locator quality in e2e/tests/cart.test.ts

Source of Truth

  • Follow e2e/CLAUDE.md for all active test patterns and conventions.
  • Do not duplicate large guidance here; keep this skill as the entry point.

Core Expectations

  • Prefer role-based, accessibility-first selectors.
  • Assert user-visible behavior, not implementation details.
  • Wait for visible effects (expect, expect.poll), never arbitrary timeouts.
  • Keep tests isolated and organize shared setup with beforeEach when it improves clarity.
  • Run Playwright tests in headless mode.

Workflow

  • Read e2e/CLAUDE.md before writing tests.
  • Implement or update tests with user-centric assertions.
  • Improve accessibility markup when it enables stronger locators.
  • Run targeted Playwright tests first, then broader suites if needed.

Verification Commands

pnpm exec playwright test --project=skeleton

Use narrower test paths during iteration, then run the appropriate full project suite before finishing.

How to use it

Copy the folder

Take shopify/e2e-test-writing from the repository into ~/.claude/skills for personal use, or into .claude/skills inside a project.

Check the name does not clash

The agent identifies a skill by the name field in its header. Two skills with the same name cannot sit side by side — one of them will be ignored.