dogfood

Overview

What the dogfood skill does

dogfood スキルは、agent-browser クライアントを使って Web アプリケーションの探索的テストを自動化します。対象のサイトやアプリを体系的にたどりながら、ビジュアル UI、機能、UX、パフォーマンス、コンソール、アクセシビリティといった観点で不具合を洗い出し、以下を含む 構造化された QA レポート を生成します。

• 明確な問題タイトルとカテゴリ
• 重大度 (critical / high / medium / low)
• チームメンバーがそのまま実行できる再現手順
• 手順ごとのスクリーンショット
• 必要に応じたインタラクティブな問題の再現動画

そのため、"dogfood して"、"QA お願い"、"探索的テストして"、"バグハントして"、"このアプリ/サイト/プラットフォームをテストして" といった依頼を受けたときに、エンジニア・デザイナー・プロダクトマネージャーへそのまま渡せるエビデンスを揃えるのに特に役立ちます。

Who dogfood is for

以下のような方は dogfood スキルの利用を検討してください。

• 繰り返し可能な探索的テストと、十分な再現エビデンスを求める QA エンジニア / SDET
• リリース前の変更をざっと確認したい フロントエンド / フルスタックエンジニア
• 具体的な例を伴う素早い UX / UI フィードバックが欲しい プロダクトマネージャー / デザイナー
• 専任の QA 担当はいないが、体系的に不具合を見つけたい スタートアップや小規模チーム

When dogfood is a good fit

Dogfood が特にフィットするケース:

• 対象が ブラウザベースの Web アプリ / サイト（パブリックドメイン or localhost）である
• 単一のスクリプトテストではなく、エンドツーエンドで動線を探索したい
• 露骨な機能バグだけでなく、UX や UI の完成度も重視したい
• 既存のワークフローに組み込みやすい 共有可能な成果物（スクリーンショット、動画、Markdown レポート）が必要

逆に、以下のような場合はあまり向きません。

• 主な対象がブラウザ UI を持たない 純粋なバックエンド API
• ユーザー視点ではなく、ユニットテストや低レベルの結合テストだけを求めている
• 探索的な操作で得られる範囲を超えた、正式な負荷試験や合成パフォーマンス計測が必要

How dogfood works at a high level

vercel-labs/agent-browser リポジトリから、dogfood は agent-browser クライアントを次のように設定して実行します。

• ブラウザで開く ターゲット URL
• 任意の セッション名、スコープ、出力ディレクトリ
• ログインが必要な場合の任意の 認証手順
• 結果の分類を揃えるための参照用 issue taxonomy (references/issue-taxonomy.md)
• 最終 QA レポートの構造を定義する report template (templates/dogfood-report-template.md)

これらをもとにブラウザを操作し、主要なユーザーフローをたどりながら問題を検出したタイミングでスクリーンショットや動画を取得し、統一フォーマットで記録します。

How to Use

Prerequisites

dogfood を効果的に使うには、以下を準備しておきます。

• vercel-labs/agent-browser リポジトリに含まれる agent-browser クライアントへのアクセス
• テスト対象のアプリやサイトの URL（例: https://example.com や http://localhost:3000）
• （任意）アプリが認証を必要とする場合のテスト用アカウント情報

このスキルは、アップストリームのドキュメントで説明されている ネイティブの agent-browser バイナリ を前提としており、npx agent-browser は前提としていません。これにより、高速な Rust クライアントのメリットを最大限活用できます。

Installing the dogfood skill

dogfood スキルは、次のコマンドでエージェントのスキル環境に追加できます。

npx skills add https://github.com/vercel-labs/agent-browser --skill dogfood

この操作により、vercel-labs/agent-browser リポジトリ内の skills/dogfood から dogfood のスキル定義一式が取得されます。内容には以下が含まれます。

• SKILL.md – スキルの概要と実行時の前提条件
• references/issue-taxonomy.md – 問題の分類を一貫させるためのルール
• templates/dogfood-report-template.md – 最終レポート用の Markdown テンプレート

インストール後、Files タブまたはローカルチェックアウトから、初回実行前にこれらのファイルを確認しておくとスムーズです。

Core configuration: required and optional inputs

dogfood スキルは、すぐにテストを始められるよう合理的なデフォルトを持つ設計になっています。

