Skip to content

Commit c3db758

Browse files
authored
chore: tests cleanup (bootstrap-vue#5356)
* chore: tests cleanup * Only stub components when really needed * Update button-toolbar.spec.js * Update carousel-slide.spec.js * Update form-checkbox-group.spec.js * Update form-radio-group.spec.js * Update tabs.spec.js * Update click-out.spec.js * Update focus-in.spec.js * Update dom.spec.js * Update carousel.spec.js
1 parent dbe2a67 commit c3db758

39 files changed

+327
-596
lines changed

src/components/alert/alert.spec.js

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,7 @@
1-
import { config as vtuConfig, mount } from '@vue/test-utils'
1+
import { mount } from '@vue/test-utils'
22
import { waitNT, waitRAF } from '../../../tests/utils'
33
import { BAlert } from './alert'
44

5-
// Disable the use of the TransitionStub component
6-
// since it doesn't run transition hooks
7-
vtuConfig.stubs.transition = false
8-
95
describe('alert', () => {
106
it('hidden alert renders comment node', async () => {
117
const wrapper = mount(BAlert)

src/components/avatar/avatar.spec.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { mount, createLocalVue as CreateLocalVue } from '@vue/test-utils'
1+
import { createLocalVue, mount } from '@vue/test-utils'
22
import { BIconPerson } from '../../icons/icons'
33
import { BAvatar } from './avatar'
44

@@ -154,14 +154,16 @@ describe('avatar', () => {
154154
})
155155

156156
it('should have expected structure when prop `icon` set', async () => {
157-
const localVue = new CreateLocalVue()
157+
const localVue = createLocalVue()
158158
localVue.component('BIconPerson', BIconPerson)
159+
159160
const wrapper = mount(BAvatar, {
160161
localVue,
161162
propsData: {
162163
icon: 'person'
163164
}
164165
})
166+
165167
expect(wrapper.vm).toBeDefined()
166168
expect(wrapper.element.tagName).toBe('SPAN')
167169
expect(wrapper.classes()).toContain('b-avatar')

src/components/button-toolbar/button-toolbar.spec.js

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import Vue from 'vue'
21
import { mount } from '@vue/test-utils'
32
import { createContainer, waitNT } from '../../../tests/utils'
43
import { BButton } from '../button/button'
@@ -82,15 +81,15 @@ describe('button-toolbar', () => {
8281
})
8382

8483
// Test App for keynav
85-
const App = Vue.extend({
84+
const App = {
8685
render(h) {
8786
return h(BButtonToolbar, { props: { keyNav: true } }, [
8887
h(BButtonGroup, [h(BButton, 'a'), h(BButton, 'b')]),
8988
h(BButtonGroup, [h(BButton, { props: { disabled: true } }, 'c'), h(BButton, 'd')]),
9089
h(BButtonGroup, [h(BButton, 'e'), h(BButton, 'f')])
9190
])
9291
}
93-
})
92+
}
9493

9594
it('has correct structure', async () => {
9695
const wrapper = mount(App, {

src/components/carousel/carousel-slide.spec.js

Lines changed: 39 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -2,96 +2,90 @@ import { mount } from '@vue/test-utils'
22
import { BCarouselSlide } from './carousel-slide'
33

44
describe('carousel-slide', () => {
5-
it('has root element "div"', async () => {
5+
it('has expected default structure', async () => {
66
const wrapper = mount(BCarouselSlide)
7-
expect(wrapper.element.tagName).toBe('DIV')
8-
9-
wrapper.destroy()
10-
})
117

12-
it('has class carousel-item', async () => {
13-
const wrapper = mount(BCarouselSlide)
14-
expect(wrapper.classes()).toContain('carousel-item')
8+
expect(wrapper.element.tagName).toBe('DIV')
159
expect(wrapper.classes().length).toBe(1)
16-
17-
wrapper.destroy()
18-
})
19-
20-
it('has role=listitem', async () => {
21-
const wrapper = mount(BCarouselSlide)
10+
expect(wrapper.classes()).toContain('carousel-item')
2211
expect(wrapper.attributes('role')).toBeDefined()
2312
expect(wrapper.attributes('role')).toBe('listitem')
2413

2514
wrapper.destroy()
2615
})
2716

28-
it('does not have child div.carousel-caption by default', async () => {
17+
it('does not have child "carousel-caption" by default', async () => {
2918
const wrapper = mount(BCarouselSlide)
19+
3020
expect(wrapper.find('.carousel-caption').exists()).toBe(false)
3121

3222
wrapper.destroy()
3323
})
3424

35-
it('does not have image by default', async () => {
25+
it('does not have "img" by default', async () => {
3626
const wrapper = mount(BCarouselSlide)
3727
expect(wrapper.find('img').exists()).toBe(false)
3828

3929
wrapper.destroy()
4030
})
4131

42-
it('does not have caption tag h3 by default', async () => {
32+
it('does not have caption tag "h3" by default', async () => {
4333
const wrapper = mount(BCarouselSlide)
4434
expect(wrapper.find('h3').exists()).toBe(false)
4535

4636
wrapper.destroy()
4737
})
4838

49-
it('does not have text tag p by default', async () => {
39+
it('does not have text tag "p" by default', async () => {
5040
const wrapper = mount(BCarouselSlide)
41+
5142
expect(wrapper.find('p').exists()).toBe(false)
5243

5344
wrapper.destroy()
5445
})
5546

56-
it('renders default slot inside carousel-caption', async () => {
47+
it('renders default slot inside "carousel-caption"', async () => {
5748
const wrapper = mount(BCarouselSlide, {
5849
slots: {
5950
default: 'foobar'
6051
}
6152
})
53+
6254
expect(wrapper.find('.carousel-caption').exists()).toBe(true)
6355
expect(wrapper.find('.carousel-caption').text()).toContain('foobar')
6456

6557
wrapper.destroy()
6658
})
6759

68-
it('has caption tag h3 when prop caption is set', async () => {
60+
it('has caption tag "h3" when prop "caption" is set', async () => {
6961
const wrapper = mount(BCarouselSlide, {
7062
propsData: {
7163
caption: 'foobar'
7264
}
7365
})
66+
7467
const content = wrapper.find('.carousel-caption')
7568
expect(content.find('h3').exists()).toBe(true)
7669
expect(content.find('h3').text()).toBe('foobar')
7770

7871
wrapper.destroy()
7972
})
8073

81-
it('has text tag p when prop text is set', async () => {
74+
it('has text tag "p" when prop "text" is set', async () => {
8275
const wrapper = mount(BCarouselSlide, {
8376
propsData: {
8477
text: 'foobar'
8578
}
8679
})
80+
8781
const content = wrapper.find('.carousel-caption')
8882
expect(content.find('p').exists()).toBe(true)
8983
expect(content.find('p').text()).toBe('foobar')
9084

9185
wrapper.destroy()
9286
})
9387

94-
it('has custom content tag when prop contentTag is set', async () => {
88+
it('has custom content tag when prop "content-tag" is set', async () => {
9589
const wrapper = mount(BCarouselSlide, {
9690
propsData: {
9791
contentTag: 'span'
@@ -100,13 +94,14 @@ describe('carousel-slide', () => {
10094
default: 'foobar'
10195
}
10296
})
97+
10398
expect(wrapper.find('.carousel-caption').exists()).toBe(true)
10499
expect(wrapper.find('.carousel-caption').element.tagName).toBe('SPAN')
105100

106101
wrapper.destroy()
107102
})
108103

109-
it('has display classes on .carousel-caption when prop contentVisibleUp is set', async () => {
104+
it('has display classes on "carousel-caption" when prop "content-visible-up" is set', async () => {
110105
const wrapper = mount(BCarouselSlide, {
111106
propsData: {
112107
contentVisibleUp: 'lg'
@@ -115,6 +110,7 @@ describe('carousel-slide', () => {
115110
default: 'foobar'
116111
}
117112
})
113+
118114
expect(wrapper.find('.carousel-caption').exists()).toBe(true)
119115
expect(wrapper.find('.carousel-caption').classes()).toContain('d-none')
120116
expect(wrapper.find('.carousel-caption').classes()).toContain('d-lg-block')
@@ -123,25 +119,21 @@ describe('carousel-slide', () => {
123119
wrapper.destroy()
124120
})
125121

126-
it('does not have style background when prop background not set', async () => {
122+
it('does not have style "background" when prop "background" not set', async () => {
127123
const wrapper = mount(BCarouselSlide)
128-
if (wrapper.attributes('style')) {
129-
// Vue always includes a style attr when passed an empty style object
130-
expect(wrapper.attributes('style')).not.toContain('background:')
131-
} else {
132-
// But just in case that changes in the future
133-
expect(true).toBe(true)
134-
}
124+
125+
expect(wrapper.attributes('style')).not.toBeDefined()
135126

136127
wrapper.destroy()
137128
})
138129

139-
it('has style background when prop background is set', async () => {
130+
it('has style "background" when prop "background" is set', async () => {
140131
const wrapper = mount(BCarouselSlide, {
141132
propsData: {
142133
background: 'rgb(1, 2, 3)'
143134
}
144135
})
136+
145137
expect(wrapper.attributes('style')).toBeDefined()
146138
expect(wrapper.attributes('style')).toContain('background:')
147139
expect(wrapper.attributes('style')).toContain('rgb(')
@@ -157,74 +149,80 @@ describe('carousel-slide', () => {
157149
}
158150
}
159151
})
152+
160153
expect(wrapper.attributes('style')).toBeDefined()
161154
expect(wrapper.attributes('style')).toContain('background:')
162155
expect(wrapper.attributes('style')).toContain('rgb(')
163156

164157
wrapper.destroy()
165158
})
166159

167-
it('has custom caption tag when prop captionTag is set', async () => {
160+
it('has custom caption tag when prop "caption-tag" is set', async () => {
168161
const wrapper = mount(BCarouselSlide, {
169162
propsData: {
170163
captionTag: 'h1',
171164
caption: 'foobar'
172165
}
173166
})
167+
174168
const content = wrapper.find('.carousel-caption')
175169
expect(content.find('h1').exists()).toBe(true)
176170
expect(content.find('h1').text()).toBe('foobar')
177171

178172
wrapper.destroy()
179173
})
180174

181-
it('has custom text tag when prop textTag is set', async () => {
175+
it('has custom text tag when prop "text-tag is set', async () => {
182176
const wrapper = mount(BCarouselSlide, {
183177
propsData: {
184178
textTag: 'span',
185179
text: 'foobar'
186180
}
187181
})
182+
188183
const content = wrapper.find('.carousel-caption')
189184
expect(content.find('span').exists()).toBe(true)
190185
expect(content.find('span').text()).toBe('foobar')
191186

192187
wrapper.destroy()
193188
})
194189

195-
it('has image when prop img-src is set', async () => {
190+
it('has image when prop "img-src" is set', async () => {
196191
const wrapper = mount(BCarouselSlide, {
197192
propsData: {
198193
imgSrc: 'https://picsum.photos/1024/480/?image=52'
199194
}
200195
})
196+
201197
expect(wrapper.find('img').exists()).toBe(true)
202198
expect(wrapper.find('img').attributes('src')).toBeDefined()
203199
expect(wrapper.find('img').attributes('src')).toBe('https://picsum.photos/1024/480/?image=52')
204200

205201
wrapper.destroy()
206202
})
207203

208-
it('has image when prop img-blank is set', async () => {
204+
it('has image when prop "img-blank" is set', async () => {
209205
const wrapper = mount(BCarouselSlide, {
210206
propsData: {
211207
imgBlank: true
212208
}
213209
})
210+
214211
expect(wrapper.find('img').exists()).toBe(true)
215212
expect(wrapper.find('img').attributes('src')).toBeDefined()
216213
expect(wrapper.find('img').attributes('src')).toContain('data:')
217214

218215
wrapper.destroy()
219216
})
220217

221-
it('has image with alt attribute when prop img-alt is set', async () => {
218+
it('has image with "alt" attr when prop "img-alt" is set', async () => {
222219
const wrapper = mount(BCarouselSlide, {
223220
propsData: {
224221
imgSrc: 'https://picsum.photos/1024/480/?image=52',
225222
imgAlt: 'foobar'
226223
}
227224
})
225+
228226
expect(wrapper.find('img').exists()).toBe(true)
229227
expect(wrapper.find('img').attributes('src')).toBeDefined()
230228
expect(wrapper.find('img').attributes('alt')).toBeDefined()
@@ -233,14 +231,15 @@ describe('carousel-slide', () => {
233231
wrapper.destroy()
234232
})
235233

236-
it('has image with width and height attrs when props img-width and img-height are set', async () => {
234+
it('has image with "width" and "height" attrs when props "img-width" and "img-height" are set', async () => {
237235
const wrapper = mount(BCarouselSlide, {
238236
propsData: {
239237
imgSrc: 'https://picsum.photos/1024/480/?image=52',
240238
imgWidth: '1024',
241239
imgHeight: '480'
242240
}
243241
})
242+
244243
expect(wrapper.find('img').exists()).toBe(true)
245244
expect(wrapper.find('img').attributes('src')).toBeDefined()
246245
expect(wrapper.find('img').attributes('width')).toBeDefined()
@@ -251,7 +250,7 @@ describe('carousel-slide', () => {
251250
wrapper.destroy()
252251
})
253252

254-
it('has image with width and height attrs inherited from carousel parent', async () => {
253+
it('has image with "width" and "height" attrs inherited from carousel parent', async () => {
255254
const wrapper = mount(BCarouselSlide, {
256255
provide: {
257256
// Mock carousel injection
@@ -264,6 +263,7 @@ describe('carousel-slide', () => {
264263
imgSrc: 'https://picsum.photos/1024/480/?image=52'
265264
}
266265
})
266+
267267
expect(wrapper.find('img').exists()).toBe(true)
268268
expect(wrapper.find('img').attributes('src')).toBeDefined()
269269
expect(wrapper.find('img').attributes('width')).toBeDefined()

0 commit comments

Comments
 (0)