e2e-test-writing

โดย shopify

คู่มือการเขียนทดสอบ E2E ด้วย Playwright คุณภาพสูงสำหรับ 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.

Skills เพิ่มเติมจาก shopify

agent-device
shopify
โต้ตอบกับ iOS simulator หรือ Android emulator/device โดยใช้พิกัดที่อิงจาก snapshot ใช้ accessibility tree snapshots เพื่อกำหนดเป้าหมายองค์ประกอบอย่างแม่นยำ พร้อมกับ...
official
analyze-feedback
shopify
วิเคราะห์สิ่งประดิษฐ์ข้อเสนอแนะของเอเจนต์จากการทำงานของเวิร์กโฟลว์ GitHub Actions, ดึงข้อมูลเชิงลึกที่นำไปปฏิบัติได้, และรวมเข้ากับไฟล์ทักษะและ CLAUDE.md ติดตาม…
official
fix-github-issue
shopify
เวิร์กโฟลว์เต็มสำหรับการแก้ไขปัญหา GitHub - ทำความเข้าใจปัญหา, ทำซ้ำ, วินิจฉัยสาเหตุที่แท้จริง, แก้ไข, ทดสอบบน iOS/Android simulators, ตรวจสอบ, และสร้าง PR
official
review-and-test
shopify
ตรวจสอบ PR หรือ branch ของ FlashList, รัน unit tests, ทดสอบบน iOS simulator, และยืนยันพฤติกรรม RTL/LTR แชร์บริบทร่วมกับสกิล fix-github-issue
official
triage-issue
shopify
จัดลำดับความสำคัญของ GitHub issue — จำแนกความสำคัญ (P0/P1/P2), ค้นหา issue ที่ซ้ำกัน, และติดป้ายกำกับ
official
upgrade-react-native
shopify
อัปเกรดแอปพลิเคชันฟิกซ์เจอร์ React Native เป็นเวอร์ชันใหม่ ครอบคลุม JS deps, Android (Gradle, Kotlin, SDK), iOS (Podfile, pbxproj), การกำหนดค่า Metro และของบุคคลที่สาม…
official
hydrogen-dev-workflow
shopify
Development workflow guide for Shopify's Hydrogen framework. Covers testing, upgrading, recipes, PR conventions, analytics architecture, CLI tooling, and…
official
hydrogen-release-process
shopify
คู่มือกระบวนการเผยแพร่สำหรับเฟรมเวิร์ก Hydrogen ของ Shopify ครอบคลุมขั้นตอนการเผยแพร่ทั้งหมด (มาตรฐาน, back-fix, snapshot), ขั้นตอนแบบ manual และอัตโนมัติ, changelog.json…
official