必須パラメータ

• Target URL – dogfood の対象とする Web アプリ / サイト
  例: vercel.com, https://example.com, http://localhost:3000

デフォルト付きの任意パラメータ

• Session name
  デフォルト: ドメイン名をスラッグ化したもの（例: vercel.com → vercel-com）
  上書き例: --session my-first-dogfood-run

• Output directory
  デフォルト: ./dogfood-output/
  上書き例: Output directory: /tmp/qa

• Scope
  デフォルト: アプリ全体
  上書き例: Focus on the billing page, Only test onboarding and settings, Ignore marketing pages

• Authentication
  デフォルト: なし
  上書き例: Sign in to user@example.com（実際の認証情報は通常の安全な方法で共有）

誰かが「dogfood vercel.com」と指示した場合、スキルは 追加入力なしでデフォルト設定ですぐ開始 できることを意図しています。サインインが必要なのに認証情報が一切ない、といったケースを除き、追加の確認質問は行わない前提です。

Typical dogfood workflow

以下の流れは、あらゆる Web アプリをテストする際の基本パターンとして利用できます。

1. Initialize a dogfood session

まず、どこまでカバーするかと、結果の保存先を決めます。例えば次のようにします。

• Target URL を選ぶ（ローカル開発なら http://localhost:3000、あるいはステージング環境のドメインなど）
• 実行を区別したい場合は任意で Session name を付ける
• 結果を共有フォルダに保存したい場合は Output directory をカスタマイズ

その上で、dogfood スキルを有効にしたエージェントを起動し、SKILL.md に記載の方法でこれらのパラメータをプロンプトや設定として渡します。

2. Authenticate if needed

アプリがログイン必須の場合:

• Sign in to qa-user@example.com のように、どのアカウントでログインするかを明示
• テスト用の認証情報を、通常利用している安全な手段で利用可能にしておく

dogfood スキルは認証を探索フローの一部として扱うため、ログイン後のページも含めて問題を検出できます。

3. Explore key user journeys

指定したスコープの範囲で、dogfood は代表的なユーザーフローをブラウザ操作によってたどります。例:

• 新規ユーザーのオンボーディングやサインアップ
• ログインおよびアカウント管理
• コア機能（エンティティの作成・編集・削除など）の操作
• 主要セクション間のナビゲーション
• 設定・請求・プロフィールページ

この探索中、references/issue-taxonomy.md の issue taxonomy を参照しながら、問題を一貫した形で検知・分類します。

4. Capture issues with evidence

各問題について、dogfood は次の情報を収集するように設計されています。

• 簡潔で状況が分かりやすい issue title
• Severity: critical / high / medium / low
• Category: visual, functional, ux, content, performance, console, accessibility
• 問題が発生している URL
• インタラクティブな問題の場合の Repro video のパス（静的な崩れなどの場合は N/A）
• 誰でも視覚的に追える step-by-step screenshots

この構造は、templates/dogfood-report-template.md のフォーマットに対応しています。

5. Generate the dogfood report

探索が完了すると、スキルは templates/dogfood-report-template.md に沿った Markdown レポートを出力します。

• 重大度ごとの件数をまとめた summary table
• 各 issue について説明と再現手順（スクリーンショット付き）を記載した詳細な Issues セクション

レポートはコードベースと並べて管理したり、チケットに添付したり、そのままチームに共有したりと、運用に合わせた形で活用できます。

Customizing dogfood for your workflow

デフォルト設定のままでも十分に使えますが、QA プロセスに合わせて dogfood をカスタマイズすることもできます。

• チーム共通の output directory（例: /tmp/qa や共有ネットワークボリューム）を指定
• スコープを絞り、請求・チェックアウト・新機能など リスクの高い領域にフォーカス
• references/issue-taxonomy.md を確認し、自社の QA 基準に合わせて重大度やカテゴリの定義を合わせる
• 生成された Markdown レポートをバグトラッカーに取り込み、個別の issue として登録したり、レポート全体を添付したりする

Files worth reviewing in the repository

dogfood スキルの挙動を深く理解するには、まず次のファイルを確認するとよいでしょう。

