dogfood

Overview

What the dogfood skill does

dogfood 스킬은 agent-browser 클라이언트를 사용해 웹 애플리케이션의 탐색형 테스트를 자동화합니다. 대상 사이트나 앱을 체계적으로 둘러보며 시각적 UI, 기능, UX, 성능, 콘솔, 접근성 전반의 결함을 찾고, 다음을 포함하는 구조화된 QA 리포트를 만들어 냅니다.

• 명확한 이슈 제목과 카테고리
• 심각도 레벨(critical, high, medium, low)
• 동료가 그대로 따라 할 수 있는 재현 단계
• 단계별 스크린샷
• 필요한 경우 인터랙티브 이슈에 대한 재현 동영상

덕분에 dogfood는 “dogfood 해봐”, “QA 한 번 봐줘”, “탐색형 테스트 해줘”, “버그 헌팅해줘”, “이 앱/사이트/플랫폼 테스트해줘” 같은 요청을 받았을 때, 엔지니어·디자이너·PM에게 바로 전달할 수 있는 증거를 빠르게 모으는 데 특히 유용합니다.

Who dogfood is for

dogfood 스킬은 다음과 같은 분들께 적합합니다.

• 반복 가능한 탐색형 실행과 풍부한 재현 증거가 필요한 QA 엔지니어 및 SDET
• 릴리스 전 변경사항을 간단히 검증하고 싶은 프론트엔드·풀스택 엔지니어
• 구체적인 예시와 함께 빠른 UX·UI 피드백이 필요한 프로덕트 매니저와 디자이너
• 전담 QA 조직은 없지만, 체계적으로 이슈를 찾고 싶은 스타트업·소규모 팀

When dogfood is a good fit

dogfood는 다음과 같은 상황에 특히 잘 맞습니다.

• 대상이 브라우저 기반 웹 앱 혹은 웹사이트일 때(공개 도메인 또는 localhost).
• 단일 스크립트 테스트가 아니라 엔드투엔드 플로우를 탐색하고 싶을 때.
• 순수 기능 버그뿐 아니라 UX·UI 완성도도 함께 중요할 때.
• 기존 워크플로에 바로 넣어 쓸 수 있는 공유 가능한 결과물(스크린샷, 동영상, markdown 리포트)을 원할 때.

다음과 같은 경우에는 적합하지 않을 수 있습니다.

• 대상이 브라우저 인터페이스가 전혀 없는 순수 백엔드 API인 경우.
• 사용자 관점의 동작 검증이 아니라, 유닛 테스트나 저수준 통합 테스트만 필요할 때.
• 탐색형 상호작용으로 드러나는 수준을 넘어서는 정식 부하 테스트나 합성 성능 벤치마크가 필요한 경우.

How dogfood works at a high level

vercel-labs/agent-browser 저장소에서 dogfood는 agent-browser 클라이언트를 다음과 같이 설정합니다.

• 브라우저에서 열 target URL
• 선택적인 세션 이름, scope, output directory
• 로그인이 필요한 경우 선택적인 authentication steps
• 결과를 일관되게 유지하기 위한 참조용 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)
• (선택) 앱에 인증이 필요하다면 테스트용 계정 정보

이 스킬은 upstream 문서에서 언급된 npx agent-browser가 아니라 직접 실행하는 agent-browser binary를 기준으로 설계되었습니다. 이를 통해 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를 실행할 웹 앱 또는 사이트
  예시: 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

웹 앱마다 일관되게 사용할 수 있는 기본 워크플로는 다음과 같습니다.

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

선택한 scope 내에서 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
• 각 이슈에 설명과 스크린샷이 포함된 재현 단계가 달린 상세 Issues 섹션

이 리포트는 코드베이스와 함께 보관하거나, 티켓에 첨부하거나, 팀 채널에서 바로 공유할 수 있습니다.

Customizing dogfood for your workflow

기본 설정만으로도 바로 사용할 수 있지만, 팀의 QA 프로세스에 맞게 dogfood를 쉽게 커스터마이징할 수 있습니다.

• 팀 공용 경로(예: /tmp/qa 또는 공유 네트워크 볼륨)를 output directory로 사용합니다.
• Scope를 좁혀 결제, 체크아웃, 신규 기능 등 위험도가 높은 영역에 집중합니다.
• references/issue-taxonomy.md를 검토해 내부 QA 기준에 맞게 심각도·카테고리 정의를 정렬합니다.
• 생성된 markdown 리포트를 버그 트래커에 후처리해, 개별 이슈를 복사하거나 전체 리포트를 첨부합니다.

Files worth reviewing in the repository

dogfood 스킬의 동작을 깊이 이해하려면 다음 파일부터 확인해 보세요.

• SKILL.md – 스킬이 어떻게 동작하는지, 어떤 도구를 호출할 수 있는지에 대한 기준 문서
• references/issue-taxonomy.md – 심각도, 카테고리, 탐색 체크리스트를 정의해 실행 간 결과를 일관되게 유지합니다.
• templates/dogfood-report-template.md – 최종 리포트에서 이슈와 세션 요약이 어떤 형식으로 출력되는지 보여줍니다.

FAQ

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

아니요. dogfood 스킬은 주로 웹 애플리케이션을 위한 탐색형·사용자 중심 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. 특별히 바꿀 것이 없다면 세션 이름, scope(전체 앱), output directory는 스킬의 기본값을 그대로 사용합니다.

목표는 긴 설정 과정 없이 즉시 테스트를 시작할 수 있게 하는 것입니다.

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 저장소에서 다음 두 참고 파일을 보면 됩니다.

• references/issue-taxonomy.md – severity levels, issue categories, exploration checklist를 설명합니다.
• templates/dogfood-report-template.md – summary table과, Severity·Category·URL·Repro Video·Description·Repro Steps(스크린샷 포함) 필드를 가진 개별 이슈 블록까지 포함한 Dogfood Report 구조를 보여줍니다.

첫 실행 전에 이 두 파일을 확인하면, dogfood 스킬이 만들어내는 리포트를 이해하고 팀에 맞게 조정하는 데 도움이 됩니다.

When is dogfood not the right tool?

dogfood 스킬은 다음과 같은 상황에는 최적의 도구가 아닐 수 있습니다.

• agent-browser가 상호작용할 수 없는 비브라우저 시스템(CLI 도구, 데스크톱 앱, 백엔드 서비스 등)을 테스트할 때
• 정성적 관찰을 넘어서 부하 테스트나 정량적 성능 지표가 필요한 경우
• CI 파이프라인에 내장되는 세밀한 코드 기반 테스트가 필요할 때 — 이 경우 전통적인 테스트 프레임워크를 사용하고, dogfood는 보완적인 브라우저 관점 레이어로 활용하는 것이 좋습니다.

이런 시나리오에서는 dogfood를 다른 테스트 도구의 대체재가 아니라, 실제 브라우저 동작에 초점을 맞춘 선택적 보조 도구로 보는 편이 더 적절합니다.