Jest

jsdomを利用して ブラウザに近い動きのテストができる。

mock

spy

assert

以下の形になった。

code: jest.config.js

module.exports = {

moduleFileExtensions: [

"js",

"json",

"vue"

],

transform: {

".*\\.(vue)$": "vue-jest",

"^.+\\.js$": "<rootDir>/node_modules/babel-jest"

},

moduleNameMapper: {

"^@/(.*)$": "<rootDir>/src/$1"

}

}

code: setup.js

import Vue from 'vue'

import Vuetify from 'vuetify'

Vue.use(Vuetify)

setupFilesを、testファイルとまとめていれると、これもテストだと解釈されて testケースがないと怒られるので、ignoreする。

で、とりあえず、vue-router, vuexをsetupしつつ、vue instanceができてるかどうかだけ

これで、Vuesに適当な値をいれて始める。

code: App.spec.js

import { mount, createLocalVue } from '@vue/test-utils';

import Component from '@/App.vue'

import VueRouter from 'vue-router'

import Vuex from "vuex"

import Vuetify from 'vuetify'

const localVue = createLocalVue()

localVue.use(VueRouter)

localVue.use(Vuex)

let wrapper

let store

let actions

let mutations

let state

let getters

let vuetify

beforeEach(() => {

vuetify = new Vuetify()

actions = {}

mutations = {}

state = {

entries: {

}

}

getters = {

entries(state){return state.entries}

}

store = new Vuex.Store({

actions, mutations, state, getters

})

wrapper = mount(Component, {

store,

localVue,

vuetify,

})

})

afterEach(() => {

wrapper.destroy();

})

describe('Testing App component', () => {

it('is a Vue instance', () => {

expect(wrapper.isVueInstance).toBeTruthy()

})

})