К основному содержанию
скилл Claude Code CX Codex Cursor GitHub Copilot

dev-browser — скилл для Claude Code: автоматизация браузера

Управляй настоящим Chrome через короткие скрипты Puppeteer. Именованные страницы сохраняются между запусками, так что можно продолжить работу с того же места.

Установить в Claude Code · Через Skills CLI (Vercel) Все способы и платформы ↓
npx skills add SawyerHood/dev-browser --skill dev-browser -a claude-code
Открыть на GitHub

Что делает dev-browser

dev-browser — это CLI для контроля Chrome с помощью Puppeteer-скриптов. Запускается как единый фоновый процесс, который держит браузер открытым и позволяет использовать именованные страницы. Каждая страница сохраняется между вызовами, поэтому если ты прошёл авторизацию на сайте, в следующий раз браузер помнит это состояние.

Устанавливается через npm install -g dev-browser, затем можно вызывать скрипты напрямую: перейти на сайт, кликнуть по элементам, заполнить формы, сделать скриншот, извлечь данные. Скрипты пишешь на JavaScript — вызываешь методы типа page.goto(), page.click(), page.snapshot(). Последнее выражение в скрипте выводится результатом.

Имей в виду, что page.click() не ждёт загрузки — используй waitForSelector() перед кликом, если нужно. Имена страниц привязаны к каждому браузеру отдельно (headless и headed — разные Chrome-ы), и ссылки на элементы (refs) сбрасываются при навигации, нужно вызвать snapshot() заново.

Какие задачи решает

  • заполнить форму на сайте и отправить
  • скрейпить данные со страницы и вернуть результат
  • прокликать цепочку кнопок для тестирования интерфейса
  • залогиниться и сохранить сессию для следующих запусков
  • сделать скриншот или PDF-снимок страницы

Примеры запросов агенту

  • Открой сайт example.com, сделай скриншот и вернись сюда
  • Залогинься в мой аккаунт на github.com и проверь, что получилось
  • Кликни по кнопке "Скачать отчёт" и дай мне ссылку на файл

Как установить dev-browser

1Через Skills CLI (Vercel)

npx skills add SawyerHood/dev-browser --skill dev-browser -a claude-code

2Вручную: положить файлы

~/.claude/skills/dev-browser/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/dev-browser/

Похожие

google-maps-scraper gosom Скилл для поиска компаний, контактов и отзывов на Google Картах прямо из редактора кода. Запускает локальный скрейпер через Docker, подходит для сбора лидов и данных о бизнесе без написания кода. Claude Code CX Codex Cursor +1 2 900установок playwright-skill sickn33 Скилл для написания и запуска тестов браузера через Playwright: проверка вёрстки на разных экранах, скриншоты, тесты логина и заполнения форм. Код выполняется локально через Node. Claude Code CX Codex Cursor +1 3 900установок k-schoollunch-menu NomaDamas Ищет меню школьных столовых по названию управления образования и школы. Пригодится для запросов о питании в школах Кореи. Claude Code CX Codex Cursor +1 6 700установок playwright-triage microsoft Скилл разбирает одну проблему microsoft/playwright в GitHub Actions, воспроизводит её и готовит исправление или заметку по расследованию. Claude Code CX Codex Cursor +1 414установок playwright-test-results microsoft Скилл запрашивает результаты CI-тестов Playwright в DuckDB и помогает находить сбои, флейки и медленные тесты по запускам, SHA и PR. Claude Code CX Codex Cursor +1 396установок export-download-debugging nexu-io Помогает находить и чинить ошибки выгрузки файлов в браузерах и Electron, когда сохраняются пустые файлы в 0 КБ. Пригодится при сбоях File System Access API и blob-ссылок. Claude Code CX Codex Cursor +1 1 800установок agent-browser vercel-labs Скилл управляет браузером через CLI: открывает страницы, заполняет формы, нажимает кнопки и проверяет веб-приложения. Подходит для задач, где агенту нужно действовать в интерфейсе. Claude Code CX Codex Cursor +1 1 200 000установок webapp-testing официальный anthropics Скилл запускает проверки локальных веб-приложений через Playwright: помогает отлаживать UI, делать скриншоты и смотреть логи браузера. Claude Code Claude.ai 186 758установок

Вопросы о dev-browser

Как установить dev-browser в Claude Code?

Запусти npx skills add SawyerHood/dev-browser --skill dev-browser -a claude-code. Скилл установится в ~/.claude/skills/dev-browser/. После этого ты сможешь использовать dev-browser команды в Claude Code.

Что делает dev-browser?

Это инструмент для автоматизации браузера. Ты пишешь короткие скрипты на JavaScript, которые управляют Chrome: открывают сайты, кликают по элементам, заполняют формы, извлекают данные. Состояние браузера сохраняется между вызовами.

Почему ссылки на элементы (refs) сбрасываются?

Refs привязаны к конкретному состоянию страницы. Когда ты переходишь на новый URL через page.goto(), страница меняется и все старые ссылки становятся невалидными. Вызови page.snapshot() заново, чтобы получить актуальные refs.

Исходный текст

SKILL.md · MIT
---
name: dev-browser
description: Browser automation with persistent named pages via the dev-browser CLI. Use when users ask to navigate websites, fill forms, take screenshots, extract web data, test web apps, log into sites, or automate browser workflows. Trigger phrases include "go to [url]", "click on", "fill out the form", "take a screenshot", "scrape", "automate", "test the website", "log into", "open the browser", or any browser interaction request.
---

# dev-browser

CLI for controlling a real Chrome with short Puppeteer scripts. One warm daemon; named pages persist between runs.

```bash
npm install -g dev-browser   # bun add -g dev-browser works too; the first run downloads the binary if the install script was blocked
dev-browser install          # only if the first run says "No Chrome found"
```

Run `dev-browser --help` (full guide; `dev-browser help <topic>` for one section) before non-trivial work. Quick start:

```bash
dev-browser <<'EOF'
const page = await browser.getPage("main");        // named page persists across runs
await page.goto("https://example.com");            // default waitUntil: domcontentloaded
await page.snapshot({ interactive: true })         // ARIA tree with refs; last expression is printed
EOF
dev-browser -e 'const p = await browser.getPage("main"); await p.click("ref/e6"); await p.waitForLoad(); p.url()'
```

Gotchas: end lines with semicolons (a line starting with `(` continues the previous one); return an object as
`({ a, b })`; `page.click` never waits (use `waitForSelector` first); page names are per browser (`--headless` and
headed are separate Chromes and profiles); refs reset on navigation — re-snapshot; file paths resolve against your cwd
(uploadFile, screenshot/pdf `path`); do not run parallel dev-browser calls against the same named page.

© SawyerHood · MIT · SawyerHood/dev-browser

Смотрите также

Спонсоры проекта

Компании, которые помогают держать аналитику открытой