@gitlab/ui 114.0.1 → 114.1.1
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.
- package/package.json +9 -28
- package/CHANGELOG.md +0 -13132
- package/src/vendor/bootstrap/LICENSE +0 -11
- package/src/vendor/bootstrap-vue/LICENSE +0 -11
- package/src/vendor/bootstrap-vue/package.json +0 -144
- package/src/vendor/bootstrap-vue/src/components/button/MODIFICATIONS.md +0 -16
- package/src/vendor/bootstrap-vue/src/components/button/README.md +0 -240
- package/src/vendor/bootstrap-vue/src/components/button/button-close.spec.js +0 -210
- package/src/vendor/bootstrap-vue/src/components/button/button.spec.js +0 -349
- package/src/vendor/bootstrap-vue/src/components/button/package.json +0 -105
- package/src/vendor/bootstrap-vue/src/components/dropdown/README.md +0 -730
- package/src/vendor/bootstrap-vue/src/components/dropdown/dropdown-divider.spec.js +0 -58
- package/src/vendor/bootstrap-vue/src/components/dropdown/dropdown-form.spec.js +0 -110
- package/src/vendor/bootstrap-vue/src/components/dropdown/dropdown-group.spec.js +0 -94
- package/src/vendor/bootstrap-vue/src/components/dropdown/dropdown-header.spec.js +0 -73
- package/src/vendor/bootstrap-vue/src/components/dropdown/dropdown-item-button.spec.js +0 -117
- package/src/vendor/bootstrap-vue/src/components/dropdown/dropdown-item.spec.js +0 -147
- package/src/vendor/bootstrap-vue/src/components/dropdown/dropdown-text.spec.js +0 -59
- package/src/vendor/bootstrap-vue/src/components/dropdown/dropdown.spec.js +0 -1121
- package/src/vendor/bootstrap-vue/src/components/dropdown/package.json +0 -368
- package/src/vendor/bootstrap-vue/src/components/form/README.md +0 -365
- package/src/vendor/bootstrap-vue/src/components/form/form-invalid-feedback.spec.js +0 -170
- package/src/vendor/bootstrap-vue/src/components/form/form-text.spec.js +0 -93
- package/src/vendor/bootstrap-vue/src/components/form/form-valid-feedback.spec.js +0 -157
- package/src/vendor/bootstrap-vue/src/components/form/form.spec.js +0 -97
- package/src/vendor/bootstrap-vue/src/components/form/package.json +0 -112
- package/src/vendor/bootstrap-vue/src/components/form-checkbox/README.md +0 -691
- package/src/vendor/bootstrap-vue/src/components/form-checkbox/form-checkbox-group.spec.js +0 -525
- package/src/vendor/bootstrap-vue/src/components/form-checkbox/form-checkbox.spec.js +0 -922
- package/src/vendor/bootstrap-vue/src/components/form-checkbox/package.json +0 -172
- package/src/vendor/bootstrap-vue/src/components/form-group/README.md +0 -339
- package/src/vendor/bootstrap-vue/src/components/form-group/form-group.spec.js +0 -477
- package/src/vendor/bootstrap-vue/src/components/form-group/package.json +0 -183
- package/src/vendor/bootstrap-vue/src/components/form-radio/README.md +0 -437
- package/src/vendor/bootstrap-vue/src/components/form-radio/form-radio-group.spec.js +0 -357
- package/src/vendor/bootstrap-vue/src/components/form-radio/form-radio.spec.js +0 -587
- package/src/vendor/bootstrap-vue/src/components/form-radio/package.json +0 -162
- package/src/vendor/bootstrap-vue/src/components/form-select/README.md +0 -504
- package/src/vendor/bootstrap-vue/src/components/form-select/form-select-option-group.spec.js +0 -138
- package/src/vendor/bootstrap-vue/src/components/form-select/form-select-option.spec.js +0 -75
- package/src/vendor/bootstrap-vue/src/components/form-select/form-select.spec.js +0 -723
- package/src/vendor/bootstrap-vue/src/components/form-select/package.json +0 -132
- package/src/vendor/bootstrap-vue/src/components/form-textarea/README.md +0 -453
- package/src/vendor/bootstrap-vue/src/components/form-textarea/form-textarea.spec.js +0 -1000
- package/src/vendor/bootstrap-vue/src/components/form-textarea/package.json +0 -122
- package/src/vendor/bootstrap-vue/src/components/layout/README.md +0 -791
- package/src/vendor/bootstrap-vue/src/components/layout/col.spec.js +0 -192
- package/src/vendor/bootstrap-vue/src/components/layout/form-row.spec.js +0 -45
- package/src/vendor/bootstrap-vue/src/components/layout/package.json +0 -99
- package/src/vendor/bootstrap-vue/src/components/link/README.md +0 -76
- package/src/vendor/bootstrap-vue/src/components/link/link.spec.js +0 -434
- package/src/vendor/bootstrap-vue/src/components/link/package.json +0 -57
- package/src/vendor/bootstrap-vue/src/components/modal/MODIFICATIONS.md +0 -30
- package/src/vendor/bootstrap-vue/src/components/modal/README.md +0 -1067
- package/src/vendor/bootstrap-vue/src/components/modal/helpers/bv-modal-event.class.spec.js +0 -82
- package/src/vendor/bootstrap-vue/src/components/modal/modal.spec.js +0 -1418
- package/src/vendor/bootstrap-vue/src/components/modal/package.json +0 -544
- package/src/vendor/bootstrap-vue/src/components/nav/README.md +0 -362
- package/src/vendor/bootstrap-vue/src/components/nav/nav-item.spec.js +0 -127
- package/src/vendor/bootstrap-vue/src/components/nav/nav.spec.js +0 -177
- package/src/vendor/bootstrap-vue/src/components/nav/package.json +0 -73
- package/src/vendor/bootstrap-vue/src/components/popover/README.md +0 -919
- package/src/vendor/bootstrap-vue/src/components/popover/package.json +0 -261
- package/src/vendor/bootstrap-vue/src/components/popover/popover.spec.js +0 -198
- package/src/vendor/bootstrap-vue/src/components/table/README.md +0 -3157
- package/src/vendor/bootstrap-vue/src/components/table/helpers/default-sort-compare.spec.js +0 -112
- package/src/vendor/bootstrap-vue/src/components/table/helpers/normalize-fields.spec.js +0 -93
- package/src/vendor/bootstrap-vue/src/components/table/package.json +0 -1763
- package/src/vendor/bootstrap-vue/src/components/table/table-busy.spec.js +0 -150
- package/src/vendor/bootstrap-vue/src/components/table/table-caption.spec.js +0 -176
- package/src/vendor/bootstrap-vue/src/components/table/table-colgroup.spec.js +0 -81
- package/src/vendor/bootstrap-vue/src/components/table/table-filtering.spec.js +0 -409
- package/src/vendor/bootstrap-vue/src/components/table/table-item-formatter.spec.js +0 -56
- package/src/vendor/bootstrap-vue/src/components/table/table-lite.spec.js +0 -682
- package/src/vendor/bootstrap-vue/src/components/table/table-pagination.spec.js +0 -133
- package/src/vendor/bootstrap-vue/src/components/table/table-primarykey.spec.js +0 -83
- package/src/vendor/bootstrap-vue/src/components/table/table-provider.spec.js +0 -411
- package/src/vendor/bootstrap-vue/src/components/table/table-row-details.spec.js +0 -459
- package/src/vendor/bootstrap-vue/src/components/table/table-selectable.spec.js +0 -1182
- package/src/vendor/bootstrap-vue/src/components/table/table-simple.spec.js +0 -206
- package/src/vendor/bootstrap-vue/src/components/table/table-sorting.spec.js +0 -858
- package/src/vendor/bootstrap-vue/src/components/table/table-sticky-column.spec.js +0 -377
- package/src/vendor/bootstrap-vue/src/components/table/table-tbody-bottom-row.spec.js +0 -94
- package/src/vendor/bootstrap-vue/src/components/table/table-tbody-row-events.spec.js +0 -529
- package/src/vendor/bootstrap-vue/src/components/table/table-tbody-top-row.spec.js +0 -88
- package/src/vendor/bootstrap-vue/src/components/table/table-tbody-transition.spec.js +0 -83
- package/src/vendor/bootstrap-vue/src/components/table/table-tfoot-custom.spec.js +0 -91
- package/src/vendor/bootstrap-vue/src/components/table/table-tfoot-events.spec.js +0 -137
- package/src/vendor/bootstrap-vue/src/components/table/table-thead-events.spec.js +0 -155
- package/src/vendor/bootstrap-vue/src/components/table/table-thead-top.spec.js +0 -96
- package/src/vendor/bootstrap-vue/src/components/table/table.spec.js +0 -692
- package/src/vendor/bootstrap-vue/src/components/tabs/README.md +0 -433
- package/src/vendor/bootstrap-vue/src/components/tabs/package.json +0 -205
- package/src/vendor/bootstrap-vue/src/components/tabs/tab.spec.js +0 -330
- package/src/vendor/bootstrap-vue/src/components/tabs/tabs.spec.js +0 -778
- package/src/vendor/bootstrap-vue/src/components/toast/README.md +0 -655
- package/src/vendor/bootstrap-vue/src/components/toast/helpers/bv-toast.spec.js +0 -117
- package/src/vendor/bootstrap-vue/src/components/toast/package.json +0 -184
- package/src/vendor/bootstrap-vue/src/components/toast/toast.spec.js +0 -294
- package/src/vendor/bootstrap-vue/src/components/toast/toaster.spec.js +0 -77
- package/src/vendor/bootstrap-vue/src/components/tooltip/README.md +0 -559
- package/src/vendor/bootstrap-vue/src/components/tooltip/package.json +0 -258
- package/src/vendor/bootstrap-vue/src/components/tooltip/tooltip.spec.js +0 -1240
- package/src/vendor/bootstrap-vue/src/components/transition/package.json +0 -5
- package/src/vendor/bootstrap-vue/src/components/transporter/package.json +0 -5
- package/src/vendor/bootstrap-vue/src/components/transporter/transporter.spec.js +0 -85
- package/src/vendor/bootstrap-vue/src/directives/modal/modal.spec.js +0 -191
- package/src/vendor/bootstrap-vue/src/directives/tooltip/README.md +0 -521
- package/src/vendor/bootstrap-vue/src/directives/tooltip/package.json +0 -131
- package/src/vendor/bootstrap-vue/src/directives/tooltip/tooltip.spec.js +0 -190
- package/src/vendor/bootstrap-vue/src/directives/visible/README.md +0 -244
- package/src/vendor/bootstrap-vue/src/directives/visible/package.json +0 -24
- package/src/vendor/bootstrap-vue/src/mixins/attrs.spec.js +0 -194
- package/src/vendor/bootstrap-vue/src/mixins/click-out.spec.js +0 -52
- package/src/vendor/bootstrap-vue/src/mixins/focus-in.spec.js +0 -53
- package/src/vendor/bootstrap-vue/src/mixins/listen-on-document.spec.js +0 -117
- package/src/vendor/bootstrap-vue/src/mixins/listen-on-root.spec.js +0 -77
- package/src/vendor/bootstrap-vue/src/mixins/listen-on-window.spec.js +0 -115
- package/src/vendor/bootstrap-vue/src/mixins/listeners.spec.js +0 -245
- package/src/vendor/bootstrap-vue/src/utils/bv-event.class.spec.js +0 -66
- package/src/vendor/bootstrap-vue/src/utils/clone-deep.spec.js +0 -70
- package/src/vendor/bootstrap-vue/src/utils/config.spec.js +0 -169
- package/src/vendor/bootstrap-vue/src/utils/css-escape.spec.js +0 -82
- package/src/vendor/bootstrap-vue/src/utils/dom.spec.js +0 -291
- package/src/vendor/bootstrap-vue/src/utils/events.spec.js +0 -41
- package/src/vendor/bootstrap-vue/src/utils/get.spec.js +0 -109
- package/src/vendor/bootstrap-vue/src/utils/inspect.spec.js +0 -251
- package/src/vendor/bootstrap-vue/src/utils/loose-equal.spec.js +0 -203
- package/src/vendor/bootstrap-vue/src/utils/normalize-slot.spec.js +0 -63
- package/src/vendor/bootstrap-vue/src/utils/number.spec.js +0 -72
- package/src/vendor/bootstrap-vue/src/utils/object.spec.js +0 -61
- package/src/vendor/bootstrap-vue/src/utils/props.spec.js +0 -112
- package/src/vendor/bootstrap-vue/src/utils/router.spec.js +0 -248
- package/src/vendor/bootstrap-vue/src/utils/string.spec.js +0 -65
- package/src/vendor/bootstrap-vue/src/utils/stringify-object-values.spec.js +0 -47
- 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
|
-
})
|