The Official Unit Testing Utility Library for Vue.js Is Now Available

Vue.js now has an official unit testing library for testing Vue applications. It provides methods for unit testing your components.

A 1.0 beta version shipped Monday, as well as an official guide to help you get started with standard tips, using test runners, and testing components which use Vuex (centralized state management for Vue).

Here’s an example of unit testing a Vue component with the utils library:

import { mount } from 'vue-test-utils'
import Counter from './counter'

describe('Counter', () => {
  // Now mount the component, and you have the wrapper.
  const wrapper = mount(Counter)

  it('renders the correct markup', () => {

  // It's also easy to check for the existence of elements.
  it('has a button', () => {

According to the guide, here’s an overview of how vie-test-utils

vue-test-utils tests Vue components by mounting them in isolation, mocking the necessary inputs (props, injections and user events) and asserting the outputs (render result, emitted custom events).

Mounted components are returned inside a Wrapper, which exposes many convenience methods for manipulating, traversing and querying the underlying Vue component instance.

Taking the above example, you could interact with the counter and make assertions with the following as outlined in the documentation

it('button click should increment the count', () => {
  const button = wrapper.find('button')

Check out the official guide
and starter project to get familiar with testing Vue applications with the official test utils library.

Laravel News稿源:Laravel News (源链) | 关于 | 阅读提示

本站遵循[CC BY-NC-SA 4.0]。如您有版权、意见投诉等问题,请通过eMail联系我们处理。
酷辣虫 » 前端开发 » The Official Unit Testing Utility Library for Vue.js Is Now Available

喜欢 (0)or分享给?

专业 x 专注 x 聚合 x 分享 CC BY-NC-SA 4.0

使用声明 | 英豪名录