@@ -11,10 +11,11 @@ const fields = [
11 11
]
12 12 13 13
describe('table > sticky columns', () => {
14 -
it('has expected classes when sticky column is enabled', async () => {
14 +
it('has expected classes when sticky column is enabled and responsive', async () => {
15 15
const wrapper = mount(BTable, {
16 16
propsData: {
17 17
responsive: true,
18 +
footClone: true,
18 19
items: items,
19 20
fields: fields
20 21
}
@@ -24,14 +25,102 @@ describe('table > sticky columns', () => {
24 25
expect(wrapper.is(BTable)).toBe(true)
25 26
expect(wrapper.is('div')).toBe(true)
26 27
expect(wrapper.classes()).toContain('table-responsive')
28 +
expect(wrapper.classes()).not.toContain('b-table-sticky-header')
27 29
const table = wrapper.find('table')
28 30
expect(table.classes()).toContain('table')
29 31
expect(table.classes()).toContain('b-table')
30 32 31 -
const trs = wrapper.findAll('tbody > tr')
33 +
// Body
34 +
let trs = wrapper.findAll('tbody > tr')
32 35
expect(trs.length).toBe(2)
36 +
let cells = trs.at(0).findAll('th, td')
37 +
expect(cells.length).toBe(3)
38 + 39 +
// First column should be BTh with sticky classes
40 +
expect(cells.at(0).is(BTh)).toBe(true)
41 +
expect(cells.at(0).is('th')).toBe(true)
42 +
expect(cells.at(0).classes()).toContain('b-table-sticky-column')
43 + 44 +
// Second column should be BTd with sticky classes
45 +
expect(cells.at(1).is(BTd)).toBe(true)
46 +
expect(cells.at(1).is('td')).toBe(true)
47 +
expect(cells.at(1).classes()).toContain('b-table-sticky-column')
48 + 49 +
// Third column should be td
50 +
expect(cells.at(2).is(BTd)).toBe(false)
51 +
expect(cells.at(2).is(BTh)).toBe(false)
52 +
expect(cells.at(2).is('td')).toBe(true)
53 +
expect(cells.at(2).classes()).not.toContain('b-table-sticky-column')
54 + 55 +
// Header cells
56 +
trs = wrapper.findAll('thead > tr')
57 +
expect(trs.length).toBe(1)
58 +
cells = trs.at(0).findAll('th')
59 +
expect(cells.length).toBe(3)
60 + 61 +
// First column should be BTh with sticky classes
62 +
expect(cells.at(0).is(BTh)).toBe(true)
63 +
expect(cells.at(0).is('th')).toBe(true)
64 +
expect(cells.at(0).classes()).toContain('b-table-sticky-column')
65 + 66 +
// Second column should be BTh with sticky classes
67 +
expect(cells.at(1).is(BTh)).toBe(true)
68 +
expect(cells.at(1).is('th')).toBe(true)
69 +
expect(cells.at(1).classes()).toContain('b-table-sticky-column')
70 + 71 +
// Third column should be BTh
72 +
expect(cells.at(2).is(BTh)).toBe(true)
73 +
expect(cells.at(2).is('th')).toBe(true)
74 +
expect(cells.at(2).classes()).not.toContain('b-table-sticky-column')
75 + 76 +
// Footer cells
77 +
trs = wrapper.findAll('tfoot > tr')
78 +
expect(trs.length).toBe(1)
79 +
cells = trs.at(0).findAll('th')
80 +
expect(cells.length).toBe(3)
81 + 82 +
// First column should be BTh with sticky classes
83 +
expect(cells.at(0).is(BTh)).toBe(true)
84 +
expect(cells.at(0).is('th')).toBe(true)
85 +
expect(cells.at(0).classes()).toContain('b-table-sticky-column')
86 + 87 +
// Second column should be BTh with sticky classes
88 +
expect(cells.at(1).is(BTh)).toBe(true)
89 +
expect(cells.at(1).is('th')).toBe(true)
90 +
expect(cells.at(1).classes()).toContain('b-table-sticky-column')
91 + 92 +
// Third column should be BTh
93 +
expect(cells.at(2).is(BTh)).toBe(true)
94 +
expect(cells.at(2).is('th')).toBe(true)
95 +
expect(cells.at(2).classes()).not.toContain('b-table-sticky-column')
33 96 34 -
const cells = trs.at(0).findAll('th, td')
97 +
wrapper.destroy()
98 +
})
99 + 100 +
it('has expected classes when sticky column is enabled with sticky headers', async () => {
101 +
const wrapper = mount(BTable, {
102 +
propsData: {
103 +
responsive: false,
104 +
stickyHeader: true,
105 +
footClone: true,
106 +
items: items,
107 +
fields: fields
108 +
}
109 +
})
110 + 111 +
expect(wrapper).toBeDefined()
112 +
expect(wrapper.is(BTable)).toBe(true)
113 +
expect(wrapper.is('div')).toBe(true)
114 +
expect(wrapper.classes()).not.toContain('table-responsive')
115 +
expect(wrapper.classes()).toContain('b-table-sticky-header')
116 +
const table = wrapper.find('table')
117 +
expect(table.classes()).toContain('table')
118 +
expect(table.classes()).toContain('b-table')
119 + 120 +
// Tbody cells
121 +
let trs = wrapper.findAll('tbody > tr')
122 +
expect(trs.length).toBe(2)
123 +
let cells = trs.at(0).findAll('th, td')
35 124
expect(cells.length).toBe(3)
36 125 37 126
// First column should be BTh with sticky classes
@@ -50,6 +139,134 @@ describe('table > sticky columns', () => {
50 139
expect(cells.at(2).is('td')).toBe(true)
51 140
expect(cells.at(2).classes()).not.toContain('b-table-sticky-column')
52 141 142 +
// Header cells
143 +
trs = wrapper.findAll('thead > tr')
144 +
expect(trs.length).toBe(1)
145 +
cells = trs.at(0).findAll('th')
146 +
expect(cells.length).toBe(3)
147 + 148 +
// First column should be BTh with sticky classes
149 +
expect(cells.at(0).is(BTh)).toBe(true)
150 +
expect(cells.at(0).is('th')).toBe(true)
151 +
expect(cells.at(0).classes()).toContain('b-table-sticky-column')
152 + 153 +
// Second column should be BTh with sticky classes
154 +
expect(cells.at(1).is(BTh)).toBe(true)
155 +
expect(cells.at(1).is('th')).toBe(true)
156 +
expect(cells.at(1).classes()).toContain('b-table-sticky-column')
157 + 158 +
// Third column should be BTh
159 +
expect(cells.at(2).is(BTh)).toBe(true)
160 +
expect(cells.at(2).is('th')).toBe(true)
161 +
expect(cells.at(2).classes()).not.toContain('b-table-sticky-column')
162 + 163 +
// Footer cells
164 +
trs = wrapper.findAll('tfoot > tr')
165 +
expect(trs.length).toBe(1)
166 + 167 +
cells = trs.at(0).findAll('th')
168 +
expect(cells.length).toBe(3)
169 + 170 +
// First column should be BTh with sticky classes
171 +
expect(cells.at(0).is(BTh)).toBe(true)
172 +
expect(cells.at(0).is('th')).toBe(true)
173 +
expect(cells.at(0).classes()).toContain('b-table-sticky-column')
174 + 175 +
// Second column should be BTh with sticky classes
176 +
expect(cells.at(1).is(BTh)).toBe(true)
177 +
expect(cells.at(1).is('th')).toBe(true)
178 +
expect(cells.at(1).classes()).toContain('b-table-sticky-column')
179 + 180 +
// Third column should be BTh
181 +
expect(cells.at(2).is(BTh)).toBe(true)
182 +
expect(cells.at(2).is('th')).toBe(true)
183 +
expect(cells.at(2).classes()).not.toContain('b-table-sticky-column')
184 + 185 +
wrapper.destroy()
186 +
})
187 + 188 +
it('does not have sticky classes when sticky column is enabled and not responsive and no sticky header', async () => {
189 +
const wrapper = mount(BTable, {
190 +
propsData: {
191 +
responsive: false,
192 +
stickyHeader: false,
193 +
footClone: true,
194 +
items: items,
195 +
fields: fields
196 +
}
197 +
})
198 + 199 +
expect(wrapper).toBeDefined()
200 +
expect(wrapper.is(BTable)).toBe(true)
201 +
expect(wrapper.is('table')).toBe(true)
202 +
expect(wrapper.classes()).not.toContain('table-responsive')
203 +
expect(wrapper.classes()).not.toContain('b-table-sticky-header')
204 +
expect(wrapper.classes()).toContain('table')
205 +
expect(wrapper.classes()).toContain('b-table')
206 + 207 +
// Body
208 +
let trs = wrapper.findAll('tbody > tr')
209 +
expect(trs.length).toBe(2)
210 +
let cells = trs.at(0).findAll('th, td')
211 +
expect(cells.length).toBe(3)
212 + 213 +
// First column should be th
214 +
expect(cells.at(0).is(BTh)).toBe(false)
215 +
expect(cells.at(0).is('th')).toBe(true)
216 +
expect(cells.at(0).classes()).not.toContain('b-table-sticky-column')
217 + 218 +
// Second column should be td
219 +
expect(cells.at(1).is(BTd)).toBe(false)
220 +
expect(cells.at(1).is('td')).toBe(true)
221 +
expect(cells.at(1).classes()).not.toContain('b-table-sticky-column')
222 + 223 +
// Third column should be td
224 +
expect(cells.at(2).is(BTd)).toBe(false)
225 +
expect(cells.at(2).is('td')).toBe(true)
226 +
expect(cells.at(2).classes()).not.toContain('b-table-sticky-column')
227 + 228 +
// Header cells
229 +
trs = wrapper.findAll('thead > tr')
230 +
expect(trs.length).toBe(1)
231 +
cells = trs.at(0).findAll('th')
232 +
expect(cells.length).toBe(3)
233 + 234 +
// First column should be BTh with sticky classes
235 +
expect(cells.at(0).is(BTh)).toBe(true)
236 +
expect(cells.at(0).is('th')).toBe(true)
237 +
expect(cells.at(0).classes()).not.toContain('b-table-sticky-column')
238 + 239 +
// Second column should be BTh with sticky classes
240 +
expect(cells.at(1).is(BTh)).toBe(true)
241 +
expect(cells.at(1).is('th')).toBe(true)
242 +
expect(cells.at(1).classes()).not.toContain('b-table-sticky-column')
243 + 244 +
// Third column should be BTh
245 +
expect(cells.at(2).is(BTh)).toBe(true)
246 +
expect(cells.at(2).is('th')).toBe(true)
247 +
expect(cells.at(2).classes()).not.toContain('b-table-sticky-column')
248 + 249 +
// Footer cells
250 +
trs = wrapper.findAll('tfoot > tr')
251 +
expect(trs.length).toBe(1)
252 +
cells = trs.at(0).findAll('th')
253 +
expect(cells.length).toBe(3)
254 + 255 +
// First column should be BTh with sticky classes
256 +
expect(cells.at(0).is(BTh)).toBe(true)
257 +
expect(cells.at(0).is('th')).toBe(true)
258 +
expect(cells.at(0).classes()).not.toContain('b-table-sticky-column')
259 + 260 +
// Second column should be BTh with sticky classes
261 +
expect(cells.at(1).is(BTh)).toBe(true)
262 +
expect(cells.at(1).is('th')).toBe(true)
263 +
expect(cells.at(1).classes()).not.toContain('b-table-sticky-column')
264 + 265 +
// Third column should be BTh
266 +
expect(cells.at(2).is(BTh)).toBe(true)
267 +
expect(cells.at(2).is('th')).toBe(true)
268 +
expect(cells.at(2).classes()).not.toContain('b-table-sticky-column')
269 + 53 270
wrapper.destroy()
54 271
})
55 272
})
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4