Практические разборы l3_builders

Почему локальный AI-tool не собирается: lockfile → headless PASS

Практический выпуск CodeVibers: воспроизводим рассинхрон package-lock, фиксируем Node/npm, пишем preflight и доказываем запуск UI настоящим headless Chromium-тестом.

Видео по теме

Открыть видео на YouTube

Практический выпуск CodeVibers: воспроизводим рассинхрон package-lock, фиксируем Node/npm, пишем preflight и доказываем запуск UI настоящим headless Chromium-тестом.

Таймкоды

  • 00:00 Что ломаем и собираем
  • 00:55 Фиксируем toolchain
  • 01:40 Пишем preflight
  • 03:00 Fail и clean run
  • 04:20 Тесты и Chromium
  • 05:35 Готовый CI порядок

Shorts

Источники выпуска

Исходники проекта из выпуска

Это тот же воспроизводимый проект, который собирается и тестируется в видео.

  • package.json — Pinned Node/npm/Playwright contract.
  • package-lock.json — Committed lockfile regenerated during setup.
  • scripts/preflight.mjs — Lockfile and runtime validator.
  • scripts/smoke.mjs — Real Playwright browser smoke.
  • scripts/run-demo.mjs — Expected fail then clean pass orchestration.
  • server.mjs — Local application and health endpoint.
  • public/index.html — Visible UI tested by Chromium.
  • tests/preflight.test.mjs — Positive and edge regression tests.
  • fixtures/bad-package.json — Intentional package mismatch.
  • fixtures/bad-package-lock.json — Lock side of mismatch fixture.
  • scripts/show-demo.mjs — Isolated visible Chromium runner for setup, CI and artifact proof recordings.

Команды запуска и проверки

npm run demo
npm test

Скачать проект ZIP

Практический материал из выпуска

Артефакт: Runnable Node toolchain preflight plus Playwright headless smoke project.

Что должно получиться: Project files, npm commands, bad fixture, reports and screenshot.

Видимый результат: LOCK_MISMATCH is blocked; synchronized project reaches HEADLESS PASS in Chromium.

Вход для демо: Bad package/lock pair and the corrected local project.

Выход демо: reports/bad.json, reports/preflight.json, reports/smoke.json and reports/smoke.png.

Проверка результата: Expected failure exit 2, clean preflight exit 0, four unit tests pass and headless browser finds HEADLESS PASS.

Как собрать

  1. install pinned dependencies
  2. run bad preflight
  3. inspect validator code
  4. run clean project
  5. launch Chromium smoke
  6. open proof screenshot
  7. pin runtime
  8. write preflight
  9. reproduce lock mismatch
  10. launch server

Чеклист перед пилотом

  • LOCK_MISMATCH exists in bad report
  • preflight status passed
  • tests pass
  • smoke screenshot exists
  • bad fixture exits 2 with LOCK_MISMATCH
  • clean preflight passes
  • headless Chromium writes smoke.png
  • all regression tests pass

Примеры команд, настроек или правил

npm ci --ignore-scripts
node scripts/preflight.mjs
npm run demo
npm test
package.json
package-lock.json
scripts/preflight.mjs
scripts/smoke.mjs
scripts/run-demo.mjs
server.mjs
public/index.html
tests/preflight.test.mjs

Требования и рекомендации

Требования

  • закоммиченный package-lock
  • поддерживаемый Node/npm
  • установленный Chromium
  • отдельный health endpoint

Рекомендации

  • использовать npm ci
  • фиксировать packageManager и engines
  • запускать headless smoke после preflight

Суть темы

Практический выпуск CodeVibers: воспроизводим рассинхрон package-lock, фиксируем Node/npm, пишем preflight и доказываем запуск UI настоящим headless Chromium-тестом.

Что важно забрать

  • Добавить npm ci, node scripts/preflight.mjs и npm run smoke перед сборкой продукта.
  • Зритель получит готовый preflight и headless smoke harness для локального AI/web tool.
  • Не перечисляем причины сборки: воспроизводим lock mismatch и подтверждаем исправление настоящим браузером.
  • Заменить ручное открытие UI на детерминированный fail/fix/pass контракт.

Как применять на практике

Используйте материал как отправную точку: сформулируйте задачу, ограничьте область применения, выберите метрику качества и проверьте результат на небольшом сценарии до внедрения в production.

Практические шаги

  1. install pinned dependencies
  2. run bad preflight
  3. inspect validator code
  4. run clean project
  5. launch Chromium smoke
  6. open proof screenshot
  7. pin runtime
  8. write preflight

Рекомендации

  • использовать npm ci
  • фиксировать packageManager и engines
  • запускать headless smoke после preflight

Требования и ограничения

  • закоммиченный package-lock
  • поддерживаемый Node/npm
  • установленный Chromium
  • отдельный health endpoint

Примеры

  • playwright 1.60 в package.json против 1.61.1 в lock
  • Node 20 против диапазона >=22 <27

Антипримеры

  • npm install в CI молча переписывает lockfile и скрывает причину

Как проверить готовность

  • bad fixture exit code 2
  • clean preflight exit code 0
  • HEADLESS PASS и reports/smoke.png

Навигация по выпуску

  • 00:00 Что ломаем и собираем
  • 00:55 Фиксируем toolchain
  • 01:40 Пишем preflight
  • 03:00 Fail и clean run
  • 04:20 Тесты и Chromium
  • 05:35 Готовый CI порядок