e2e-test-writing

tarafından shopify

Hydrojen için yüksek kaliteli Playwright E2E testleri yazma kılavuzu. Kullanıcı "e2e testleri yaz", "playwright testleri ekle", "bu özelliği test et…" dediğinde kullanılır.

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 tarafından daha fazla skill

agent-device
shopify
iOS simülatörü veya Android emülatörü/cihazı ile anlık görüntü tabanlı koordinatlar kullanarak etkileşim kurar. Hassas eleman hedefleme için erişilebilirlik ağacı anlık görüntülerini kullanır, ayrıca…
official
analyze-feedback
shopify
GitHub Actions iş akışı çalıştırmalarından ajan geri bildirim yapıtlarını analiz eder, uygulanabilir öğrenimleri çıkarır ve bunları beceri dosyalarına ile CLAUDE.md'ye entegre eder. İzler…
official
fix-github-issue
shopify
Bir GitHub sorununu düzeltmek için tam iş akışı - sorunu anlama, yeniden oluşturma, kök nedeni teşhis etme, düzeltme, iOS/Android simülatörlerinde test etme, inceleme ve PR açma
official
review-and-test
shopify
Bir FlashList PR veya branch'ini incele, birim testlerini çalıştır, iOS simülatöründe test et ve RTL/LTR davranışını doğrula. fix-github-issue skill'i ile paylaşılan bağlam.
official
triage-issue
shopify
Bir GitHub sorununu triyajla — önceliği (P0/P1/P2) sınıflandır, kopyaları ara ve etiketler uygula.
official
upgrade-react-native
shopify
React Native fixture uygulamasını yeni bir sürüme yükseltin. JS bağımlılıklarını, Android (Gradle, Kotlin, SDK), iOS (Podfile, pbxproj), Metro yapılandırmasını ve üçüncü taraf… kapsar.
official
hydrogen-dev-workflow
shopify
Shopify'in Hydrogen framework'ü için geliştirme iş akışı rehberi. Test etme, yükseltme, tarifler, PR kuralları, analitik mimarisi, CLI araçları ve…
official
hydrogen-release-process
shopify
Shopify'in Hydrogen çerçevesi için sürüm süreci rehberi. Tam sürüm akışını (standart, geri düzeltme, anlık görüntü), manuel ve otomatik adımları, changelog.json'u kapsar…
official