```ts // MyComponent.stories.ts // import type { Meta, Story } from '@storybook/vue3'; for Vue 3 import type { Meta, Story } from '@storybook/vue'; import { fireEvent, screen, userEvent } from '@storybook/testing-library'; import MyComponent from './MyComponent.vue'; export default { /* 👇 The title prop is optional. * See https://storybook.js.org/docs/7.0/vue/configure/overview#configure-story-loading * to learn how to generate automatic titles */ title: 'ClickExamples', component: MyComponent, } as Meta; /* *👇 Render functions are a framework specific feature to allow you control on how the component renders. * See https://storybook.js.org/docs/7.0/vue/api/csf * to learn how to use render functions. */ export const ClickExample: Story = { render: () => ({ components: { MyComponent }, template: '', }), play: async () => { // See https://storybook.js.org/docs/7.0/vue/essentials/actions#automatically-matching-args to learn how to setup logging in the Actions panel await userEvent.click(screen.getByRole('button')); }, }; export const FireEventExample: Story = { render: () => ({ components: { MyComponent }, template: '', }), play: async () => { // See https://storybook.js.org/docs/7.0/vue/essentials/actions#automatically-matching-args to learn how to setup logging in the Actions panel await fireEvent.click(screen.getByTestId('data-testid')); }, }; ```