Skip to content

Commit f4d509a

Browse files
authored
fix(b-form-tags): unit test (#5586)
1 parent feca961 commit f4d509a

File tree

1 file changed

+28
-31
lines changed

1 file changed

+28
-31
lines changed

src/components/form-tags/form-tags.spec.js

Lines changed: 28 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,10 @@ import { createContainer, waitNT, waitRAF } from '../../../tests/utils'
33
import { BFormTags } from './form-tags'
44

55
describe('form-tags', () => {
6-
it('has div as root element', async () => {
6+
it('has expected default structure', async () => {
77
const wrapper = mount(BFormTags)
8-
expect(wrapper.element.tagName).toBe('DIV')
98

9+
expect(wrapper.element.tagName).toBe('DIV')
1010
expect(wrapper.classes()).toContain('b-form-tags')
1111
expect(wrapper.classes()).toContain('form-control')
1212
expect(wrapper.attributes('role')).toBe('group')
@@ -21,6 +21,7 @@ describe('form-tags', () => {
2121
value: ['apple', 'orange']
2222
}
2323
})
24+
2425
expect(wrapper.element.tagName).toBe('DIV')
2526

2627
const $tags = wrapper.findAll('.b-form-tag')
@@ -49,12 +50,10 @@ describe('form-tags', () => {
4950
value: ['apple', 'orange']
5051
}
5152
})
52-
expect(wrapper.element.tagName).toBe('DIV')
5353

54-
await wrapper.setProps({
55-
value: ['pear']
56-
})
54+
expect(wrapper.element.tagName).toBe('DIV')
5755

56+
await wrapper.setProps({ value: ['pear'] })
5857
expect(wrapper.vm.tags).toEqual(['pear'])
5958

6059
wrapper.destroy()
@@ -72,13 +71,14 @@ describe('form-tags', () => {
7271
}
7372
}
7473
})
75-
expect(wrapper.element.tagName).toBe('DIV')
74+
7675
await waitNT(wrapper.vm)
7776
await waitRAF()
7877

78+
expect(wrapper.element.tagName).toBe('DIV')
79+
7980
expect(scope).toBeDefined()
8081
expect(typeof scope).toBe('object')
81-
8282
expect(Array.isArray(scope.tags)).toBe(true)
8383
expect(scope.tags).toEqual(['apple', 'orange'])
8484
expect(typeof scope.addTag).toBe('function')
@@ -104,11 +104,11 @@ describe('form-tags', () => {
104104
name: 'foo'
105105
}
106106
})
107+
107108
expect(wrapper.element.tagName).toBe('DIV')
108109

109110
const $hidden = wrapper.findAll('input[type=hidden]')
110111
expect($hidden.length).toBe(2)
111-
112112
expect($hidden.at(0).attributes('value')).toEqual('apple')
113113
expect($hidden.at(0).attributes('name')).toEqual('foo')
114114
expect($hidden.at(1).attributes('value')).toEqual('orange')
@@ -123,13 +123,12 @@ describe('form-tags', () => {
123123
value: ['apple', 'orange']
124124
}
125125
})
126-
expect(wrapper.element.tagName).toBe('DIV')
127126

127+
expect(wrapper.element.tagName).toBe('DIV')
128128
expect(wrapper.vm.tags).toEqual(['apple', 'orange'])
129129
expect(wrapper.vm.newTag).toEqual('')
130130

131131
const $input = wrapper.find('input')
132-
133132
expect($input.exists()).toBe(true)
134133
expect($input.element.value).toBe('')
135134
expect($input.element.type).toBe('text')
@@ -164,14 +163,13 @@ describe('form-tags', () => {
164163
value: ['apple', 'orange', 'pear', 'peach']
165164
}
166165
})
167-
expect(wrapper.element.tagName).toBe('DIV')
168166

167+
expect(wrapper.element.tagName).toBe('DIV')
169168
expect(wrapper.vm.tags).toEqual(['apple', 'orange', 'pear', 'peach'])
170169
expect(wrapper.vm.newTag).toEqual('')
171170

172171
let $tags = wrapper.findAll('.badge')
173172
expect($tags.length).toBe(4)
174-
175173
expect($tags.at(1).attributes('title')).toEqual('orange')
176174

177175
const $btn = $tags.at(1).find('button')
@@ -194,13 +192,12 @@ describe('form-tags', () => {
194192
value: ['apple', 'orange']
195193
}
196194
})
197-
expect(wrapper.element.tagName).toBe('DIV')
198195

