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

33 lines
775 B
Plaintext

```js
// MyComponent.stories.js
import { fireEvent, screen, userEvent } from '@storybook/testing-library';
import MyComponent from './MyComponent.vue';
export default {
component: MyComponent,
//👇 Marking the onButtonClick with this configuration will log the event in the Actions panel
argTypes: { onButtonClick: { action: true } },
};
export const ClickExample = {
play: async () => {
await userEvent.click(screen.getByRole('button'));
},
render: () => ({
components: { MyComponent },
template: '<MyComponent/>',
}),
};
export const FireEventExample = {
play: async () => {
await fireEvent.click(screen.getByTestId('data-testid'));
},
render: () => ({
components: { MyComponent },
template: '<MyComponent/>',
}),
};
```