Need help with vue-test-utils-next?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

vuejs
347 Stars 107 Forks MIT License 1.1K Commits 43 Opened issues

Description

The next iteration of Vue Test Utils, targeting Vue 3

Services available

!
?

Need anything else?

Contributors list

Vue Test Utils (next)

The next iteration of Vue Test Utils. It targets Vue 3.

Installation and Usage

Get started with the documentation.

Coming from Vue 2 + Vue Test Utils?

Check the migration guide. It's still a work in progress. If you find a problem or something that doesn't work that previously did in Vue Test Utils v1, please open an issue.

Documentation

See the docs.

Development

Get started by running

yarn install
. You can run the tests with
yarn test
. That's it!

Comparison with Vue Test Utils v1 (targeting Vue 2)

This is table for those coming from VTU 1, comparing the two APIs. Some things are still a work in progress.

  • ✅ - implemented
  • ❌ - not yet implemented
  • ⚰️ - will not be implemented (if you have a compelling use case, please open an issue)

Mounting Options

| option | status | notes | | ---------------- | ------ | ----------------------------------------------------------------------------------- | | data | ✅ | | slots | ✅ | | mocks | ✅ | nested in

global
| | propsData | ✅ | now called
props
| | provide | ✅ | nested in
global
| | mixins | ✅ | (new!) nested in
global
| | plugins | ✅ | (new!) nested in
global
| | component | ✅ | (new!) nested in
global
| | directives | ✅ | (new!) nested in
global
| | stubs | ✅ | | attachToDocument | ✅ | renamed
attachTo
. See here | | attrs | ✅ | | scopedSlots | ⚰️ | scopedSlots are merged with
slots
in Vue 3 | | context | ⚰️ | different from Vue 2, does not make sense anymore. | | localVue | ⚰️ | no longer required - Vue 3 there is no global Vue instance to mutate. | | listeners | ⚰️ | no longer exists in Vue 3 | | parentComponent | ⚰️ |

Wrapper API (mount)

| method | status | notes | | -------------- | ------ | ----------------------------------------------------------------------------------------------------------------------------------- | | attributes | ✅ | | classes | ✅ | | exists | ✅ | | find | ✅ | only

querySelector
syntax is supported.
find(Comp)
under discussion here | | emitted | ✅ | | findAll | ✅ | see above.
.vm
is different to Vue 2. We are exploring options. | | get | ✅ | | html | ✅ | | setValue | ✅ | works for select, checkbox, radio button, input, textarea. Returns
nextTick
. | | text | ✅ | | trigger | ✅ | returns
nextTick
. You can do
await wrapper.find('button').trigger('click')
| | setProps | ✅ | | props | ✅ | | setData | ✅ | | destroy | ✅ | renamed to
unmount
to match Vue 3 lifecycle hook name. | | props | ✅ | | isVisible | ✅ | | contains | ⚰️ | use
find
| | emittedByOrder | ⚰️ | use
emitted
| | setSelected | ⚰️ | now part of
setValue
| | setChecked | ⚰️ | now part of
setValue
| | is | ⚰️ | | isEmpty | ⚰️ | use matchers such as this | | isVueInstance | ⚰️ | | name | ⚰️ | | setMethods | ⚰️ |

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.