lizard
Simple and complete Vue.js testing utilities that encourage good testing practices.
Vue Testing Library is a lightweight adapter built on top of DOM Testing Library and @vue/test-utils.
Build Status Coverage Status GitHub version npm version
MIT License Join the community on Spectrum
This module is distributed via npm and should be installed as one of your
project's devDependencies:
npm install --save-dev @testing-library/vue
This library has peerDependencies listings for Vue and
vue-template-compiler.
You may also be interested in installing jest-dom so you can use
the custom Jest matchers.
<!-- TestComponent.vue --> <template> <div> <p>Times clicked: {{ count }}</p> <button @click="increment">increment</button> </div> </template> <script> export default { data: () => ({ count: 0, }), methods: { increment() { this.count++ }, }, } </script>
// TestComponent.spec.js import {render, fireEvent} from '@testing-library/vue' import TestComponent from './TestComponent.vue' test('increments value on click', async () => { // The render method returns a collection of utilities to query the component. const {getByText} = render(TestComponent) // getByText returns the first matching node for the provided text, and // throws an error if no elements match or if more than one match is found. getByText('Times clicked: 0') // `button` is the actual DOM element. const button = getByText('increment') // Dispatch a couple of native click events. await fireEvent.click(button) await fireEvent.click(button) getByText('Times clicked: 2') })
You'll find examples of testing with different situations and popular libraries in the test directory.
Some included are:
Feel free to contribute with more examples!
The TypeScript type definitions are in the DefinitelyTyped repo and bundled with Vue Testing Library.
If you want to lint test files that use Vue Testing Library, you can use the official plugin: eslint-plugin-testing-library.
dfcook afontcu eunjae-lee tim-maguire samdelacruz ankitsinghaniyaz lindgr3n kentcdodds brennj makeupsomething mb200 Oluwasetemi cimbul alexkrolick edufarre SandraDml arnaublanche NoelDeMartin chiptus