storybook/docs/snippets/react/my-component-play-function-with-selectevent.js.mdx
2021-10-14 23:00:26 +01:00

32 lines
770 B
Plaintext

```js
// MyComponent.js | MyComponent.jsx | MyComponent.ts | MyComponent.tsx
import { userEvent, screen } from '@storybook/testing-library';
import { MyComponent } from './MyComponent';
export default {
component: MyComponent,
};
// Custom function to emulate a pause
function sleep(ms) {
return new Promise((resolve) => setTimeout(resolve, ms));
}
// Queries the element by it's role and fires the event
export const ExampleChangeEvent = {
play: async () => {
const select = screen.getByRole('listbox');
await userEvent.selectOptions(select, ['One Item']);
await sleep(2000);
await userEvent.selectOptions(select, ['Another Item']);
await sleep(2000);
await userEvent.selectOptions(select, ['Yet another item']);
},
};
```