testing-library / vue-testing-library

🦎 Simple and complete Vue.js testing utilities that encourage good testing practices.
http://testing-library.com/vue
MIT License
1.09k stars 109 forks source link

Is this a valid test? #293

Closed richardkshergold closed 1 year ago

richardkshergold commented 1 year ago

I'm pretty new to Unit Testing and I'm not sure if I'm trying to test something which the Vue Testing Library is not intended for?

I have a parent component that contains a repeated list of child components, each child component has some custom events which - when fired - call some code in the parent e.g

<script>
    async function processEvent() {
        // do something
    }
 </script>

 <template>
            <child-component :data-testid="occurence" v-for="occurence in getOccurences" 
            @my-event="processEvent">
            </child-component>
 </template>

Does the Vue Testing library allow me to fire the "my-event" event and check that processEvent is called ? I have been unable to get this to work.

I can get the first child component by doing:

const firstSavedCard:any = screen.findByTestId('1');

but how do I then fire my custom event?

afontcu commented 1 year ago

Hi! Vue Testing Library focus on writing tests that look similar to how users interact with your component. With that in mind, I would suggest performing the same operation that a user would do that would trigger my-event (being that clicking, scrolling, typing…).

If you have more questions, please head to Testing Library's Discord channel, a more appropriate place to get answers :)