vuejs/test-utils
@vue/test-utils
Version:
2.4.6 (May 2024)
Deps:
js-beautify@^1.14.9, vue-component-type-helpers@^2.0.0
Tags:
latest: 2.4.6 (May 2024), 2.0.0-alpha.0: 2.0.0-alpha.0 (Apr 2020), 2.0.0-alpha.1: 2.0.0-alpha.1 (Apr 2020), 2.0.0-alpha.2: 2.0.0-alpha.2 (Apr 2020), 2.0.0-alpha.3: 2.0.0-alpha.3 (Apr 2020), 2.0.0-alpha.4: 2.0.0-alpha.4 (May 2020), next: 2.4.0-alpha.2 (Jun 2023), 2.0.0-alpha.8: 2.0.0-alpha.8 (Jul 2020), 2.0.0-beta.1: 2.0.0-beta.1 (Aug 2020), 2.0.0-beta.2: 2.0.0-beta.2 (Aug 2020), 2.0.0-beta.3: 2.0.0-beta.3 (Aug 2020), 2.0.0-beta.4: 2.0.0-beta.4 (Sep 2020), 2.0.0-beta.5: 2.0.0-beta.5 (Sep 2020), 2.0.0-beta.7: 2.0.0-beta.7 (Oct 2020), 2.0.0-beta.8: 2.0.0-beta.8 (Nov 2020), 2.0.0-beta.9: 2.0.0-beta.9 (Nov 2020), 2.0.0-beta.10: 2.0.0-beta.10 (Nov 2020), 2.0.0-beta.12: 2.0.0-beta.12 (Dec 2020), 2.0.0-beta.13: 2.0.0-beta.13 (Dec 2020), 2.0.0-rc.0: 2.0.0-rc.0 (Jan 2021), 2.0.0-rc.1: 2.0.0-rc.1 (Feb 2021), 2.0.0-rc.2: 2.0.0-rc.2 (Feb 2021), 2.0.0-rc.3: 2.0.0-rc.3 (Mar 2021), 2.0.0-rc.4: 2.0.0-rc.4 (Mar 2021), 2.0.0-rc.5: 2.0.0-rc.5 (Apr 2021), 2.0.0-rc.6: 2.0.0-rc.6 (Apr 2021), 2.0.0-rc.7: 2.0.0-rc.7 (Jun 2021), 2.0.0-rc.8: 2.0.0-rc.8 (Jun 2021), 2.0.0-rc.9: 2.0.0-rc.9 (Jun 2021), 2.0.0-rc.10: 2.0.0-rc.10 (Jul 2021), 2.0.0-rc.11: 2.0.0-rc.11 (Jul 2021), 2.0.0-rc.12: 2.0.0-rc.12 (Jul 2021), 2.0.0-rc.14: 2.0.0-rc.14 (Sep 2021), 2.0.0-rc.16: 2.0.0-rc.16 (Oct 2021), 2.0.0-rc.18: 2.0.0-rc.18 (Dec 2021), legacy: 1.3.6 (Jun 2023), 2.4.0-alpha.0: 2.4.0-alpha.0 (Apr 2023), v2.4.0-alpha.2: 2.4.0-alpha.2 (Jun 2023)
References:
Docs
— API reference, guides
API Changes
This section documents version-specific API changes — prioritize recent major/minor releases.
BREAKING:
propsData
— v2 renamed to
props
for consistency with component definitions
source
BREAKING:
createLocalVue
— removed in v2, use the
global
mounting option to install plugins, mixins, or directives
source
BREAKING:
mocks
and
stubs
— moved into the
global
mounting option in v2 as they apply to all components
source
BREAKING:
destroy()
— renamed to
unmount()
in v2 to match Vue 3 lifecycle naming
source
BREAKING:
findAll().at()
— removed in v2;
findAll()
now returns a standard array of wrappers
source
BREAKING:
createWrapper()
— removed in v2, use the
new DOMWrapper()
constructor for non-component elements
source
BREAKING:
shallowMount
— v2 no longer renders default slot content for stubbed components by default
source
BREAKING:
find()
— now only supports
querySelector
syntax; use
findComponent()
to locate Vue components
source
BREAKING:
setSelected
and
setChecked
— removed in v2, functionality merged into
setValue()
source
BREAKING:
attachToDocument
— renamed to
attachTo
in v2
source
BREAKING:
emittedByOrder
— removed in v2, use
emitted()
instead
source
NEW:
renderToString()
— added in v2.3.0 to support SSR testing
source
NEW:
enableAutoUnmount()
/
disableAutoUnmount()
— replaces
enableAutoDestroy
in v2
source
DEPRECATED:
scopedSlots
— removed in v2 and merged into the
slots
mounting option
source
Also changed:
setValue()
and
trigger()
return
nextTick
·
slots
scope exposed as
params
in string templates ·
is
,
isEmpty
,
isVueInstance
,
name
,
setMethods
, and
contains
removed
Best Practices
Always
await
methods that return
nextTick
(
trigger
,
setValue
,
setProps
,
setData
) to ensure DOM updates are processed before running assertions
source
// Preferred
await
wrapper
.
find
(
'button'
)
.
trigger
(
'click'
)
expect
(
wrapper
.
text
(
)
)
.
toContain
(
'Count: 1'
)
// Avoid — assertion runs before DOM update
wrapper
.
find
(
'button'
)
.
trigger
(
'click'
)
expect
(
wrapper
.
text
(
)
)
.
toContain
(
'Count: 1'
)
Prefer
get()
and
getComponent()
over
find()
and
findComponent()
when you expect the element to exist — they throw immediately if not found, providing clearer test failures
source
Use
flushPromises()
to resolve non-Vue asynchronous operations such as mocked API calls (axios) or external promise-based logic that Vue doesn't track
source
Enable
enableAutoUnmount(afterEach)
in your test setup to automatically clean up wrappers after every test, preventing state pollution and memory leaks
source
import
{
enableAutoUnmount
}
from
'@vue/test-utils'
import
{
afterEach
}
from
'vitest'
enableAutoUnmount
(
afterEach
)
Wrap components with
async setup()
in a
vue-test-utils-skilld
安装
npx skills add https://github.com/harlan-zw/vue-ecosystem-skills --skill vue-test-utils-skilld