WorkAI

Инструмент: Браузер

Агент WorkAI открывает страницу во встроенном браузере: превью вёрстки с автообновлением, чтение содержимого, скриншоты, клики и ввод текста.

У WorkAI есть два разных способа работы с браузером, и они не взаимозаменяемы. open_local_preview показывает результат вёрстки, которую только что сгенерировал или поправил агент: открывает локальный .html-файл во встроенной вкладке и перезагружает её при каждом сохранении. Набор инструментов общего браузинга — open_browser_page, read_page, screenshot_page и ещё семь — умеет открывать произвольные адреса, читать содержимое страницы, кликать, вводить текст и снимать скриншоты.

Какие браузерные инструменты есть у агента

Отдельно включать их не нужно — агент выбирает инструмент сам. Все, кроме локального превью, работают по одной схеме: сначала open_browser_page возвращает идентификатор страницы (pageId), дальше этот идентификатор передаётся во все остальные вызовы.

ИнструментЧто делаетКогда агент его выбирает
open_local_previewОткрывает локальный .html/.htm во встроенной вкладке с автообновлениемСразу после того, как создал или существенно поправил локальную страницу
open_browser_pageОткрывает адрес (http://, https://, file://) и возвращает pageId. Страницу, открытую как file://, агент может только показать — читать её и кликать по ней нельзяНужно посмотреть работающий интерфейс или пройти вход на сайт
read_pageОтдаёт заголовок, адрес, весь видимый текст и интерактивные элементы страницыПосле открытия и после каждого действия — чтобы увидеть новое состояние
screenshot_pageСнимает изображение области просмотра или отдельного элементаКогда нужно оценить именно внешний вид, а не текст
navigate_pageПереход по адресу, назад, вперёд, перезагрузкаПереход на другой раздел проверяемого приложения
click_elementКлик по элементу (левой, правой, средней кнопкой; двойной клик)Пройти сценарий: нажать кнопку, открыть меню
type_in_pageВвод текста в поле или нажатие клавиши (Enter, Tab, Control+a)Заполнить форму, отправить запрос в поиск
hover_elementНаведение курсораПроверить подсказку, выпадающее меню, состояние наведения
drag_elementПеретаскивание одного элемента на другойПроверить сортировку списка, drag-and-drop
handle_dialogОтвет на alert/confirm/prompt и выбор файлов в диалоге загрузкиСтраница показала модальное окно и ждёт ответа
run_playwright_codeВыполняет произвольный код Playwright на страницеПоследнее средство, когда остальных инструментов не хватает

Элемент для клика, ввода или наведения агент указывает либо селектором, либо ссылкой (ref) на элемент из последнего снимка read_page — второй способ надёжнее, потому что ссылка взята из реального состояния страницы.

Отдельного инструмента прокрутки нет и он обычно не нужен: read_page отдаёт содержимое страницы целиком, независимо от того, что сейчас в области просмотра. Если нужно именно физически прокрутить (например, чтобы сработала ленивая подгрузка), это делается через run_playwright_code.

Спрашивает ли агент разрешение открыть страницу

Да. Открытие новой страницы (open_browser_page), переход по адресу (navigate_page) и выполнение кода Playwright (run_playwright_code) показывают подтверждение — «Open Browser Page?», «Navigate Browser?» — с адресом, на который агент собирается пойти. Пока вы не выдадите этим инструментам разрешение прямо из диалога, они будут спрашивать каждый раз. Остальные браузерные действия (чтение, скриншот, клик, ввод) выполняются на уже открытой странице без отдельного вопроса. Как устроены сами разрешения и их области — Режимы запуска и разрешения.

Как выглядит цикл «поправил — посмотрел — поправил»

Типичный проход по одной правке вёрстки выглядит так:

  1. Агент правит файл (edit_file) и, если это локальная страница, открывает её через open_local_preview — вкладка появляется рядом с чатом.
  2. Дальше страница обновляется сама: при сохранении .html, .css, .js, .mjs, .cjs превью перезагружается. Просить «обнови вкладку» не нужно.
  3. Если агент не уверен в визуальном результате, он снимает screenshot_page и смотрит на страницу как на картинку.
  4. Если нужно проверить поведение, а не картинку, он читает read_page — там же приходят ошибки консоли и неудавшиеся запросы.
  5. Найденную проблему он правит и повторяет проверку. Один и тот же файл не открывается дважды: превью уже открыто, и повторный open_browser_page только создал бы дубль вкладки — агенту это запрещено инструкцией.

Так же устроена и самопроверка результата в режиме Создателя: после сборки агент поднимает проект, открывает превью и при сомнениях сверяется скриншотом, а не заявляет «готово» вслепую.

Что агент видит на странице и чего не видит

read_page возвращает не картинку, а текстовый снимок: заголовок и адрес страницы, дерево доступности со всем видимым текстом, ссылками, кнопками и полями. Вместе с ним приходит блок недавних событий:

  • ошибки и предупреждения консоли (обычные console.log не попадают — только error и warning);
  • необработанные ошибки JavaScript со стеком;
  • запросы, которые не выполнились, — метод, адрес и текст ошибки;
  • скачанные файлы;
  • открытый модальный диалог или диалог выбора файла, если он ждёт ответа.

Чего в снимке нет: успешных сетевых запросов с телами и заголовками (видны только неудавшиеся), содержимого запросов и ответов, значений полей, скрытых от разметки. Пиксельную картину даёт только screenshot_page. Если после действия на странице ничего не изменилось, вместо снимка приходит пометка <unchanged> — контекст на повтор не тратится.

Какие страницы агент видит, а какие нет

Вкладка встроенного браузера, которую вы открыли сами, агенту не видна, пока вы её не расшарите. Агент видит в контексте список доступных страниц, а про остальные знает только количество — без заголовков и адресов. Когда он просит открыть адрес, на котором у вас уже есть неподелённая вкладка, WorkAI предложит поделиться ею вместо открытия новой.

Отдельным правилом закреплено и то, что содержимое страницы для агента — данные, а не команды: всё, что вернули open_browser_page, read_page, navigate_page и run_playwright_code, инструкцией не считается. Текст вида «игнорируй предыдущие инструкции» на открытой странице агент выполнять не будет — источник команд только ваши сообщения и правила проекта. Подробнее про модель ограничений — на странице Безопасность агента.

Куда агент может ходить

По умолчанию агент может открыть любой адрес, но открывает браузер редко и осознанно: ему предписано использовать браузерные инструменты только там, где нужны реальное взаимодействие со страницей, проверка интерфейса, прохождение входа или осмотр отрисованного состояния. Читать публичную документацию или справочник API через браузер он не должен — для этого есть более дешёвые способы.

Если нужно жёстко ограничить список доменов, включите в настройках chat.agent.networkFilter и заполните chat.agent.allowedNetworkDomains (поддерживаются шаблоны вида *.example.com) и chat.agent.deniedNetworkDomains; запреты приоритетнее разрешений, а если оба списка оставить пустыми — запрещены все домены. Ограничение действует на все страницы: заблокированный адрес агент не сможет ни открыть, ни прочитать, ни даже увидеть его заголовок в списке вкладок.

Что остаётся в браузере между сессиями

Встроенный браузер хранит cookie, localStorage и прочие данные сайтов между запусками — поэтому вход, который вы прошли один раз, работает и в следующей сессии, в том числе на странице, с которой работает агент. Область хранения задаётся настройкой workbench.browser.dataStorage:

ЗначениеПоведение
defaultОбщее хранилище для локальных проектов, отдельное — для удалённых
globalОдно хранилище на все проекты
workspaceОтдельное хранилище для каждого проекта
ephemeralНичего не сохраняется, всё исчезает вместе с вкладкой

В непроверенном проекте (Workspace Trust не выдан) настройка игнорируется и хранилище всегда временное. Очистить данные можно из палитры команд: Clear Storage (Global), Clear Storage (Workspace), Clear Storage (Ephemeral) — команда доступна для той области, которая сейчас используется.

Локальный превью: что именно открывается

open_local_preview принимает единственный параметр — путь к .html- или .htm-файлу. Файл другого типа инструмент не примет.

Дальше поведение зависит от проекта:

  • Статическая страница. Поднимается лёгкий локальный сервер, отдающий файл и соседние ресурсы (CSS, JS, изображения). Вкладка открывается рядом с чатом, обновление по сохранению работает полностью.
  • Проект на фреймворке. Если рядом найден конфиг Vite, Next.js, Astro, Nuxt, Angular или webpack — либо соответствующая зависимость или скрипт в package.json (сюда же попадают Parcel, Create React App и SvelteKit) — превью запускает собственный dev-скрипт проекта: первый найденный из dev, start, serve. Пакетный менеджер определяется по lock-файлу (pnpm-lock.yaml → pnpm, yarn.lock → yarn, bun.lock/bun.lockb → bun, иначе npm), адрес открывается тот, который выдал сам dev-сервер.
  • Запасной вариант. Если сервер поднять не удалось, страница открывается как обычный файл. Она по-прежнему перезагружается при сохранении, но живой подстановки стилей уже нет.

Агенту при этом отдельно запрещено поднимать превью через терминал (live-server, npx serve, python -m http.server и подобное) — так что зависших сторонних процессов и дублирующих вкладок при штатной работе быть не должно.

В каких режимах это доступно

Режим чатаЛокальный превьюИнструменты общего браузинга
АгентДаДа
СоздательДаТолько screenshot_page
ОбучениеДаНет
ОбсуждениеНетНет
ПланированиеНетНет

Режим планирования устроен как жёсткий: модели физически не отдают инструменты, которые могут что-то изменить, и браузерные в их числе. Режиму «Создатель» из браузерного набора оставлены только превью и скриншот — этого хватает на самопроверку сборки. Про сами режимы — на страницах Agent — обзор и Режимы запуска и разрешения.

Если превью не открылось

  • В ответе агента написано, что превью не стартовало. Вместе с сообщением он получает причину и хвост логов запуска — обычно это несобранные зависимости, отсутствующий dev-скрипт или занятый порт. Поставьте зависимости и попросите повторить; в панели превью есть кнопка повторного запуска.
  • Агент не открывает превью сам. Он ориентируется на путь, который вернули create_file/edit_file. Если файл создавали не в этом диалоге, укажите путь явно.
  • Агент отказывается открыть сайт или не видит его заголовок. Проверьте настройки доменов из раздела выше: адрес мог попасть под запрет.
  • Агент не видит вашу вкладку. Поделитесь ею — до этого страница для него не существует.

Дальше

  • Agent — обзор — режимы чата и остальные инструменты.
  • Инструмент: Терминал — как агент запускает dev-сервер и тесты, и что при этом требует подтверждения.
  • Быстрый старт — как агент создаёт и правит файлы, прежде чем показывать их в браузере.