ライブラリをインストール
1
2
3
4
5
6
7
8
9
|
npm install --save-dev jest
npm install --save-dev babel-jest
npm install --save-dev babel-preset-env
npm install --save-dev babel-core@bridge
npm install --save-dev @vue/test-utils@next
npm install --save-dev vue-jest@next
|
test準備
プロジェクトルートディレクトリにjest.config.jsを作成する
※作成しない場合、以下のエラーになった。
Consider using the "jsdom" test environment.
1
2
3
| module.exports = {
testEnvironment: "jsdom"
};
|
package.jsonに以下を追加する
※npm testでテスト実行できるようにするため
1
2
3
| "scripts": {
"test": "jest",
},
|
testコード作成
プロジェクトルートディレクトリに__tests__/unit/index.jsを作成する
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
| import { mount } from "@vue/test-utils";
const MessageComponent = {
template: "<p>{{ msg }}</p>",
props: ["msg"]
};
test("displays message", () => {
const wrapper = mount(MessageComponent, {
props: {
msg: "Hello world"
}
});
expect(wrapper.text()).toContain("Hello world");
});
|
ここまで完了すれば、npm testでテスト実行できる。
と、ここまでは良いのだが、Vue.jsのコードに接続するコードを書くと以下のエラーになった
解決できず、諦めた。。
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){<template>