본문으로 건너뛰기
cccskills
무료GitHub에 공개

site-e2e-playwright

マーケサイト向け E2E。Playwright CLI、Cursor エージェントのターミナル実行、Playwright MCP(user-playwright)の使い分け。docs/site/e2e-scenarios.md を単一の真実にする(全PJ共通)。

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

ax-inc-dev/claude-cursor-orchestration스타 3(GitHub 3 + cccskills 0)
연동 도구Playwright

실행 점수 미검증

설치 방법 보기

포함된 파일(1)

  • SKILL.md3.6 KB

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

Site E2E + Playwright(全PJ共通)

When to Use

  • ユーザーが E2E実行 と合図したとき
  • site-build-orchestrator の実装後、受け入れを機械的に確認するとき
  • Subagent site-e2e-runner が従う手順の正本

単一の真実

  • docs/site/e2e-scenarios.md — シナリオ・Given-When-Then・回帰チェックリスト
  • リポに Playwright がある場合は e2e/ または tests/e2e/ 等の既存規約に シナリオ ID または見出しで対応づけを書く(本 SKILL の「対応表」節)

実行経路(優先順)

A. Playwright CLI(本命・CI とも一致させやすい)

  1. プロジェクトルートで package.json に @playwright/test または playwright があるか確認。
  2. dev サーバーが必要なら、別ターミナルまたは webServer in playwright.config で起動済みにする。
  3. エージェントは Cursor の Agent チャットからターミナルツールでコマンド実行する(実行環境は Cursor の エージェント用シェル/サンドボックス設定に従う。失敗時はユーザーへ同コマンドの手元実行を依頼)。
  4. 標準コマンド例(プロジェクトの scripts に合わせて置換):
    • npx playwright test
    • npx playwright test --grep "@smoke"
    • プレビュー URL だけ触る場合: npx playwright test --config=playwright.config.ts(中で baseURL を環境変数化)

B. Playwright MCP(user-playwright / playwright)

CLI 不在、或いは 探索的に e2e-scenarios.md をなぞるとき。

  1. MCP ツールのスキーマを mcps/user-playwright/tools/*.json 等で確認してから call_mcp_tool する。
  2. サーバー名: user-playwright(環境により表示名は playwright)。
  3. 典型フロー: browser_navigate → browser_snapshot → browser_click / browser_type → 必要なら browser_take_screenshot。
  4. シナリオごとに結果を簡潔に記録し、最後に パス / 失敗 / 未実施 を一覧にする。

C. 手動

自動化が無い場合でも、e2e-scenarios.md のチェックリストを 人が潰す前提で、エージェントは手順と期待結果だけ出す。

Cursor エージェント環境について

  • ターミナル経由の Playwrightは、Cursor が Agent に与える 隔離・権限制約の影響を受ける(ネットワーク禁止・特定パス読み取り専用等)。失敗したらログを貼り、ユーザー側のローカル or CI で再現させる。
  • MCP ブラウザは 別プロセスのことが多く、CLI と同じ baseURL を明示して揃える。

e2e-scenarios.md に書くとよい追加欄

各シナリオに次を任意で追加:

  • Playwright: ファイル名 + test.describe / テスト名、または @tag
  • MCP: 主要ステップの一行要約

完了の宣言

テストを実際に実行し、終了コード(または MCP 相当の証跡)と要約を出してから「パス」と言う。ホームに verification-before-completion SKILL があればそれにも従う。

参考

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

댓글

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

보내면 바로 공개됩니다. 이메일 주소나 전화번호 같은 개인 정보는 쓰지 마세요. URL은 2개까지입니다.

0 / 1,000자

이 양식은 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

같은 저장소의 스킬

B2B サイトの戦略・情報設計。価値提案・メッセージマップ・ジャーニー導線・意思決定マップ・信頼棚卸・トーン/禁止表現まで一気通貫でテンプレ化する。実装前フェーズ専用(全PJ共通)。

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

ax-inc-dev/claude-cursor-orchestration32026년 4월 25일 업데이트

babysit

무료

Keep a PR merge-ready by triaging comments, resolving clear conflicts, and fixing CI in a loop.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

ax-inc-dev/claude-cursor-orchestration32026년 4월 25일 업데이트

法人向けHTMLプレゼンスライドの実装エンジン。Claude Codeから指示書(アウトライン+テンプレート指定+カラー+コンテンツ)を受け取り、単一HTMLファイルとして実装する。43種テンプレート+14種アニメーション。トリガー:プレゼン実装、スライドHTML生成、提案資料コーディング。

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

ax-inc-dev/claude-cursor-orchestration32026년 4월 25일 업데이트

You MUST use this before any creative work - creating features, building components, adding functionality, or modifying behavior. Explores user intent, requirements and design before implementation.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

ax-inc-dev/claude-cursor-orchestration32026년 4월 25일 업데이트

canvas

무료

A Cursor Canvas is a live React app that the user can open beside the chat. You MUST use a canvas when the agent produces a standalone analytical artifact — quantitative analyses, billing investigations, security audits, architecture reviews, data-heavy content, timelines, charts, tables, interactive explorations, repeatable tools, or any response that benefits from visual layout. Especially prefer a canvas when presenting results from MCP tools (Datadog, Databricks, Linear, Sentry, Slack, etc.) where the data is the deliverable — render it in a rich canvas rather than dumping it into a markdown table or code block. If you catch yourself about to write a markdown table, stop and use a canvas instead. You MUST also read this skill whenever you create, edit, or debug any .canvas.tsx file.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

ax-inc-dev/claude-cursor-orchestration32026년 4월 25일 업데이트

Authors Cursor Rules (.cursor/rules/*.mdc) and custom Subagents (.cursor/agents/*.md or ~/.cursor/agents). Use when creating or refactoring rules/subagents, splitting large rules, choosing subagent vs skill, setting model/readonly/background, or replacing repeated delegation prompts.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

ax-inc-dev/claude-cursor-orchestration32026년 4월 25일 업데이트

ax-inc-dev의 스킬 모두 보기

이 스킬의 문제 신고