Демо

В репозитории одна модель effector (demo/shared), отрисованная во всех поддерживаемых конфигурациях. Модель собрана babel-плагином effector, поэтому sid везде одинаковые: трейс, записанный в React, воспроизводится во Vue, Solid или Next.js.

Живое демо

React-демо работает прямо на этом сайте: откройте живое демо с установленным расширением, затем DevTools → deffector. Его API имитируется на странице, поэтому ничего не уходит из браузера.

Запуск

npm install                 # из корня репозитория
npm run build               # агент, demo/shared, расширение, standalone

Загрузите расширение из packages/extension/dist (см. Установка); после пересборки нажмите ↻ на его карточке в chrome://extensions.

Демо	Команда	Адрес	Что проверить
React + Vite	npm run dev:react	http://localhost:5171	базовый сценарий, DeffectorProvider; ?standalone — подключиться и к отдельному приложению
Vue + Vite	npm run dev:vue	http://localhost:5172	withDeffector, пересоздание поддерева при переходе
Solid + Vite	npm run dev:solid	http://localhost:5173	DeffectorProvider для effector-solid
Глобальный режим	npm run dev:global	http://localhost:5174	без fork(): переходы на месте, предупреждение в баннере и в Health
Без плагина	npm run dev:no-plugin	http://localhost:5175	нет sid: Health предупреждает, имена вида $store@index.js:97, трейс сопоставляется по именам
Node SSR	npm run standalone + npm run dev:node-ssr	http://localhost:5176, панель http://localhost:8686	scope на каждый запрос в отдельном приложении
Next.js	npm run dev:next (+ npm run standalone для сервера)	http://localhost:5177	клиент — в расширении, сервер — в отдельном приложении
Лаборатория	npm run dev:lab	http://localhost:5178	большие графы (1–20 тыс. юнитов), бесконечный цикл, устаревшее чтение, исключение в .map, утечка юнитов, таймер вне scope, шумный polling; ?hydrate — значения с сервера для неизвестных sid; ?noagent — та же страница без агента

Что нажимать

• Counter — простейший случай: Log, переход назад (двойной клик по строке, Ctrl+[ / Ctrl+], Esc — в настоящее).
• Sign up — валидация, sample с filter (кнопка Create account при невалидной форме → «filter = false»), эффект с задержкой, подсказки email (гонка ответов видна во вкладке Effects). Email со словом taken — ошибка сервера.
• Greet later (no scopeBind) — вызов события из setTimeout без scopeBind: красная строка «вне scope», приветствие в UI не появляется. Кнопка рядом — исправленный вариант.
• Quick fill (double update) — combine, объявленный раньше sample, пересчитывается дважды: бейдж 2× и объяснение во вкладке Почему.
• Name = “crash” — исключение в .map: ошибка в логе и в Health.

Что проверить руками

• Блокировка прошлого. Двойной клик по строке лога: страница накрыта, клик ничего не меняет, Esc на странице возвращает в настоящее. Разрешить клики в баннере панели — изменения идут в ветку.
• Сохранённые фильтры (воронка в панели инструментов): сохраните regex, включите Подсветка — у строк появится цветная точка; Не записывать — подходящие транзакции не хранятся, а переходы назад всё равно показывают верное состояние.
• Снимок (Stores → Снимок →): вставьте { "sid": значение }, посмотрите diff, примените.
• Заметка и ссылка на транзакцию (кнопки в инспекторе); при экспорте выбранный шаг попадает в meta.focus, а импорт откроет трейс на нём.
• Последовательность — вкладка в инспекторе: юниты как линии жизни, операторы как стрелки, ✕ там, где filter не пропустил.
• Подмена эффектов (Effects → Подмена эффектов): pending, значение, ошибка, задержка, свой хендлер.
• Graph: путь «От → До», группы по файлу / фабрике / домену / модели (двойной клик раскрывает), подписи операторов на рёбрах.
• Ctrl+K — палитра команд. Клик по файлу открывает Sources на нужной строке.
• Лаборатория → Health: аварийная остановка цикла, «прочитал $qty до обновления», «создан N раз», «вне scope», цикл только через события, Проверить производные сторы.
• Firefox: npm run build, затем about:debugging → Этот Firefox → Загрузить временное дополнение → packages/extension/dist-firefox/manifest.json.

Трейс между демо

Traces → Сформировать JSON → Скачать .json. Во втором окне (или в другом демо) — Traces → вставить → Проверить совместимость → Воспроизвести в новом scope. Пароль в трейсе замаскирован с сохранением длины.

Все демо прогоняются сквозными тестами: npm run e2e из корня.