e2e-test-writing

作成者: shopify

高品質なPlaywright E2EテストをHydrogen向けに作成するためのガイド。ユーザーが「e2eテストを書いて」「playwrightテストを追加して」「この機能をテストして」と依頼した場合に使用します。

npx skills add https://github.com/shopify/hydrogen --skill e2e-test-writing

/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

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

Workflow

  1. Read e2e/CLAUDE.md before writing tests.
  2. Implement or update tests with user-centric assertions.
  3. Improve accessibility markup when it enables stronger locators.
  4. 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.

shopifyのその他のスキル

shopify-dev
shopify
Shopifyの開発者向けドキュメントを全APIにわたって検索します。API固有のスキルが該当しない場合にのみ使用してください。
shopify-customer
shopify
Customer Account APIにより、顧客は自身の注文、支払い方法、住所などのデータにアクセスできます。
shopify-hydrogen
shopify
Hydrogenストアフロント実装のクックブック。利用可能なレシピの一部:B2Bコマース、バンドル、複合リスティング、カスタムカートメソッド、動的コンテンツ…
shopify-liquid
shopify
Liquidは、Shopifyによって作成されたオープンソースのテンプレート言語です。Shopifyテーマの基盤であり、ストアフロントに動的コンテンツを読み込むために使用されます。…
shopify-polaris-admin-extensions
shopify
アプリからカスタムアクションやブロックを、Shopify管理画面のコンテキストに応じた適切な場所に追加します。管理画面UI拡張機能は、新しい…のスキャフォールディングもサポートしています。
shopify-merchant-onboarding
shopify
完全なスキル指示を https://www.shopify.com/SKILL.md から取得し、その手順に従ってステップバイステップで実行してください。そのファイルは正規のマーチャントオンボーディングであり、環境検出、CLI + プラグインインストール、ストア認証、および目標ルーティングの完全なフローが含まれています。指示をそのまま正確に実行してください。
shopify-partner
shopify
Partner APIを使用すると、パートナーダッシュボードのデータ(アプリ、テーマ、アフィリエイト紹介など)にプログラムからアクセスできます。
ucp
shopify
ユーザーがUCP CLIを使用して、オンラインの販売者から製品を検索、比較、購入、追跡したい場合、またはローカルのUCPプロファイルを設定・トラブルシューティングしたい場合に使用します…