Storybook के साथ Testing

Interactions के लिए Play function

The play function आपको अपनी stories के लिए automated interactions लिखने देता है। ये user interactions को simulate कर सकते हैं और component behavior को verify कर सकते हैं।

Play test लिखना

यहाँ play function के साथ user interactions को test करने का एक उदाहरण है।

import { userEvent, within } from '@storybook/testing-library';
import { Button } from './Button';

export default {
  component: Button,
  title: 'Components/Button',
};

export const Clicked = () => <Button>Click me</Button>;
Clicked.play = async ({ canvasElement }) => {
  const canvas = within(canvasElement);
  const button = canvas.getByRole('button');
  await userEvent.click(button);
};

Accessibility testing

Accessibility issues के लिए स्वचालित रूप से stories को scan करने के लिए a11y addon का use करें और WCAG guidelines को follow करें।

Screenshot testing

Changes के across component screenshots को capture और compare करने के लिए Percy या Chromatic जैसे visual testing tools का use करें।