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

36 lines
814 B
Plaintext

```js
// MyComponent.stories.js
import { fireEvent, screen } from '@storybook/testing-library';
import MyComponent from './MyComponent.vue';
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']);
},
render: () => ({
components: { MyComponent },
template: '<MyComponent/>',
}),
};
```