• SKILL.md – スキルの動作概要と、呼び出すツールの詳細を示す信頼できる一次情報
• references/issue-taxonomy.md – 重大度レベル、カテゴリ、探索チェックリストを定義し、実行ごとの結果を揃えるための基準
• templates/dogfood-report-template.md – 最終レポートにおける Issue やセッション要約のフォーマットを明示

FAQ

Is dogfood a unit test or end-to-end test framework?

いいえ。dogfood スキルは、主に Web アプリケーション向けの 探索的でユーザー中心の QA に特化しています。agent-browser を通じてブラウザを操作し、人間のテスターのようにフローを辿りながら、不具合をエビデンス付きでログに残します。ユニットテストや結合テスト、コードレベルのテストフレームワークの代替ではなく、それらを補完する形で、ビジュアル・UX・インタラクション周りの問題を拾うためのものです。

What kinds of issues can dogfood detect?

Dogfood は references/issue-taxonomy.md で定義された issue taxonomy に基づいて設計されています。次のような問題を記録することを想定しています。

• Visual / UI issues – レイアウト崩れ、テキストの重なり、レスポンシブの破綻、コントラスト不足、アイコンや画像の表示不具合など
• Functional bugs – リンク切れ、反応しないボタン、送信できないフォーム、不正なリダイレクト、状態の消失、ファイルのアップロード/ダウンロード不具合など
• UX issues – 分かりにくいナビゲーション、フィードバックの欠如、不明瞭なラベル、遅く感じる/反応が悪いインタラクションなど
• Content issues – 誤字脱字、用語の不統一、古い・誤解を招くコピー
• Performance issues – 探索中に体感される、明らかに遅いページや操作
• Console issues – 利用中にブラウザコンソールに出力されるエラーや警告
• Accessibility issues – alt テキストの欠如、キーボードトラップ、不適切なフォーカス制御など、観察可能なアクセシビリティの問題

この taxonomy に従うことで、dogfood セッションをより体系的かつ、実行間で比較しやすい形にできます。

How do I start a quick dogfood run against a new site?

誰かから「dogfood example.com して」と頼まれた場合は、次のステップで素早く実行できます。

1. vercel-labs/agent-browser から dogfood スキルがインストールされていることを確認します。
2. dogfood スキルを有効にしたエージェントを起動し、Target URL だけを指定して実行します。
3. 特別な要件がない限り、セッション名・スコープ（アプリ全体）・出力ディレクトリについてはスキルの デフォルト設定 をそのまま使います。

目的は、長い設定作業なしに、すぐテストを開始できることです。

Does dogfood require authentication to work?

いいえ。Dogfood はログイン不要の公開サイトやマーケティングサイトに対してもそのまま利用できます。

一方、重要なフローに認証が必要なアプリであれば、次のようにしてください。

• （例: Sign in to user@example.com）のように、認証が必要であることを明示します。
• 認証情報は、通常利用している安全なチャネルで提供します。

スキルはログインをセッションの一部として扱うため、認証後の領域まで含めて探索できます。

Where can I see how issues are categorized and reported?

vercel-labs/agent-browser リポジトリ内の以下 2 つのファイルが、分類とレポート構造の理解に役立ちます。

• references/issue-taxonomy.md – 重大度レベル、issue カテゴリ、探索チェックリストを解説
• templates/dogfood-report-template.md – Dogfood Report の構造（サマリーテーブルや各 issue ブロックのフォーマット）を定義。Severity, Category, URL, Repro Video, Description, Repro Steps などの項目がどのように並ぶかを確認できます。

初回実行前にこれらを読んでおくと、dogfood スキルが出力するレポートを理解しやすくなり、自分たち用にカスタマイズする際の指針にもなります。

When is dogfood not the right tool?

dogfood スキルが適さないケースとして、次のようなものがあります。

• agent-browser が操作できない 非ブラウザ環境（CLI ツール、デスクトップアプリ、バックエンドサービスなど）をテストしたい場合
• 定量的な指標を得るための 負荷試験 や、定義済みシナリオによる 合成パフォーマンス計測 が必要な場合
• CI パイプラインに組み込む 細かなコード化テスト を作り込みたい場合（この場合は従来のテストフレームワークと併用するのが適切です）

こうしたシナリオでは、dogfood は他のテストツールの代替ではなく、ブラウザ上の実利用行動にフォーカスした 補助レイヤー として位置付けてください。