Storybook is a frontend workshop for building UI components in isolation. Stories are written in Component Story Format 3 (CSF3), which uses object syntax with args for type-safe component documentation and testing.
When to use: Component documentation with live examples, interaction testing with play functions, visual regression testing, accessibility validation, design system maintenance, isolated component development.
| Basic story | export const Default: Story = { args } | Use args for simple single components | | Complex story | export const Example: Story = { render } | Use render for multi-component layouts | | Meta configuration | const meta = { component, args } satisfies Meta | Define defaults and argTypes |
Пишет и поддерживает истории из сборников рассказов и интерактивные тесты, используя формат CSF3. Охватывает истории компонентов, игровые функции, тестирование визуальной регрессии с помощью Chromatic и тестирование доступности. Используйте при создании документации компонентов, написании тестов взаимодействия, отладке сбоев тестов, настройке визуальных снимков или обновлении структуры истории. Используйте для CSF3, функций воспроизведения, userEvent, запросов библиотеки тестирования, хроматической конфигурации, автодокументов, MDX. Источник: oakoss/agent-skills.