Storybook — Все статьи и туториалы

4 статей

Storybook утвердился как референсная среда для разработки, документирования и тестирования изолированных UI-компонентов. Для команд, поддерживающих design system, каждая story становится естественной целью визуального тестирования: компонент, отрисованный в точно заданном состоянии, без прикладной зависимости, идеально воспроизводимый. Эта тонкая гранулярность позволяет обнаруживать визуальную регрессию на уровне кнопки или карточки ещё до того, как она распространится на собранную страницу.

Статьи на этой странице рассматривают экосистему Storybook под углом визуального тестирования: интеграция с Chromatic (нативный инструмент команды Storybook), альтернативы вроде Loki, Storyshots или Playwright component testing, управление декораторами и состояниями (hover, focus, dark mode), хорошие практики по приведению story к детерминизму. Также затрагивается повторяющийся вопрос: тестировать ли только компоненты в story или ещё и реальные страницы, которые их собирают? Оба подхода дополняют друг друга, и именно сюда вписывается Delta-QA — на тестирование веб-страниц, отрисованных в реальных условиях, в дополнение к компонентному покрытию, обеспеченному Storybook. Эта страница помогает выстроить согласованную стратегию между двумя уровнями.

Storybook и визуальное тестирование: почему тестирования изолированных компонентов недостаточно
автор Gulben BINGOL

Storybook и визуальное тестирование: почему тестирования изолированных компонентов недостаточно

Storybook стал стандартом для документирования и тестирования UI-компонентов. Но для визуального тестирования изолированных компонентов недостаточно.

Читать далее →
Lost Pixel vs Delta-QA: без кода или Open Source для Storybook?
автор Malloum LAYA

Lost Pixel vs Delta-QA: без кода или Open Source для Storybook?

Lost Pixel (npm, конфигурация) против Delta-QA (no-code, доступен нетехническим профилям). Полное сравнение двух подходов к регрессионному тестированию.

Читать далее →
Chromatic vs Delta-QA: изолированные компоненты или полные страницы?
автор Malloum LAYA

Chromatic vs Delta-QA: изолированные компоненты или полные страницы?

Chromatic (компоненты Storybook) против Delta-QA (целые страницы, регрессия без кода). Компоненты vs страницы, взаимодополняемость, сценарии использования.

Читать далее →
Визуальное тестирование Storybook без Chromatic: no-code
автор Gulben BINGOL

Визуальное тестирование Storybook без Chromatic: no-code

Визуальное тестирование Storybook без Chromatic: сравните Percy, Playwright и Delta-QA. No-code ревью, без оплаты за снапшот, скриншоты — локально.

Читать далее →