/
MyForm1.spec.ts
31 lines (25 loc) · 1.4 KB
/
MyForm1.spec.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
import { shallowMount } from '@vue/test-utils'
import MyForm1 from '@/components/MyForm1.vue'
it('フォーム入力', async () => {
const wrapper = shallowMount(MyForm1)
const elemComment = wrapper.find('[data-testid="input-comment"]')
const elemSendA = wrapper.find('[data-testid="button-send-a"]')
const elemSendB = wrapper.find('[data-testid="button-send-b"]')
const elemMessage = () => wrapper.find('[data-testid="message"]')
// 最初はメッセージが空であること
expect(elemMessage().exists()).toBe(false)
// コメントを入力せずにボタンを押すとエラーメッセージが表示されること
await elemSendA.trigger('click')
expect(elemMessage().text()).toBe('コメントがありません。')
await elemSendB.trigger('click')
expect(elemMessage().text()).toBe('コメントがありません。')
// コメントを入力してボタンを押すと送信メッセージが表示されること
await elemComment.setValue('こんにちは')
await elemSendA.trigger('click')
expect(elemMessage().text()).toBe('Aさんに「こんにちは」を送りました。')
await elemSendB.trigger('click')
expect(elemMessage().text()).toBe('Bさんに「こんにちは」を送りました。')
// コメントを変更するとメッセージが消えること
await elemComment.setValue('こんばんは')
expect(elemMessage().exists()).toBe(false)
})