@gitlab/ui 114.1.0 → 114.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (141) hide show
  1. package/dist/components/base/breadcrumb/breadcrumb.js +4 -16
  2. package/dist/index.css +1 -1
  3. package/dist/index.css.map +1 -1
  4. package/package.json +7 -26
  5. package/src/components/base/breadcrumb/breadcrumb.scss +18 -2
  6. package/src/components/base/breadcrumb/breadcrumb.vue +4 -17
  7. package/CHANGELOG.md +0 -13139
  8. package/src/vendor/bootstrap/LICENSE +0 -11
  9. package/src/vendor/bootstrap-vue/LICENSE +0 -11
  10. package/src/vendor/bootstrap-vue/package.json +0 -144
  11. package/src/vendor/bootstrap-vue/src/components/button/MODIFICATIONS.md +0 -16
  12. package/src/vendor/bootstrap-vue/src/components/button/README.md +0 -240
  13. package/src/vendor/bootstrap-vue/src/components/button/button-close.spec.js +0 -210
  14. package/src/vendor/bootstrap-vue/src/components/button/button.spec.js +0 -349
  15. package/src/vendor/bootstrap-vue/src/components/button/package.json +0 -105
  16. package/src/vendor/bootstrap-vue/src/components/dropdown/README.md +0 -730
  17. package/src/vendor/bootstrap-vue/src/components/dropdown/dropdown-divider.spec.js +0 -58
  18. package/src/vendor/bootstrap-vue/src/components/dropdown/dropdown-form.spec.js +0 -110
  19. package/src/vendor/bootstrap-vue/src/components/dropdown/dropdown-group.spec.js +0 -94
  20. package/src/vendor/bootstrap-vue/src/components/dropdown/dropdown-header.spec.js +0 -73
  21. package/src/vendor/bootstrap-vue/src/components/dropdown/dropdown-item-button.spec.js +0 -117
  22. package/src/vendor/bootstrap-vue/src/components/dropdown/dropdown-item.spec.js +0 -147
  23. package/src/vendor/bootstrap-vue/src/components/dropdown/dropdown-text.spec.js +0 -59
  24. package/src/vendor/bootstrap-vue/src/components/dropdown/dropdown.spec.js +0 -1121
  25. package/src/vendor/bootstrap-vue/src/components/dropdown/package.json +0 -368
  26. package/src/vendor/bootstrap-vue/src/components/form/README.md +0 -365
  27. package/src/vendor/bootstrap-vue/src/components/form/form-invalid-feedback.spec.js +0 -170
  28. package/src/vendor/bootstrap-vue/src/components/form/form-text.spec.js +0 -93
  29. package/src/vendor/bootstrap-vue/src/components/form/form-valid-feedback.spec.js +0 -157
  30. package/src/vendor/bootstrap-vue/src/components/form/form.spec.js +0 -97
  31. package/src/vendor/bootstrap-vue/src/components/form/package.json +0 -112
  32. package/src/vendor/bootstrap-vue/src/components/form-checkbox/README.md +0 -691
  33. package/src/vendor/bootstrap-vue/src/components/form-checkbox/form-checkbox-group.spec.js +0 -525
  34. package/src/vendor/bootstrap-vue/src/components/form-checkbox/form-checkbox.spec.js +0 -922
  35. package/src/vendor/bootstrap-vue/src/components/form-checkbox/package.json +0 -172
  36. package/src/vendor/bootstrap-vue/src/components/form-group/README.md +0 -339
  37. package/src/vendor/bootstrap-vue/src/components/form-group/form-group.spec.js +0 -477
  38. package/src/vendor/bootstrap-vue/src/components/form-group/package.json +0 -183
  39. package/src/vendor/bootstrap-vue/src/components/form-radio/README.md +0 -437
  40. package/src/vendor/bootstrap-vue/src/components/form-radio/form-radio-group.spec.js +0 -357
  41. package/src/vendor/bootstrap-vue/src/components/form-radio/form-radio.spec.js +0 -587
  42. package/src/vendor/bootstrap-vue/src/components/form-radio/package.json +0 -162
  43. package/src/vendor/bootstrap-vue/src/components/form-select/README.md +0 -504
  44. package/src/vendor/bootstrap-vue/src/components/form-select/form-select-option-group.spec.js +0 -138
  45. package/src/vendor/bootstrap-vue/src/components/form-select/form-select-option.spec.js +0 -75
  46. package/src/vendor/bootstrap-vue/src/components/form-select/form-select.spec.js +0 -723
  47. package/src/vendor/bootstrap-vue/src/components/form-select/package.json +0 -132
  48. package/src/vendor/bootstrap-vue/src/components/form-textarea/README.md +0 -453
  49. package/src/vendor/bootstrap-vue/src/components/form-textarea/form-textarea.spec.js +0 -1000
  50. package/src/vendor/bootstrap-vue/src/components/form-textarea/package.json +0 -122
  51. package/src/vendor/bootstrap-vue/src/components/layout/README.md +0 -791
  52. package/src/vendor/bootstrap-vue/src/components/layout/col.spec.js +0 -192
  53. package/src/vendor/bootstrap-vue/src/components/layout/form-row.spec.js +0 -45
  54. package/src/vendor/bootstrap-vue/src/components/layout/package.json +0 -99
  55. package/src/vendor/bootstrap-vue/src/components/link/README.md +0 -76
  56. package/src/vendor/bootstrap-vue/src/components/link/link.spec.js +0 -434
  57. package/src/vendor/bootstrap-vue/src/components/link/package.json +0 -57
  58. package/src/vendor/bootstrap-vue/src/components/modal/MODIFICATIONS.md +0 -30
  59. package/src/vendor/bootstrap-vue/src/components/modal/README.md +0 -1067
  60. package/src/vendor/bootstrap-vue/src/components/modal/helpers/bv-modal-event.class.spec.js +0 -82
  61. package/src/vendor/bootstrap-vue/src/components/modal/modal.spec.js +0 -1418
  62. package/src/vendor/bootstrap-vue/src/components/modal/package.json +0 -544
  63. package/src/vendor/bootstrap-vue/src/components/nav/README.md +0 -362
  64. package/src/vendor/bootstrap-vue/src/components/nav/nav-item.spec.js +0 -127
  65. package/src/vendor/bootstrap-vue/src/components/nav/nav.spec.js +0 -177
  66. package/src/vendor/bootstrap-vue/src/components/nav/package.json +0 -73
  67. package/src/vendor/bootstrap-vue/src/components/popover/README.md +0 -919
  68. package/src/vendor/bootstrap-vue/src/components/popover/package.json +0 -261
  69. package/src/vendor/bootstrap-vue/src/components/popover/popover.spec.js +0 -198
  70. package/src/vendor/bootstrap-vue/src/components/table/README.md +0 -3157
  71. package/src/vendor/bootstrap-vue/src/components/table/helpers/default-sort-compare.spec.js +0 -112
  72. package/src/vendor/bootstrap-vue/src/components/table/helpers/normalize-fields.spec.js +0 -93
  73. package/src/vendor/bootstrap-vue/src/components/table/package.json +0 -1763
  74. package/src/vendor/bootstrap-vue/src/components/table/table-busy.spec.js +0 -150
  75. package/src/vendor/bootstrap-vue/src/components/table/table-caption.spec.js +0 -176
  76. package/src/vendor/bootstrap-vue/src/components/table/table-colgroup.spec.js +0 -81
  77. package/src/vendor/bootstrap-vue/src/components/table/table-filtering.spec.js +0 -409
  78. package/src/vendor/bootstrap-vue/src/components/table/table-item-formatter.spec.js +0 -56
  79. package/src/vendor/bootstrap-vue/src/components/table/table-lite.spec.js +0 -682
  80. package/src/vendor/bootstrap-vue/src/components/table/table-pagination.spec.js +0 -133
  81. package/src/vendor/bootstrap-vue/src/components/table/table-primarykey.spec.js +0 -83
  82. package/src/vendor/bootstrap-vue/src/components/table/table-provider.spec.js +0 -411
  83. package/src/vendor/bootstrap-vue/src/components/table/table-row-details.spec.js +0 -459
  84. package/src/vendor/bootstrap-vue/src/components/table/table-selectable.spec.js +0 -1182
  85. package/src/vendor/bootstrap-vue/src/components/table/table-simple.spec.js +0 -206
  86. package/src/vendor/bootstrap-vue/src/components/table/table-sorting.spec.js +0 -858
  87. package/src/vendor/bootstrap-vue/src/components/table/table-sticky-column.spec.js +0 -377
  88. package/src/vendor/bootstrap-vue/src/components/table/table-tbody-bottom-row.spec.js +0 -94
  89. package/src/vendor/bootstrap-vue/src/components/table/table-tbody-row-events.spec.js +0 -529
  90. package/src/vendor/bootstrap-vue/src/components/table/table-tbody-top-row.spec.js +0 -88
  91. package/src/vendor/bootstrap-vue/src/components/table/table-tbody-transition.spec.js +0 -83
  92. package/src/vendor/bootstrap-vue/src/components/table/table-tfoot-custom.spec.js +0 -91
  93. package/src/vendor/bootstrap-vue/src/components/table/table-tfoot-events.spec.js +0 -137
  94. package/src/vendor/bootstrap-vue/src/components/table/table-thead-events.spec.js +0 -155
  95. package/src/vendor/bootstrap-vue/src/components/table/table-thead-top.spec.js +0 -96
  96. package/src/vendor/bootstrap-vue/src/components/table/table.spec.js +0 -692
  97. package/src/vendor/bootstrap-vue/src/components/tabs/README.md +0 -433
  98. package/src/vendor/bootstrap-vue/src/components/tabs/package.json +0 -205
  99. package/src/vendor/bootstrap-vue/src/components/tabs/tab.spec.js +0 -330
  100. package/src/vendor/bootstrap-vue/src/components/tabs/tabs.spec.js +0 -778
  101. package/src/vendor/bootstrap-vue/src/components/toast/README.md +0 -655
  102. package/src/vendor/bootstrap-vue/src/components/toast/helpers/bv-toast.spec.js +0 -117
  103. package/src/vendor/bootstrap-vue/src/components/toast/package.json +0 -184
  104. package/src/vendor/bootstrap-vue/src/components/toast/toast.spec.js +0 -294
  105. package/src/vendor/bootstrap-vue/src/components/toast/toaster.spec.js +0 -77
  106. package/src/vendor/bootstrap-vue/src/components/tooltip/README.md +0 -559
  107. package/src/vendor/bootstrap-vue/src/components/tooltip/package.json +0 -258
  108. package/src/vendor/bootstrap-vue/src/components/tooltip/tooltip.spec.js +0 -1240
  109. package/src/vendor/bootstrap-vue/src/components/transition/package.json +0 -5
  110. package/src/vendor/bootstrap-vue/src/components/transporter/package.json +0 -5
  111. package/src/vendor/bootstrap-vue/src/components/transporter/transporter.spec.js +0 -85
  112. package/src/vendor/bootstrap-vue/src/directives/modal/modal.spec.js +0 -191
  113. package/src/vendor/bootstrap-vue/src/directives/tooltip/README.md +0 -521
  114. package/src/vendor/bootstrap-vue/src/directives/tooltip/package.json +0 -131
  115. package/src/vendor/bootstrap-vue/src/directives/tooltip/tooltip.spec.js +0 -190
  116. package/src/vendor/bootstrap-vue/src/directives/visible/README.md +0 -244
  117. package/src/vendor/bootstrap-vue/src/directives/visible/package.json +0 -24
  118. package/src/vendor/bootstrap-vue/src/mixins/attrs.spec.js +0 -194
  119. package/src/vendor/bootstrap-vue/src/mixins/click-out.spec.js +0 -52
  120. package/src/vendor/bootstrap-vue/src/mixins/focus-in.spec.js +0 -53
  121. package/src/vendor/bootstrap-vue/src/mixins/listen-on-document.spec.js +0 -117
  122. package/src/vendor/bootstrap-vue/src/mixins/listen-on-root.spec.js +0 -77
  123. package/src/vendor/bootstrap-vue/src/mixins/listen-on-window.spec.js +0 -115
  124. package/src/vendor/bootstrap-vue/src/mixins/listeners.spec.js +0 -245
  125. package/src/vendor/bootstrap-vue/src/utils/bv-event.class.spec.js +0 -66
  126. package/src/vendor/bootstrap-vue/src/utils/clone-deep.spec.js +0 -70
  127. package/src/vendor/bootstrap-vue/src/utils/config.spec.js +0 -169
  128. package/src/vendor/bootstrap-vue/src/utils/css-escape.spec.js +0 -82
  129. package/src/vendor/bootstrap-vue/src/utils/dom.spec.js +0 -291
  130. package/src/vendor/bootstrap-vue/src/utils/events.spec.js +0 -41
  131. package/src/vendor/bootstrap-vue/src/utils/get.spec.js +0 -109
  132. package/src/vendor/bootstrap-vue/src/utils/inspect.spec.js +0 -251
  133. package/src/vendor/bootstrap-vue/src/utils/loose-equal.spec.js +0 -203
  134. package/src/vendor/bootstrap-vue/src/utils/normalize-slot.spec.js +0 -63
  135. package/src/vendor/bootstrap-vue/src/utils/number.spec.js +0 -72
  136. package/src/vendor/bootstrap-vue/src/utils/object.spec.js +0 -61
  137. package/src/vendor/bootstrap-vue/src/utils/props.spec.js +0 -112
  138. package/src/vendor/bootstrap-vue/src/utils/router.spec.js +0 -248
  139. package/src/vendor/bootstrap-vue/src/utils/string.spec.js +0 -65
  140. package/src/vendor/bootstrap-vue/src/utils/stringify-object-values.spec.js +0 -47
  141. package/src/vendor/bootstrap-vue/src/utils/warn.spec.js +0 -54
