E2E テスト基盤 E2E test framework

Parky の E2E は Playwright + manifest 駆動。tests/e2e/manifest/ 配下の YAML から source-map.json を生成し、編集ファイル → 影響テストを逆引きする仕組みで運用します（2026-04-26 完成、9 Phase / 25+ commits）。

E2E in Parky runs on Playwright with manifest-driven test selection. The YAML files under tests/e2e/manifest/ are compiled into source-map.json, which lets us walk from a touched source file to the affected tests (completed 2026-04-26 across 9 phases / 25+ commits).

3 行で言うと TL;DR
  • 5 Playwright project を multi-project + 並列 webServer で同時起動（admin / owner / marketing / public:Astro / api）
  • 5 Playwright projects launch in parallel via the multi-project + webServer config (admin / owner / marketing / public:Astro / api)
  • @channel: / @screen: / @api: / @smoke の 4 軸タグでテストを絞り込み
  • Tests are filtered by 4 tag axes: @channel: / @screen: / @api: / @smoke
  • Write / Edit Hook が source-map.json を見て影響テスト案内 or scaffold 提案を発火
  • A Claude PostToolUse hook reads source-map.json and suggests affected tests or scaffolds new ones on every Write / Edit

構成Topology

flowchart LR
  subgraph Manifest["tests/e2e/manifest/"]
    CH[channels.yaml]
    SC[screens.yaml]
    API[apis.yaml]
    SM[source-map.json
(generated)]
  end

  subgraph Runners["Playwright projects"]
    AD[admin :5173]
    OW[owner :5174]
    MK[marketing :5175]
    PB[public :4321
(Astro)]
    AP[api :8787
(wrangler dev)]
  end

  subgraph Modes["Run modes"]
    SMK[test:smoke
~2min]
    AFF[test:affected
diff-driven]
    FUL[test:full]
  end

  CH --> SM
  SC --> SM
  API --> SM

  SM --> AFF
  CH --> AD
  CH --> OW
  CH --> MK
  CH --> PB
  API --> AP

  SMK --> AD
  SMK --> OW
  SMK --> MK
  AFF --> AD
  AFF --> OW
  AFF --> MK
  FUL --> AD
  FUL --> OW
  FUL --> MK
  FUL --> PB
  FUL --> AP

Playwright projectsPlaywright projects

プロジェクトProject PortPort 起動コマンドwebServer
adminadmin51735173npm run dev (web/portal/admin)npm run dev (web/portal/admin)
ownerowner51745174npm run dev (web/portal/owner)npm run dev (web/portal/owner)
marketingmarketing51755175npm run dev (web/portal/marketing)npm run dev (web/portal/marketing)
publicpublic43214321npm run dev (web/home, Astro)npm run dev (web/home, Astro)
apiapi87878787wrangler dev (api)wrangler dev (api)

Manifest と source-mapManifest and source-map

タグと実行モードTags and run modes

コマンドCommand 役割Purpose
npm run test:smokenpm run test:smoke@smoke タグだけ走らせる代表画面 ~2 分セットRuns only @smoke-tagged tests — representative screens, ~2 min
npm run test:fullnpm run test:full全 spec を全 project で実行Full spec set across every project
npm run test:affectednpm run test:affectedgit diff → source-map.json 経由で影響 spec のみ。0 件なら @smoke にフォールバックgit diff → only affected specs via source-map.json; falls back to @smoke when none match
npm run test:channel <name>npm run test:channel <name>@channel:<name> でフィルタFilters by @channel:<name>
npm run test:screen <id>npm run test:screen <id>@screen:<id> でフィルタFilters by @screen:<id>
npm run test:api <id>npm run test:api <id>@api:<id> でフィルタFilters by @api:<id>
npm run test:uinpm run test:uiPlaywright UI モード起動Launches Playwright UI mode
npm run test:mapnpm run test:mapsource-map.json 再生成のみRebuild source-map.json only

HTTP 検証ヘルパーHTTP assertion helper

tests/e2e/helpers/api-assert.ts の recordApi(page) でリクエスト/レスポンスを画面操作中にキャプチャし、 spec 内で「画面遷移時に POST /v1/owner/parking-lots/mine が 1 回だけ走り、201 を返した」のような assertion を書ける。

recordApi(page) in tests/e2e/helpers/api-assert.ts records request/response pairs during user interaction, so a spec can assert "navigating to detail caused exactly one POST /v1/owner/parking-lots/mine with status 201".

画面追加Adding a new screen

tsx tests/e2e/scripts/new-screen.ts <channel>/<name> \
  --route=/some/path \
  --source=web/portal/admin/src/pages/SomePage.tsx \
  --smoke

screens.yaml へのべき等な追記 + spec 雛形（tests/e2e/specs/<channel>/<name>.spec.ts）+ source-map 再生成までを一発で行う。

Idempotently appends to screens.yaml, generates a spec scaffold at tests/e2e/specs/<channel>/<name>.spec.ts, and rebuilds the source-map in one shot.

PostToolUse Hook 連動PostToolUse hook integration

.claude/settings.json から .claude/scripts/run-sync-tests.cmd → tests/e2e/scripts/sync-tests.ts が Write / Edit のたびに自動で source-map を見て「影響テストはこれです」または「scaffold しますか？」を表示する。 テスト同期忘れの構造的防止策。

.claude/settings.json wires .claude/scripts/run-sync-tests.cmd → tests/e2e/scripts/sync-tests.ts to fire on every Write / Edit, surfacing "affected tests are X" or "scaffold a spec?" via the source-map. It structurally prevents drift between code and tests.

CICI

既知の TODOKnown TODOs

  1. DB 依存 spec の 500 解消: wrangler dev ローカル実行では Hyperdrive binding が解決できず /v1/parking-lots 系 3 spec が 500。回避策は (a) wrangler dev --remote + CF token / (b) ローカル Postgres + Hyperdrive localConnectionString / (c) E2E 専用 mock binding
  2. Resolve 500s on DB-dependent specs: wrangler dev cannot resolve the Hyperdrive binding locally, so 3 specs around /v1/parking-lots 500. Options: (a) wrangler dev --remote + CF token, (b) local Postgres + Hyperdrive localConnectionString, or (c) inject a mock binding for E2E
  3. continue-on-error の撤去（上記 1 が解決後）
  4. Drop continue-on-error once item 1 lands
  5. apis.yaml を api-openapi-drift.yml 経由で OpenAPI から自動再生成
  6. Auto-regenerate apis.yaml from OpenAPI via api-openapi-drift.yml

主要パス（リポルート相対）Key paths (repo-root relative)