browser-preview — скилл для Claude Code: диагностика превью и iframe

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

Скилл включается, когда превью-панель сломалась: белый экран, вкладка исчезла, ассеты отдают 404, сервис не грузится. Он ведёт агента по шагам: сначала читает реестр запущенных сервисов в /data/previews.json, потом историю в /data/preview_history.json, затем проверяет порт через curl на стороне сервера. Если процесс упал, а запись осталась, скилл советует пересоздать сервис через preview_stop и preview_serve.

Главное правило, которое он вбивает агенту: пользователь не может открыть localhost или 127.0.0.1. Превью работает через обратный прокси, поэтому давать надо только URL вида /preview/{id}/. Вторая частая поломка — абсолютные пути в статике. Из-за префикса /preview/{id}/ браузер запрашивает /static/app.js от корня домена и получает 404. Скилл требует искать такие пути везде: в src и href, в fetch(), в CSS url(), в строковых литералах JS и в конфигах сборщика вроде publicPath и base.

Ещё скилл прямо запрещает лезть в рабочие каталоги вроде preview/ или output/ через ls и find — это пользовательские данные, а не состояние сервиса. Источник правды только реестр, история и сами инструменты preview_serve и preview_stop. Если меню «RUNNING SERVICES» пустое, хотя порт отвечает, значит фронтенд потерял синхронизацию: пересоздание сервиса заставляет его зарегистрировать вкладку заново.