196+
expect(wrapper.element.tagName).toBe('DIV')
199197
expect(wrapper.vm.tags).toEqual(['apple', 'orange'])
200198
expect(wrapper.vm.newTag).toEqual('')
201199

202200
const $input = wrapper.find('input')
203-
204201
expect($input.exists()).toBe(true)
205202
expect($input.element.value).toBe('')
206203

@@ -234,13 +231,12 @@ describe('form-tags', () => {
234231
value: ['one', 'two']
235232
}
236233
})
237-
expect(wrapper.element.tagName).toBe('DIV')
238234

235+
expect(wrapper.element.tagName).toBe('DIV')
239236
expect(wrapper.vm.tags).toEqual(['one', 'two'])
240237
expect(wrapper.vm.newTag).toEqual('')
241238

242239
const $input = wrapper.find('input')
243-
244240
expect($input.exists()).toBe(true)
245241
expect($input.element.value).toBe('')
246242

@@ -295,8 +291,8 @@ describe('form-tags', () => {
295291
value: ['one', 'two']
296292
}
297293
})
298-
expect(wrapper.element.tagName).toBe('DIV')
299294

295+
expect(wrapper.element.tagName).toBe('DIV')
300296
expect(wrapper.vm.tags).toEqual(['one', 'two'])
301297
expect(wrapper.vm.newTag).toEqual('')
302298
expect(wrapper.vm.duplicateTags).toEqual([])
@@ -306,7 +302,6 @@ describe('form-tags', () => {
306302
expect(wrapper.find('.form-text').exists()).toBe(false)
307303

308304
const $input = wrapper.find('input')
309-
310305
expect($input.exists()).toBe(true)
311306
expect($input.element.value).toBe('')
312307

@@ -465,16 +460,16 @@ describe('form-tags', () => {
465460
value: ['apple', 'orange']
466461
}
467462
})
468-
expect(wrapper.element.tagName).toBe('DIV')
469463

464+
expect(wrapper.element.tagName).toBe('DIV')
470465
expect(wrapper.vm.tags).toEqual(['apple', 'orange'])
471466
expect(wrapper.vm.newTag).toEqual('')
472467

473468
const $input = wrapper.find('input')
474-
const $button = wrapper.find('button.b-form-tags-button')
475-
476469
expect($input.exists()).toBe(true)
477470
expect($input.element.value).toBe('')
471+
472+
const $button = wrapper.find('button.b-form-tags-button')
478473
expect($button.exists()).toBe(true)
479474
expect($button.classes()).toContain('invisible')
480475

@@ -499,20 +494,18 @@ describe('form-tags', () => {
499494
value: ['apple', 'orange']
500495
}
501496
})
502-
expect(wrapper.element.tagName).toBe('DIV')
497+
503498
await waitNT(wrapper.vm)
504499
await waitRAF()
505500

501+
expect(wrapper.element.tagName).toBe('DIV')
506502
expect(wrapper.vm.tags).toEqual(['apple', 'orange'])
507503
expect(wrapper.vm.newTag).toEqual('')
508-
509504
expect(wrapper.classes()).not.toContain('focus')
510505

511506
const $input = wrapper.find('input')
512-
513507
expect($input.exists()).toBe(true)
514508
expect($input.element.value).toBe('')
515-
516509
expect(document.activeElement).not.toBe($input.element)
517510

518511
await wrapper.trigger('click')
@@ -552,22 +545,26 @@ describe('form-tags', () => {
552545
value: ['apple', 'orange']
553546
}
554547
})
555-
expect(wrapper.element.tagName).toBe('DIV')
548+
556549
await waitNT(wrapper.vm)
557550
await waitRAF()
558551

552+
expect(wrapper.element.tagName).toBe('DIV')
559553
expect(wrapper.vm.tags).toEqual(['apple', 'orange'])
560554
expect(wrapper.vm.newTag).toEqual('')
561-
562-
expect(wrapper.classes()).not.toContain('focus')
555+
expect(wrapper.classes()).toContain('focus')
563556

564557
const $input = wrapper.find('input')
565-
566558
expect($input.exists()).toBe(true)
567559
expect($input.element.value).toBe('')
568-
569560
expect(document.activeElement).toBe($input.element)
570561

562+
wrapper.vm.blur()
563+
await waitNT(wrapper.vm)
564+
await waitRAF()
565+
expect(wrapper.classes()).not.toContain('focus')
566+
expect(document.activeElement).not.toBe($input.element)
567+
571568
wrapper.destroy()
572569
})
573570
})

0 commit comments

Comments
 (0)