Vue Test Utils

// error.test.js

/**

 * @jest-environment jsdom

 */

import { shallowMount } from '@vue/test-utils'

import store from '@/store/index';

import router from '@/router';

import Error from '@/layouts/error.vue'

describe('MyComponent', () => {

  it('render without crashing', () => {

    const wrapper = shallowMount(Error, {

      router,

      store,

      propsData: { error: {msg: 'Hello, World!' }}

    })

    expect(wrapper.html()).toContain('內容!') 

  })

})

// error.server.test.js

import { render } from '@vue/server-test-utils'

import store from '@/store/index';

import router from '@/router';

import Error from '@/layouts/error.vue'

 

describe('MyComponent', () => {

  it('render without crashing', async () => {

  const wrapper = await render(Error, {

    router,

    store,

    propsData: { error: {msg: 'Hello, World!' }}

  })

    expect(wrapper.text()).toContain('內容!') 

  })

})

Vuex mocking not working? (不認識dispatch / vuex ...)

https://github.com/vuejs/vue-test-utils/issues/116

How to unit test a typescript Vue Component that uses vuex-class 不認得(Vuex) 
https://stackoverflow.com/questions/59245479/how-to-unit-test-a-typescript-vue-component-that-uses-vuex-class 

不認得 ts ↓

https://vue-test-utils.vuejs.org/zh/installation/#%E9%80%89%E6%8B%A9%E4%B8%80%E4%B8%AA%E6%B5%8B%E8%AF%95%E8%BF%90%E8%A1%8C%E5%99%A8

英文版test: https://livebook.manning.com/book/testing-vue-js-applications/chapter-13/54

中文版test: https://ithelp.ithome.com.tw/articles/10241568

When you write unit tests for server-side rendered components, you should run the tests in a Node environment, not a jsdom environment.

The problem is that Jest runs tests inside a jsdom environment by default, which means DOM properties like document are defined when you run the test. 

You should split server-side tests and client tests into separate files. You can run each test file in only one environment.

test runner:

1.jest

2.mocha

Vue Test Utils 都能够支持。它是与测试运行器(test runner)无关的