vue.jsのバージョン3にテスト(unit test)を追加する方法を書きます！
プロジェクト作成後に途中からテスト(unit test)を追加する方法について書いていきます。
vue.jsのバージョン3にテスト(unit test)を追加する
以下のコマンドで追加できます！これでvue3でテスト実行できるようになります。
vue add unit-jestテストコードを書いてテスト実行してみる
テストコード
tests/unitフォルダ配下に「HelloWorld.spec.js」というファイル名でファイルを作成し、ファイルの中身は以下のコードにします
import { shallowMount } from '@vue/test-utils'
// テスト対象コード
const MessageComponent = {
template: '<p>{{ msg }}</p>',
props: ['msg']
}
// テストコード
test('displays message', () => {
const wrapper = shallowMount(MessageComponent, {
props: {
msg: 'Hello world'
}
})
// Assert the rendered text of the component
expect(wrapper.text()).toContain('Hello world')
})
テスト実行
以下のコマンドで実行できます
npm run test:unitまとめ
以下のコマンド実行で簡単にvue3でテスト実行できるようになりました！
vue add unit-jest