@@ -1,1240 +0,0 @@
1
- import { createWrapper, mount } from '@vue/test-utils'
2
- import { ensureEventEmitted, waitNT, waitRAF } from '../../../tests/utils'
3
- import { BTooltip } from './tooltip'
4
-
5
- const MODAL_CLOSE_EVENT = 'bv::modal::hidden'
6
-
7
- // Our test application
8
- const App = {
9
- props: [
10
- 'target',
11
- 'triggers',
12
- 'show',
13
- 'noninteractive',
14
- 'disabled',
15
- 'noFade',
16
- 'title',
17
- 'titleAttr',
18
- 'btnDisabled',
19
- 'variant',
20
- 'customClass',
21
- 'delay',
22
- 'isModal'
23
- ],
24
- render(h) {
25
- const tipProps = {
26
- target: this.target || 'foo',
27
- triggers: this.triggers,
28
- show: this.show,
29
- noninteractive: this.noninteractive || false,
30
- disabled: this.disabled,
31
- noFade: this.noFade || false,
32
- title: this.title || null,
33
- variant: this.variant,
34
- customClass: this.customClass,
35
- delay: this.delay
36
- }
37
- const wrapperData = {
38
- attrs: { id: 'wrapper' },
39
- // Class to simulate being in a modal
40
- class: { 'modal-content': !!this.isModal }
41
- }
42
- return h('article', wrapperData, [
43
- h(
44
- 'button',
45
- {
46
- attrs: {
47
- id: 'foo',
48
- type: 'button',
49
- disabled: this.btnDisabled || null,
50
- title: this.titleAttr || null
51
- },
52
- ref: 'target'
53
- },
54
- 'text'
55
- ),
56
- typeof this.$slots.default === `undefined` || !this.$slots.default
57
- ? h(BTooltip, { props: tipProps })
58
- : h(BTooltip, { props: tipProps }, this.$slots.default)
59
- ])
60
- }
61
- }
62
-
63
- /**
64
- * @gitlab/ui Note: These specs have been rewritten to be working with jest >= 29
65
- * Instead of relying on an arcane mix of nextTick and waiting on requestAnimationFrame
66
- * we are now waiting for certain events to happen
67
- */
68
- describe('b-tooltip', () => {
69
- const originalCreateRange = document.createRange
70
- const origGetBCR = Element.prototype.getBoundingClientRect
71
- let wrapper
72
-
73
- beforeEach(() => {
74
- // https://github.com/FezVrasta/popper.js/issues/478#issuecomment-407422016
75
- // Hack to make Popper not bork out during tests
76
- // Note popper still does not do any positioning calculation in JSDOM though
77
- // So we cannot test actual positioning, just detect when it is open
78
- document.createRange = () => ({
79
- setStart: () => {},
80
- setEnd: () => {},
81
- commonAncestorContainer: {
82
- nodeName: 'BODY',
83
- ownerDocument: document
84
- }
85
- })
86
- // Mock `getBoundingClientRect()` so that the `isVisible(el)` test returns `true`
87
- // Needed for visibility checks of trigger element, etc
88
- Element.prototype.getBoundingClientRect = jest.fn(() => ({
89
- width: 24,
90
- height: 24,
91
- top: 0,
92
- left: 0,
93
- bottom: 0,
94
- right: 0
95
- }))
96
- })
97
-
98
- afterEach(async () => {
99
- // Reset overrides
100
- document.createRange = originalCreateRange
101
- Element.prototype.getBoundingClientRect = origGetBCR
102
- await waitRAF()
103
- return wrapper.destroy()
104
- })
105
-
106
- it('has expected default structure', async () => {
107
- wrapper = mount(App, {
108
- attachTo: document.body,
109
- propsData: {
110
- triggers: 'click'
111
- },
112
- slots: {
113
- default: 'title'
114
- }
115
- })
116
-
117
- expect(wrapper.vm).toBeDefined()
118
- await waitNT(wrapper.vm)
119
-
120
- expect(wrapper.element.tagName).toBe('ARTICLE')
121
- expect(wrapper.attributes('id')).toBeDefined()
122
- expect(wrapper.attributes('id')).toEqual('wrapper')
123
- expect(wrapper.classes()).not.toContain('modal-content')
124
-
125
- // The trigger button
126
- const $button = wrapper.find('button')
127
- expect($button.exists()).toBe(true)
128
- expect($button.attributes('id')).toBeDefined()
129
- expect($button.attributes('id')).toEqual('foo')
130
- expect($button.attributes('title')).toBeUndefined()
131
- expect($button.attributes('data-original-title')).toBeUndefined()
132
- expect($button.attributes('aria-describedby')).toBeUndefined()
133
-
134
- // <b-tooltip> wrapper
135
- const $tipHolder = wrapper.findComponent(BTooltip)
136
- expect($tipHolder.exists()).toBe(true)
137
- expect($tipHolder.element.nodeType).toEqual(Node.COMMENT_NODE)
138
- })
139
-
140
- it('initially open has expected structure', async () => {
141
- wrapper = mount(App, {
142
- attachTo: document.body,
143
- propsData: {
144
- triggers: 'click',
145
- show: true
146
- },
147
- slots: {
148
- default: 'title'
149
- }
150
- })
151
-
152
- expect(wrapper.vm).toBeDefined()
153
- await waitNT(wrapper.vm)
154
-
155
- expect(wrapper.element.tagName).toBe('ARTICLE')
156
- expect(wrapper.attributes('id')).toBeDefined()
157
- expect(wrapper.attributes('id')).toEqual('wrapper')
158
-
159
- // The trigger button
160
- const $button = wrapper.find('button')
161
- expect($button.exists()).toBe(true)
162
- expect($button.attributes('id')).toBeDefined()
163
- expect($button.attributes('id')).toEqual('foo')
164
- expect($button.attributes('title')).toBeUndefined()
165
- expect($button.attributes('data-original-title')).toBeUndefined()
166
- expect($button.attributes('aria-describedby')).toBeDefined()
167
- // ID of the tooltip that will be in the body
168
- const adb = $button.attributes('aria-describedby')
169
-
170
- // <b-tooltip> wrapper
171
- const $tipHolder = wrapper.findComponent(BTooltip)
172
- expect($tipHolder.exists()).toBe(true)
173
- expect($tipHolder.element.nodeType).toEqual(Node.COMMENT_NODE)
174
-
175
- // Find the tooltip element in the document
176
- const tip = document.getElementById(adb)
177
- expect(tip).not.toBe(null)
178
- expect(tip).toBeInstanceOf(HTMLElement)
179
- expect(tip.tagName).toEqual('DIV')
180
- expect(tip.classList.contains('tooltip')).toBe(true)
181
- expect(tip.classList.contains('b-tooltip')).toBe(true)
182
- expect(tip.classList.contains('interactive')).toBe(false)
183
-
184
- // Hide the tooltip
185
- await wrapper.setProps({ show: false })
186
- await ensureEventEmitted($tipHolder, 'hidden')
187
-
188
- expect($button.attributes('aria-describedby')).toBeUndefined()
189
-
190
- // Tooltip element should not be in the document
191
- expect(document.body.contains(tip)).toBe(false)
192
- expect(document.querySelector(adb)).toBe(null)
193
-
194
- // Show the tooltip
195
- await wrapper.setProps({ show: true })
196
- await waitNT(wrapper.vm)
197
-
198
- expect($button.attributes('aria-describedby')).toBeDefined()
199
-
200
- // Note tip always has the same ID
201
- const tip2 = document.getElementById(adb)
202
- expect(tip2).not.toBe(null)
203
- expect(tip2).toBeInstanceOf(HTMLElement)
204
- expect(tip2.tagName).toEqual('DIV')
205
- expect(tip2.classList.contains('tooltip')).toBe(true)
206
- expect(tip2.classList.contains('b-tooltip')).toBe(true)
207
- })
208
-
209
- it('title prop is reactive', async () => {
210
- wrapper = mount(App, {
211
- attachTo: document.body,
212
- propsData: {
213
- triggers: 'click',
214
- show: true,
215
- title: 'hello'
216
- }
217
- })
218
-
219
- expect(wrapper.vm).toBeDefined()
220
- await waitNT(wrapper.vm)
221
-
222
- expect(wrapper.element.tagName).toBe('ARTICLE')
223
- expect(wrapper.attributes('id')).toBeDefined()
224
- expect(wrapper.attributes('id')).toEqual('wrapper')
225
-
226
- // The trigger button
227
- const $button = wrapper.find('button')
228
- expect($button.exists()).toBe(true)
229
- expect($button.attributes('id')).toBeDefined()
230
- expect($button.attributes('id')).toEqual('foo')
231
- expect($button.attributes('title')).toBeUndefined()
232
- expect($button.attributes('data-original-title')).toBeUndefined()
233
- expect($button.attributes('aria-describedby')).toBeDefined()
234
- // ID of the tooltip that will be in the body
235
- const adb = $button.attributes('aria-describedby')
236
-
237
- // <b-tooltip> wrapper
238
- const $tipHolder = wrapper.findComponent(BTooltip)
239
- expect($tipHolder.exists()).toBe(true)
240
- expect($tipHolder.element.nodeType).toEqual(Node.COMMENT_NODE)
241
-
242
- // Find the tooltip element in the document
243
- const tip = document.getElementById(adb)
244
- expect(tip).not.toBe(null)
245
- expect(tip).toBeInstanceOf(HTMLElement)
246
- const $tip = createWrapper(tip)
247
- expect($tip.element.tagName).toBe('DIV')
248
- expect($tip.classes()).toContain('tooltip')
249
- expect($tip.classes()).toContain('b-tooltip')
250
- // Should contain our title prop value
251
- expect($tip.text()).toContain('hello')
252
-
253
- // Change the title prop
254
- await wrapper.setProps({ title: 'world' })
255
- await waitNT(wrapper.vm)
256
- await waitRAF()
257
-
258
- // Tooltip element should still be in the document
259
- expect(document.body.contains(tip)).toBe(true)
260
- expect($tip.classes()).toContain('tooltip')
261
- expect($tip.classes()).toContain('b-tooltip')
262
- // Should contain the new updated content
263
- expect($tip.text()).toContain('world')
264
- })
265
-
266
- it('providing the trigger element by function works', async () => {
267
- wrapper = mount(App, {
268
- attachTo: document.body,
269
- propsData: {
270
- target: () => wrapper.vm.$refs.target,
271
- triggers: 'click',
272
- show: false
273
- },
274
- slots: {
275
- default: 'title'
276
- }
277
- })
278
-
279
- expect(wrapper.vm).toBeDefined()
280
- await waitNT(wrapper.vm)
281
- await waitRAF()
282
-
283
- expect(wrapper.element.tagName).toBe('ARTICLE')
284
- expect(wrapper.attributes('id')).toBeDefined()
285
- expect(wrapper.attributes('id')).toEqual('wrapper')
286
-
287
- // The trigger button
288
- const $button = wrapper.find('button')
289
- expect($button.exists()).toBe(true)
290
- expect($button.attributes('id')).toBeDefined()
291
- expect($button.attributes('id')).toEqual('foo')
292
- expect($button.attributes('aria-describedby')).toBeUndefined()
293
-
294
- // <b-tooltip> wrapper
295
- const $tipHolder = wrapper.findComponent(BTooltip)
296
- expect($tipHolder.exists()).toBe(true)
297
-
298
- // Activate tooltip by trigger
299
- await $button.trigger('click')
300
- await ensureEventEmitted($tipHolder, 'shown')
301
-
302
- expect($button.attributes('id')).toBeDefined()
303
- expect($button.attributes('id')).toEqual('foo')
304
- expect($button.attributes('aria-describedby')).toBeDefined()
305
- // ID of the tooltip that will be in the body
306
- const adb = $button.attributes('aria-describedby')
307
-
308
- // Find the tooltip element in the document
309
- const tip = document.getElementById(adb)
310
- expect(tip).not.toBe(null)
311
- expect(tip).toBeInstanceOf(HTMLElement)
312
- expect(tip.tagName).toEqual('DIV')
313
- expect(tip.classList.contains('tooltip')).toBe(true)
314
- expect(tip.classList.contains('b-tooltip')).toBe(true)
315
- })
316
-
317
- it('activating trigger element (click) opens tooltip', async () => {
318
- wrapper = mount(App, {
319
- attachTo: document.body,
320
- propsData: {
321
- triggers: 'click',
322
- show: false
323
- },
324
- slots: {
325
- default: 'title'
326
- }
327
- })
328
-
329
- expect(wrapper.vm).toBeDefined()
330
- await waitNT(wrapper.vm)
331
- await waitRAF()
332
-
333
- expect(wrapper.element.tagName).toBe('ARTICLE')
334
- expect(wrapper.attributes('id')).toBeDefined()
335
- expect(wrapper.attributes('id')).toEqual('wrapper')
336
-
337
- // The trigger button
338
- const $button = wrapper.find('button')
339
- expect($button.exists()).toBe(true)
340
- expect($button.attributes('id')).toBeDefined()
341
- expect($button.attributes('id')).toEqual('foo')
342
- expect($button.attributes('aria-describedby')).toBeUndefined()
343
-
344
- // <b-tooltip> wrapper
345
- const $tipHolder = wrapper.findComponent(BTooltip)
346
- expect($tipHolder.exists()).toBe(true)
347
-
348
- // Activate tooltip by trigger
349
- await $button.trigger('click')
350
- await ensureEventEmitted($tipHolder, 'shown')
351
-
352
- expect($button.attributes('id')).toBeDefined()
353
- expect($button.attributes('id')).toEqual('foo')
354
- expect($button.attributes('aria-describedby')).toBeDefined()
355
- // ID of the tooltip that will be in the body
356
- const adb = $button.attributes('aria-describedby')
357
-
358
- // Find the tooltip element in the document
359
- const tip = document.getElementById(adb)
360
- expect(tip).not.toBe(null)
361
- expect(tip).toBeInstanceOf(HTMLElement)
362
- expect(tip.tagName).toEqual('DIV')
363
- expect(tip.classList.contains('tooltip')).toBe(true)
364
- expect(tip.classList.contains('b-tooltip')).toBe(true)
365
- })
366
-
367
- it('activating trigger element (focus) opens tooltip', async () => {
368
- wrapper = mount(App, {
369
- attachTo: document.body,
370
- propsData: {
371
- triggers: 'focus',
372
- show: false,
373
- delay: 0
374
- },
375
- slots: {
376
- default: 'title'
377
- }
378
- })
379
-
380
- expect(wrapper.vm).toBeDefined()
381
- await waitNT(wrapper.vm)
382
- await waitRAF()
383
-
384
- expect(wrapper.element.tagName).toBe('ARTICLE')
385
- expect(wrapper.attributes('id')).toBeDefined()
386
- expect(wrapper.attributes('id')).toEqual('wrapper')
387
-
388
- // The trigger button
389
- const $button = wrapper.find('button')
390
- expect($button.exists()).toBe(true)
391
- expect($button.attributes('id')).toBeDefined()
392
- expect($button.attributes('id')).toEqual('foo')
393
- expect($button.attributes('aria-describedby')).toBeUndefined()
394
-
395
- // <b-tooltip> wrapper
396
- const $tipHolder = wrapper.findComponent(BTooltip)
397
- expect($tipHolder.exists()).toBe(true)
398
-
399
- // Activate tooltip by trigger
400
- await $button.trigger('focusin')
401
- await ensureEventEmitted($tipHolder, 'shown')
402
-
403
- expect($button.attributes('id')).toBeDefined()
404
- expect($button.attributes('id')).toEqual('foo')
405
- expect($button.attributes('aria-describedby')).toBeDefined()
406
- // ID of the tooltip that will be in the body
407
- const adb = $button.attributes('aria-describedby')
408
-
409
- // Find the tooltip element in the document
410
- const tip = document.getElementById(adb)
411
- expect(tip).not.toBe(null)
412
- expect(tip).toBeInstanceOf(HTMLElement)
413
- expect(tip.tagName).toEqual('DIV')
414
- expect(tip.classList.contains('tooltip')).toBe(true)
415
- expect(tip.classList.contains('b-tooltip')).toBe(true)
416
-
417
- // Deactivate tooltip by trigger
418
- expect($tipHolder.emitted('hidden')).toBeFalsy()
419
- await $button.trigger('focusout', { relatedTarget: document.body })
420
- await ensureEventEmitted($tipHolder, 'hidden')
421
-
422
- // Tooltip element should not be in the document
423
- expect($button.attributes('aria-describedby')).toBeUndefined()
424
- expect(document.body.contains(tip)).toBe(false)
425
- expect(document.getElementById(adb)).toBe(null)
426
- })
427
-
428
- it('activating trigger element (hover) opens tooltip', async () => {
429
- wrapper = mount(App, {
430
- attachTo: document.body,
431
- propsData: {
432
- triggers: 'hover',
433
- show: false,
434
- // Add no fade for coverage
435
- noFade: true
436
- },
437
- slots: {
438
- default: 'title'
439
- }
440
- })
441
-
442
- expect(wrapper.vm).toBeDefined()
443
- await waitNT(wrapper.vm)
444
- await waitRAF()
445
-
446
- expect(wrapper.element.tagName).toBe('ARTICLE')
447
- expect(wrapper.attributes('id')).toBeDefined()
448
- expect(wrapper.attributes('id')).toEqual('wrapper')
449
-
450
- // The trigger button
451
- const $button = wrapper.find('button')
452
- expect($button.exists()).toBe(true)
453
- expect($button.attributes('id')).toBeDefined()
454
- expect($button.attributes('id')).toEqual('foo')
455
- expect($button.attributes('aria-describedby')).toBeUndefined()
456
-
457
- // <b-tooltip> wrapper
458
- const $tipHolder = wrapper.findComponent(BTooltip)
459
- expect($tipHolder.exists()).toBe(true)
460
-
461
- // Activate tooltip by trigger
462
- await $button.trigger('mouseenter')
463
- await ensureEventEmitted($tipHolder, 'shown')
464
-
465
- expect($button.attributes('id')).toBeDefined()
466
- expect($button.attributes('id')).toEqual('foo')
467
- expect($button.attributes('aria-describedby')).toBeDefined()
468
- // ID of the tooltip that will be in the body
469
- const adb = $button.attributes('aria-describedby')
470
-
471
- // Find the tooltip element in the document
472
- const tip = document.getElementById(adb)
473
- expect(tip).not.toBe(null)
474
- expect(tip).toBeInstanceOf(HTMLElement)
475
- expect(tip.tagName).toEqual('DIV')
476
- expect(tip.classList.contains('tooltip')).toBe(true)
477
- expect(tip.classList.contains('b-tooltip')).toBe(true)
478
-
479
- // Deactivate tooltip by trigger
480
- await $button.trigger('mouseleave', { relatedTarget: document.body })
481
- await ensureEventEmitted($tipHolder, 'hidden')
482
-
483
- // Tooltip element should not be in the document
484
- expect($button.attributes('aria-describedby')).toBeUndefined()
485
- expect(document.body.contains(tip)).toBe(false)
486
- expect(document.getElementById(adb)).toBe(null)
487
- })
488
-
489
- it('disabled tooltip does not open on trigger', async () => {
490
- wrapper = mount(App, {
491
- attachTo: document.body,
492
- propsData: {
493
- triggers: 'click',
494
- show: false,
495
- disabled: true
496
- },
497
- slots: {
498
- default: 'title'
499
- }
500
- })
501
-
502
- expect(wrapper.vm).toBeDefined()
503
- await waitNT(wrapper.vm)
504
- await waitRAF()
505
-
506
- expect(wrapper.element.tagName).toBe('ARTICLE')
507
- expect(wrapper.attributes('id')).toBeDefined()
508
- expect(wrapper.attributes('id')).toEqual('wrapper')
509
-
510
- // The trigger button
511
- const $button = wrapper.find('button')
512
- expect($button.exists()).toBe(true)
513
- expect($button.attributes('id')).toBeDefined()
514
- expect($button.attributes('id')).toEqual('foo')
515
- expect($button.attributes('aria-describedby')).toBeUndefined()
516
-
517
- // b-tooltip wrapper
518
- const $tipHolder = wrapper.findComponent(BTooltip)
519
- expect($tipHolder.exists()).toBe(true)
520
- expect($tipHolder.emitted('enabled')).toBeUndefined()
521
-
522
- // Try to activate tooltip by trigger
523
- await $button.trigger('click')
524
- await waitNT(wrapper.vm)
525
- await waitRAF()
526
-
527
- // Tooltip should not have opened
528
- expect($button.attributes('aria-describedby')).toBeUndefined()
529
- expect($tipHolder.emitted('shown')).toBeUndefined()
530
-
531
- // Now enable the tooltip
532
- await wrapper.setProps({ disabled: false })
533
- expect($tipHolder.emitted('enabled').length).toBe(1)
534
-
535
- // Try to activate tooltip by trigger
536
- await $button.trigger('click')
537
- await ensureEventEmitted($tipHolder, 'shown')
538
-
539
- expect($button.attributes('aria-describedby')).toBeDefined()
540
- const adb = $button.attributes('aria-describedby')
541
-
542
- // Find the tooltip element in the document
543
- const tip = document.getElementById(adb)
544
- expect(tip).not.toBe(null)
545
- expect(tip).toBeInstanceOf(HTMLElement)
546
- expect(tip.tagName).toEqual('DIV')
547
- expect(tip.classList.contains('tooltip')).toBe(true)
548
-
549
- // Now disable the tooltip
550
- expect($tipHolder.emitted('disabled').length).toBe(2)
551
- await wrapper.setProps({ disabled: true })
552
- expect($tipHolder.emitted('disabled').length).toBe(3)
553
- })
554
-
555
- it('closes/opens on instance events', async () => {
556
- wrapper = mount(App, {
557
- attachTo: document.body,
558
- propsData: {
559
- triggers: 'click',
560
- show: true,
561
- disabled: false,
562
- titleAttr: 'ignored'
563
- },
564
- slots: {
565
- default: 'title'
566
- }
567
- })
568
-
569
- expect(wrapper.vm).toBeDefined()
570
- await waitNT(wrapper.vm)
571
- await waitRAF()
572
-
573
- expect(wrapper.element.tagName).toBe('ARTICLE')
574
- expect(wrapper.attributes('id')).toBeDefined()
575
- expect(wrapper.attributes('id')).toEqual('wrapper')
576
-
577
- // The trigger button
578
- const $button = wrapper.find('button')
579
- expect($button.exists()).toBe(true)
580
- const adb = $button.attributes('aria-describedby')
581
-
582
- // <b-tooltip> wrapper
583
- const $tipHolder = wrapper.findComponent(BTooltip)
584
- expect($tipHolder.exists()).toBe(true)
585
-
586
- // Find the tooltip element in the document
587
- const tip = document.getElementById(adb)
588
- expect(tip).not.toBe(null)
589
- expect(tip).toBeInstanceOf(HTMLElement)
590
- expect(tip.tagName).toEqual('DIV')
591
- expect(tip.classList.contains('tooltip')).toBe(true)
592
- expect(tip.classList.contains('b-tooltip')).toBe(true)
593
-
594
- expect($tipHolder.emitted('hidden')).toBeFalsy()
595
- $tipHolder.vm.$emit('close')
596
-
597
- await ensureEventEmitted($tipHolder, 'hidden')
598
- expect($button.attributes('aria-describedby')).toBeUndefined()
599
-
600
- // Tooltip element should not be in the document
601
- expect(document.body.contains(tip)).toBe(false)
602
- expect(document.getElementById(adb)).toBe(null)
603
-
604
- // Show the tooltip by emitting event on instance
605
- $tipHolder.vm.$emit('open')
606
- await ensureEventEmitted($tipHolder, 'shown')
607
-
608
- // Tooltip element should be in the document
609
- expect($button.attributes('aria-describedby')).toBeDefined()
610
- expect(document.getElementById(adb)).not.toBe(null)
611
- })
612
-
613
- it('closes on $root close specific ID event', async () => {
614
- wrapper = mount(App, {
615
- attachTo: document.body,
616
- propsData: {
617
- triggers: 'click',
618
- show: true,
619
- disabled: false,
620
- titleAttr: 'ignored'
621
- },
622
- slots: {
623
- default: 'title'
624
- }
625
- })
626
-
627
- expect(wrapper.vm).toBeDefined()
628
- await waitNT(wrapper.vm)
629
- await waitRAF()
630
-
631
- expect(wrapper.element.tagName).toBe('ARTICLE')
632
- expect(wrapper.attributes('id')).toBeDefined()
633
- expect(wrapper.attributes('id')).toEqual('wrapper')
634
-
635
- // The trigger button
636
- const $button = wrapper.find('button')
637
- expect($button.exists()).toBe(true)
638
- expect($button.attributes('id')).toBeDefined()
639
- expect($button.attributes('id')).toEqual('foo')
640
- expect($button.attributes('title')).toBeDefined()
641
- expect($button.attributes('title')).toEqual('')
642
- expect($button.attributes('data-original-title')).toBeDefined()
643
- expect($button.attributes('data-original-title')).toEqual('ignored')
644
- expect($button.attributes('aria-describedby')).toBeDefined()
645
- // ID of the tooltip that will be in the body
646
- const adb = $button.attributes('aria-describedby')
647
-
648
- // <b-tooltip> wrapper
649
- const $tipHolder = wrapper.findComponent(BTooltip)
650
- expect($tipHolder.exists()).toBe(true)
651
-
652
- // Find the tooltip element in the document
653
- const tip = document.getElementById(adb)
654
- expect(tip).not.toBe(null)
655
- expect(tip).toBeInstanceOf(HTMLElement)
656
- expect(tip.tagName).toEqual('DIV')
657
- expect(tip.classList.contains('tooltip')).toBe(true)
658
- expect(tip.classList.contains('b-tooltip')).toBe(true)
659
-
660
- // Hide the tooltip by emitting root event with correct ID (forceHide)
661
- wrapper.vm.$root.$emit('bv::hide::tooltip', 'foo')
662
- await ensureEventEmitted($tipHolder, 'hidden')
663
-
664
- expect($button.attributes('aria-describedby')).toBeUndefined()
665
-
666
- // Tooltip element should not be in the document
667
- expect(document.body.contains(tip)).toBe(false)
668
- expect(document.getElementById(adb)).toBe(null)
669
- })
670
-
671
- it('does not close on $root close specific other ID event', async () => {
672
- wrapper = mount(App, {
673
- attachTo: document.body,
674
- propsData: {
675
- triggers: 'click',
676
- show: true,
677
- disabled: false,
678
- titleAttr: 'ignored'
679
- },
680
- slots: {
681
- default: 'title'
682
- }
683
- })
684
-
685
- expect(wrapper.vm).toBeDefined()
686
- await waitNT(wrapper.vm)
687
- await waitRAF()
688
-
689
- expect(wrapper.element.tagName).toBe('ARTICLE')
690
- expect(wrapper.attributes('id')).toBeDefined()
691
- expect(wrapper.attributes('id')).toEqual('wrapper')
692
-
693
- // The trigger button
694
- const $button = wrapper.find('button')
695
- expect($button.exists()).toBe(true)
696
- expect($button.attributes('id')).toBeDefined()
697
- expect($button.attributes('id')).toEqual('foo')
698
- expect($button.attributes('title')).toBeDefined()
699
- expect($button.attributes('title')).toEqual('')
700
- expect($button.attributes('data-original-title')).toBeDefined()
701
- expect($button.attributes('data-original-title')).toEqual('ignored')
702
- expect($button.attributes('aria-describedby')).toBeDefined()
703
- // ID of the tooltip that will be in the body
704
- const adb = $button.attributes('aria-describedby')
705
-
706
- // b-tooltip wrapper
707
- const $tipHolder = wrapper.findComponent(BTooltip)
708
- expect($tipHolder.exists()).toBe(true)
709
-
710
- // Find the tooltip element in the document
711
- const tip = document.getElementById(adb)
712
- expect(tip).not.toBe(null)
713
- expect(tip).toBeInstanceOf(HTMLElement)
714
- expect(tip.tagName).toEqual('DIV')
715
- expect(tip.classList.contains('tooltip')).toBe(true)
716
-
717
- // Tooltip should ignore when ID is not its own
718
- wrapper.vm.$root.$emit('bv::hide::tooltip', 'wrong-id')
719
- //TODO: No event in.
720
- await waitNT(wrapper.vm)
721
- await waitRAF()
722
- await waitNT(wrapper.vm)
723
- await waitRAF()
724
- await waitNT(wrapper.vm)
725
- await waitRAF()
726
-
727
- expect($button.attributes('aria-describedby')).toBeDefined()
728
-
729
- // Tooltip element should still be in the document
730
- expect(document.body.contains(tip)).toBe(true)
731
- expect(document.getElementById(adb)).not.toBe(null)
732
- })
733
-
734
- it('closes on $root close all event', async () => {
735
- wrapper = mount(App, {
736
- attachTo: document.body,
737
- propsData: {
738
- triggers: 'click',
739
- show: true,
740
- disabled: false,
741
- titleAttr: 'ignored'
742
- },
743
- slots: {
744
- default: 'title'
745
- }
746
- })
747
-
748
- expect(wrapper.vm).toBeDefined()
749
- await waitNT(wrapper.vm)
750
- await waitRAF()
751
-
752
- expect(wrapper.element.tagName).toBe('ARTICLE')
753
- expect(wrapper.attributes('id')).toBeDefined()
754
- expect(wrapper.attributes('id')).toEqual('wrapper')
755
-
756
- // The trigger button
757
- const $button = wrapper.find('button')
758
- expect($button.exists()).toBe(true)
759
- expect($button.attributes('id')).toBeDefined()
760
- expect($button.attributes('id')).toEqual('foo')
761
- expect($button.attributes('title')).toBeDefined()
762
- expect($button.attributes('title')).toEqual('')
763
- expect($button.attributes('data-original-title')).toBeDefined()
764
- expect($button.attributes('data-original-title')).toEqual('ignored')
765
- expect($button.attributes('aria-describedby')).toBeDefined()
766
-
767
- // ID of the tooltip that will be in the body
768
- const adb = $button.attributes('aria-describedby')
769
-
770
- // <b-tooltip> wrapper
771
- const $tipHolder = wrapper.findComponent(BTooltip)
772
- expect($tipHolder.exists()).toBe(true)
773
-
774
- // Find the tooltip element in the document
775
- const tip = document.getElementById(adb)
776
- expect(tip).not.toBe(null)
777
- expect(tip).toBeInstanceOf(HTMLElement)
778
- expect(tip.tagName).toEqual('DIV')
779
- expect(tip.classList.contains('tooltip')).toBe(true)
780
- expect(tip.classList.contains('b-tooltip')).toBe(true)
781
-
782
- // Hide the tooltip by emitting root event with no ID (forceHide)
783
- wrapper.vm.$root.$emit('bv::hide::tooltip')
784
- await ensureEventEmitted($tipHolder, 'hidden')
785
-
786
- expect($button.attributes('aria-describedby')).toBeUndefined()
787
-
788
- // Tooltip element should not be in the document
789
- expect(document.body.contains(tip)).toBe(false)
790
- expect(document.getElementById(adb)).toBe(null)
791
- })
792
-
793
- it('does not close on $root modal hidden event by default', async () => {
794
- wrapper = mount(App, {
795
- attachTo: document.body,
796
- propsData: {
797
- triggers: 'click',
798
- show: true,
799
- disabled: false,
800
- titleAttr: 'ignored'
801
- },
802
- slots: {
803
- default: 'title'
804
- }
805
- })
806
-
807
- expect(wrapper.vm).toBeDefined()
808
- await waitNT(wrapper.vm)
809
- await waitRAF()
810
-
811
- expect(wrapper.element.tagName).toBe('ARTICLE')
812
- expect(wrapper.attributes('id')).toBeDefined()
813
- expect(wrapper.attributes('id')).toEqual('wrapper')
814
- expect(wrapper.classes()).not.toContain('modal-content')
815
-
816
- // The trigger button
817
- const $button = wrapper.find('button')
818
- expect($button.exists()).toBe(true)
819
- expect($button.attributes('id')).toBeDefined()
820
- expect($button.attributes('id')).toEqual('foo')
821
- expect($button.attributes('title')).toBeDefined()
822
- expect($button.attributes('title')).toEqual('')
823
- expect($button.attributes('data-original-title')).toBeDefined()
824
- expect($button.attributes('data-original-title')).toEqual('ignored')
825
- expect($button.attributes('aria-describedby')).toBeDefined()
826
- // ID of the tooltip that will be in the body
827
- const adb = $button.attributes('aria-describedby')
828
-
829
- // b-tooltip wrapper
830
- const $tipHolder = wrapper.findComponent(BTooltip)
831
- expect($tipHolder.exists()).toBe(true)
832
-
833
- // Find the tooltip element in the document
834
- const tip = document.getElementById(adb)
835
- expect(tip).not.toBe(null)
836
- expect(tip).toBeInstanceOf(HTMLElement)
837
- expect(tip.tagName).toEqual('DIV')
838
- expect(tip.classList.contains('tooltip')).toBe(true)
839
-
840
- // Tooltip should ignore when ID is not its own
841
- wrapper.vm.$root.$emit(MODAL_CLOSE_EVENT, 'some-modal')
842
- await waitNT(wrapper.vm)
843
- await waitRAF()
844
- await waitNT(wrapper.vm)
845
- await waitRAF()
846
- await waitNT(wrapper.vm)
847
- await waitRAF()
848
-
849
- expect($button.attributes('aria-describedby')).toBeDefined()
850
-
851
- // Tooltip element should still be in the document
852
- expect(document.body.contains(tip)).toBe(true)
853
- expect(document.getElementById(adb)).not.toBe(null)
854
- })
855
-
856
- it('closes on $root modal hidden event when inside a modal', async () => {
857
- wrapper = mount(App, {
858
- attachTo: document.body,
859
- propsData: {
860
- triggers: 'click',
861
- show: true,
862
- disabled: false,
863
- titleAttr: 'ignored',
864
- isModal: true
865
- },
866
- slots: {
867
- default: 'title'
868
- }
869
- })
870
-
871
- expect(wrapper.vm).toBeDefined()
872
- await waitNT(wrapper.vm)
873
- await waitRAF()
874
-
875
- expect(wrapper.element.tagName).toBe('ARTICLE')
876
- expect(wrapper.attributes('id')).toBeDefined()
877
- expect(wrapper.attributes('id')).toEqual('wrapper')
878
- expect(wrapper.classes()).toContain('modal-content')
879
-
880
- // The trigger button
881
- const $button = wrapper.find('button')
882
- expect($button.exists()).toBe(true)
883
- expect($button.attributes('id')).toBeDefined()
884
- expect($button.attributes('id')).toEqual('foo')
885
- expect($button.attributes('title')).toBeDefined()
886
- expect($button.attributes('title')).toEqual('')
887
- expect($button.attributes('data-original-title')).toBeDefined()
888
- expect($button.attributes('data-original-title')).toEqual('ignored')
889
- expect($button.attributes('aria-describedby')).toBeDefined()
890
- // ID of the tooltip that will be in the body
891
- const adb = $button.attributes('aria-describedby')
892
-
893
- // b-tooltip wrapper
894
- const $tipHolder = wrapper.findComponent(BTooltip)
895
- expect($tipHolder.exists()).toBe(true)
896
-
897
- // Find the tooltip element in the document
898
- const tip = document.getElementById(adb)
899
- expect(tip).not.toBe(null)
900
- expect(tip).toBeInstanceOf(HTMLElement)
901
- expect(tip.tagName).toEqual('DIV')
902
- expect(tip.classList.contains('tooltip')).toBe(true)
903
-
904
- // Tooltip should ignore when ID is not its own
905
- wrapper.vm.$root.$emit(MODAL_CLOSE_EVENT, 'some-modal')
906
- await ensureEventEmitted($tipHolder, 'hidden')
907
-
908
- // Tooltip element should not be in the document
909
- expect(document.body.contains(tip)).toBe(false)
910
- expect(document.getElementById(adb)).toBe(null)
911
- })
912
-
913
- it('closes when trigger element is no longer visible', async () => {
914
- wrapper = mount(App, {
915
- attachTo: document.body,
916
- propsData: {
917
- triggers: 'click',
918
- show: true,
919
- disabled: false
920
- },
921
- slots: {
922
- default: 'title'
923
- }
924
- })
925
-
926
- expect(wrapper.vm).toBeDefined()
927
- await waitNT(wrapper.vm)
928
- await waitRAF()
929
-
930
- expect(wrapper.element.tagName).toBe('ARTICLE')
931
- expect(wrapper.attributes('id')).toBeDefined()
932
- expect(wrapper.attributes('id')).toEqual('wrapper')
933
-
934
- // The trigger button
935
- const $button = wrapper.find('button')
936
- expect($button.exists()).toBe(true)
937
- expect($button.attributes('id')).toBeDefined()
938
- expect($button.attributes('id')).toEqual('foo')
939
- expect($button.attributes('aria-describedby')).toBeDefined()
940
-
941
- // ID of the tooltip that will be in the body
942
- const adb = $button.attributes('aria-describedby')
943
-
944
- // b-tooltip wrapper
945
- const $tipHolder = wrapper.findComponent(BTooltip)
946
- expect($tipHolder.exists()).toBe(true)
947
-
948
- // Find the tooltip element in the document
949
- const tip = document.getElementById(adb)
950
- expect(tip).not.toBe(null)
951
- expect(tip).toBeInstanceOf(HTMLElement)
952
- expect(tip.tagName).toEqual('DIV')
953
- expect(tip.classList.contains('tooltip')).toBe(true)
954
-
955
- // Hide the tooltip by removing the trigger button from DOM
956
- $button.element.parentNode.removeChild($button.element)
957
- await ensureEventEmitted($tipHolder, 'hidden')
958
-
959
- // Tooltip element should not be in the document
960
- expect(document.body.contains(tip)).toBe(false)
961
- expect(document.getElementById('adb')).toBe(null)
962
-
963
- // Try and show element via root event (using show all)
964
- wrapper.vm.$root.$emit('bv::show::tooltip')
965
- await waitNT(wrapper.vm)
966
- await waitRAF()
967
- await waitNT(wrapper.vm)
968
- await waitRAF()
969
- await waitNT(wrapper.vm)
970
- await waitRAF()
971
- await waitNT(wrapper.vm)
972
- await waitRAF()
973
-
974
- // Tooltip element should not be in the document
975
- expect(document.getElementById(adb)).toBe(null)
976
- })
977
-
978
- it('closes when title is set to empty', async () => {
979
- wrapper = mount(App, {
980
- attachTo: document.body,
981
- propsData: {
982
- show: true,
983
- title: 'hello'
984
- }
985
- })
986
-
987
- expect(wrapper.vm).toBeDefined()
988
- await waitNT(wrapper.vm)
989
- await waitRAF()
990
-
991
- expect(wrapper.element.tagName).toBe('ARTICLE')
992
- expect(wrapper.attributes('id')).toBeDefined()
993
- expect(wrapper.attributes('id')).toEqual('wrapper')
994
-
995
- // The trigger button
996
- const $button = wrapper.find('button')
997
- expect($button.exists()).toBe(true)
998
- expect($button.attributes('id')).toBeDefined()
999
- expect($button.attributes('id')).toEqual('foo')
1000
- expect($button.attributes('title')).toBeUndefined()
1001
- expect($button.attributes('data-original-title')).toBeUndefined()
1002
- expect($button.attributes('aria-describedby')).toBeDefined()
1003
- // ID of the tooltip that will be in the body
1004
- const adb = $button.attributes('aria-describedby')
1005
-
1006
- // <b-tooltip> wrapper
1007
- const $tipHolder = wrapper.findComponent(BTooltip)
1008
- expect($tipHolder.exists()).toBe(true)
1009
- expect($tipHolder.element.nodeType).toEqual(Node.COMMENT_NODE)
1010
-
1011
- // Find the tooltip element in the document
1012
- const tip = document.getElementById(adb)
1013
- expect(tip).not.toBe(null)
1014
- expect(tip).toBeInstanceOf(HTMLElement)
1015
- const $tip = createWrapper(tip)
1016
- expect($tip.element.tagName).toBe('DIV')
1017
- expect($tip.classes()).toContain('tooltip')
1018
- expect($tip.classes()).toContain('b-tooltip')
1019
- // Should contain our title prop value
1020
- expect($tip.text()).toContain('hello')
1021
-
1022
- // Change the title prop
1023
- await wrapper.setProps({ title: '' })
1024
- await ensureEventEmitted($tipHolder, 'hidden')
1025
-
1026
- // Tooltip element should not be in the document
1027
- expect(document.body.contains(tip)).toBe(false)
1028
- expect(document.getElementById('adb')).toBe(null)
1029
- })
1030
-
1031
- it('applies noninteractive class based on noninteractive prop', async () => {
1032
- wrapper = mount(App, {
1033
- attachTo: document.body,
1034
- propsData: {
1035
- show: true
1036
- },
1037
- slots: {
1038
- default: 'title'
1039
- }
1040
- })
1041
-
1042
- expect(wrapper.vm).toBeDefined()
1043
- await waitNT(wrapper.vm)
1044
- await waitRAF()
1045
-
1046
- expect(wrapper.element.tagName).toBe('ARTICLE')
1047
- expect(wrapper.attributes('id')).toBeDefined()
1048
- expect(wrapper.attributes('id')).toEqual('wrapper')
1049
-
1050
- // The trigger button
1051
- const $button = wrapper.find('button')
1052
- expect($button.exists()).toBe(true)
1053
-
1054
- // ID of the tooltip that will be in the body
1055
- const adb = $button.attributes('aria-describedby')
1056
- expect(adb).toBeDefined()
1057
- expect(adb).not.toBe('')
1058
- expect(adb).not.toBe(null)
1059
-
1060
- // Find the tooltip element in the document
1061
- const tip = document.getElementById(adb)
1062
- expect(tip).not.toBe(null)
1063
- expect(tip).toBeInstanceOf(HTMLElement)
1064
- expect(tip.tagName).toEqual('DIV')
1065
- expect(tip.classList.contains('tooltip')).toBe(true)
1066
- expect(tip.classList.contains('b-tooltip')).toBe(true)
1067
- expect(tip.classList.contains('noninteractive')).toBe(false)
1068
-
1069
- // Enable 'noninteractive'. Should be reactive
1070
- await wrapper.setProps({ noninteractive: true })
1071
- await waitNT(wrapper.vm)
1072
- expect(tip.classList.contains('tooltip')).toBe(true)
1073
- expect(tip.classList.contains('b-tooltip')).toBe(true)
1074
- expect(tip.classList.contains('noninteractive')).toBe(true)
1075
- })
1076
-
1077
- it('applies variant class', async () => {
1078
- wrapper = mount(App, {
1079
- attachTo: document.body,
1080
- propsData: {
1081
- show: true,
1082
- variant: 'danger'
1083
- },
1084
- slots: {
1085
- default: 'title'
1086
- }
1087
- })
1088
-
1089
- expect(wrapper.vm).toBeDefined()
1090
- await waitNT(wrapper.vm)
1091
- await waitRAF()
1092
-
1093
- expect(wrapper.element.tagName).toBe('ARTICLE')
1094
- expect(wrapper.attributes('id')).toBeDefined()
1095
- expect(wrapper.attributes('id')).toEqual('wrapper')
1096
-
1097
- // The trigger button
1098
- const $button = wrapper.find('button')
1099
- expect($button.exists()).toBe(true)
1100
-
1101
- // ID of the tooltip that will be in the body
1102
- const adb = $button.attributes('aria-describedby')
1103
- expect(adb).not.toBe(null)
1104
-
1105
- // Find the tooltip element in the document
1106
- const tip = document.getElementById(adb)
1107
- expect(tip).not.toBe(null)
1108
- expect(tip).toBeInstanceOf(HTMLElement)
1109
- expect(tip.tagName).toEqual('DIV')
1110
- expect(tip.classList.contains('tooltip')).toBe(true)
1111
- expect(tip.classList.contains('b-tooltip-danger')).toBe(true)
1112
-
1113
- // Change variant type. Should be reactive
1114
- await wrapper.setProps({ variant: 'success' })
1115
- await waitNT(wrapper.vm)
1116
-
1117
- expect(tip.classList.contains('tooltip')).toBe(true)
1118
- expect(tip.classList.contains('b-tooltip-success')).toBe(true)
1119
- expect(tip.classList.contains('b-tooltip-danger')).toBe(false)
1120
- })
1121
-
1122
- it('applies custom class', async () => {
1123
- wrapper = mount(App, {
1124
- attachTo: document.body,
1125
- propsData: {
1126
- show: true,
1127
- customClass: 'foobar-class'
1128
- },
1129
- slots: {
1130
- default: 'title'
1131
- }
1132
- })
1133
-
1134
- expect(wrapper.vm).toBeDefined()
1135
- await waitNT(wrapper.vm)
1136
- await waitRAF()
1137
-
1138
- expect(wrapper.element.tagName).toBe('ARTICLE')
1139
- expect(wrapper.attributes('id')).toBeDefined()
1140
- expect(wrapper.attributes('id')).toEqual('wrapper')
1141
-
1142
- // The trigger button
1143
- const $button = wrapper.find('button')
1144
- expect($button.exists()).toBe(true)
1145
-
1146
- // ID of the tooltip that will be in the body
1147
- const adb = $button.attributes('aria-describedby')
1148
- expect(adb).toBeDefined()
1149
- expect(adb).not.toBe('')
1150
- expect(adb).not.toBe(null)
1151
-
1152
- // Find the tooltip element in the document
1153
- const tip = document.getElementById(adb)
1154
- expect(tip).not.toBe(null)
1155
- expect(tip).toBeInstanceOf(HTMLElement)
1156
- expect(tip.tagName).toEqual('DIV')
1157
- expect(tip.classList.contains('tooltip')).toBe(true)
1158
- expect(tip.classList.contains('b-tooltip')).toBe(true)
1159
- expect(tip.classList.contains('foobar-class')).toBe(true)
1160
-
1161
- // Change custom class. Should be reactive
1162
- await wrapper.setProps({ customClass: 'barbaz-class' })
1163
- await waitNT(wrapper.vm)
1164
- expect(tip.classList.contains('tooltip')).toBe(true)
1165
- expect(tip.classList.contains('barbaz-class')).toBe(true)
1166
- expect(tip.classList.contains('foobar-class')).toBe(false)
1167
- })
1168
-
1169
- it('saves title in data attribute on open and adds to back on hide', async () => {
1170
- wrapper = mount(App, {
1171
- attachTo: document.body,
1172
- propsData: {
1173
- triggers: 'click',
1174
- show: false,
1175
- titleAttr: 'bar'
1176
- },
1177
- slots: {
1178
- default: 'title'
1179
- }
1180
- })
1181
-
1182
- expect(wrapper.vm).toBeDefined()
1183
- await waitNT(wrapper.vm)
1184
- await waitRAF()
1185
-
1186
- expect(wrapper.element.tagName).toBe('ARTICLE')
1187
- expect(wrapper.attributes('id')).toBeDefined()
1188
- expect(wrapper.attributes('id')).toEqual('wrapper')
1189
-
1190
- // The trigger button
1191
- const $button = wrapper.find('button')
1192
- expect($button.exists()).toBe(true)
1193
- expect($button.attributes('id')).toBeDefined()
1194
- expect($button.attributes('id')).toEqual('foo')
1195
- expect($button.attributes('title')).toBeDefined()
1196
- expect($button.attributes('title')).toEqual('bar')
1197
- expect($button.attributes('data-original-title')).toBeUndefined()
1198
- expect($button.attributes('aria-describedby')).toBeUndefined()
1199
-
1200
- // <b-tooltip> wrapper
1201
- const $tipHolder = wrapper.findComponent(BTooltip)
1202
- expect($tipHolder.exists()).toBe(true)
1203
- expect($tipHolder.element.nodeType).toEqual(Node.COMMENT_NODE)
1204
-
1205
- // Show tooltip
1206
- await wrapper.setProps({ show: true })
1207
- await ensureEventEmitted($tipHolder, 'shown')
1208
-
1209
- expect($button.attributes('title')).toBeDefined()
1210
- expect($button.attributes('title')).toEqual('')
1211
- expect($button.attributes('data-original-title')).toBeDefined()
1212
- expect($button.attributes('data-original-title')).toEqual('bar')
1213
- expect($button.attributes('aria-describedby')).toBeDefined()
1214
- // ID of the tooltip that will be in the body
1215
- const adb = $button.attributes('aria-describedby')
1216
-
1217
- // Find the tooltip element in the document
1218
- const tip = document.getElementById(adb)
1219
- expect(tip).not.toBe(null)
1220
- expect(tip).toBeInstanceOf(HTMLElement)
1221
- expect(tip.tagName).toEqual('DIV')
1222
- expect(tip.classList.contains('tooltip')).toBe(true)
1223
- expect(tip.classList.contains('b-tooltip')).toBe(true)
1224
- expect(tip.classList.contains('interactive')).toBe(false)
1225
- expect(tip.textContent).toEqual('title')
1226
-
1227
- // Hide the tooltip
1228
- await wrapper.setProps({ show: false })
1229
- await ensureEventEmitted($tipHolder, 'hidden')
1230
-
1231
- expect($button.attributes('title')).toBeDefined()
1232
- expect($button.attributes('title')).toEqual('bar')
1233
- expect($button.attributes('data-original-title')).toBeUndefined()
1234
- expect($button.attributes('aria-describedby')).toBeUndefined()
1235
-
1236
- // Tooltip element should not be in the document
1237
- expect(document.body.contains(tip)).toBe(false)
1238
- expect(document.querySelector(adb)).toBe(null)
1239
- })
1240
- })