qa-website

name	qa-website
description	yukamiya.me の品質保証チェックを実行するスキル。コンテンツ整合性（about-content.js と about.md の差分検出）、リンク検証（外部リンク 404 チェック）、UI/UX 検証（レスポンシブ、コンソールエラー）を Playwright MCP で自動実行し、問題があれば GitHub Issue を自動作成する。/qa コマンドで実行。

yukamiya.me QA スキル

yukamiya.me の品質保証チェックを実行し、問題があれば GitHub Issue を自動作成します。

実行トリガー

• /qa コマンド
• GitHub Actions (qa-post-deploy.yml)

チェックカテゴリ

1. コンテンツ整合性チェック

目的: about-content.js と about.md の内容差分を検出

チェック項目:

• 各セクションの件数比較（media, speaking, writing など）
• バイリンガルタイトル（ja/en 両方の存在確認）
• セクションタイトルの冗長性（例: 「掲載/Media」vs「Media」）

対象ファイル:

• src/data/about-content.js - 現在のデータソース
• src/content/pages/about.md - 旧コンテンツ（比較用）

2. リンク検証チェック

目的: 外部リンクの 404 エラーや到達不能を検出

チェック対象:

• about-content.js 内の全 URL
• 各ページの外部リンク

実行方法:

mcp__playwright-mcp__playwright_get を使用してステータスコード確認

3. UI/UX チェック

目的: レスポンシブデザイン、コンソールエラーの検証

チェック項目:

• Desktop (1280x720) / Mobile (iPhone 13) のスクリーンショット
• コンソールエラー検出
• ページ読み込み確認

実行方法:

mcp__playwright-mcp__playwright_navigate({ url: "https://yukamiya.me/about" })
mcp__playwright-mcp__playwright_resize({ device: "iPhone 13" })
mcp__playwright-mcp__playwright_screenshot({ name: "mobile-view" })
mcp__playwright-mcp__playwright_console_logs({ type: "error" })

実行フロー

1. コンテンツチェック

   • src/data/about-content.js を読み込み
   • src/content/pages/about.md を読み込み
   • セクションごとに件数と内容を比較
   • 差分を検出しレポート生成

2. リンクチェック

   • about-content.js から全 URL を抽出
   • 各 URL に対して HTTP GET リクエスト
   • ステータスコード確認（200 以外を報告）

3. UI/UX チェック

   • https://yukamiya.me/about に Playwright でアクセス
   • Desktop/Mobile 両方でスクリーンショット取得
   • コンソールエラーを収集

4. Issue 作成

   • 問題があれば GitHub Issue を作成
   • 適切なラベル（qa, content, broken-link, ui-ux, automated）を付与

GitHub Issue 作成

問題発見時は以下のコマンドで Issue を作成:

gh issue create \
  --title "[QA] {問題の概要}" \
  --body "$(cat <<'EOF'
## 検出日時
{timestamp}

## 概要
{description}

## 詳細
{details}

## 推奨アクション
- [ ] {action items}

---
Generated by QA Skill
EOF
)" \
  --label "qa,automated,{category}"

ラベル定義

ラベル	用途
qa	QA スキルで検出
content	コンテンツ整合性の問題
broken-link	リンク切れ
ui-ux	UI/UX の問題
automated	自動生成された Issue

既知のチェックポイント

Media セクションの差分

• about-content.js: 6 件
• about.md: 11 件
• 欠損: YOUTRUST, デジタルプラクティス論文, WTT 2024, Waffle など

セクションタイトル

• 日本語「掲載/Media」は冗長（英語は「Media」のみ）

参照ファイル

• references/check-definitions.md - 詳細なチェック定義
• references/issue-templates.md - Issue テンプレート