+58
-12
lines changedFilter options
+58
-12
lines changed Original file line number Diff line number Diff line change
@@ -12,12 +12,15 @@ import { isArray, isNumber } from '../../../utils/inspect'
12 12
import { looseEqual } from '../../../utils/loose-equal'
13 13
import { mathMax, mathMin } from '../../../utils/math'
14 14
import { makeProp } from '../../../utils/props'
15 +
import { toString } from '../../../utils/string'
15 16
import { sanitizeRow } from './sanitize-row'
16 17 17 18
// --- Constants ---
18 19 19 20
const SELECT_MODES = ['range', 'multi', 'single']
20 21 22 +
const ROLE_GRID = 'grid'
23 + 21 24
// --- Props ---
22 25 23 26
export const props = {
@@ -70,17 +73,19 @@ export const selectableMixin = Vue.extend({
70 73
}
71 74
},
72 75
selectableTableAttrs() {
73 -
const role = this.bvAttrs.role || 'grid'
76 +
if (!this.isSelectable) {
77 +
return {}
78 +
}
74 79 75 -
return this.isSelectable
76 -
? {
77 -
role,
78 -
// TODO:
79 -
// Should this attribute not be included when `no-select-on-click` is set
80 -
// since this attribute implies keyboard navigation?
81 -
'aria-multiselectable': role === 'grid' ? String(this.selectableIsMultiSelect) : null
82 -
}
83 -
: {}
80 +
const role = this.bvAttrs.role || ROLE_GRID
81 + 82 +
return {
83 +
role,
84 +
// TODO:
85 +
// Should this attribute not be included when `no-select-on-click` is set
86 +
// since this attribute implies keyboard navigation?
87 +
'aria-multiselectable': role === ROLE_GRID ? toString(this.selectableIsMultiSelect) : null
88 +
}
84 89
}
85 90
},
86 91
watch: {
@@ -115,7 +115,7 @@ export const tableRendererMixin = Vue.extend({
115 115
const ariaAttrs = this.isTableSimple
116 116
? {}
117 117
: {
118 -
'aria-busy': this.computedBusy ? 'true' : 'false',
118 +
'aria-busy': toString(this.computedBusy),
119 119
'aria-colcount': toString(fields.length),
120 120
// Preserve user supplied `aria-describedby`, if provided
121 121
'aria-describedby':
@@ -135,7 +135,7 @@ export const tableRendererMixin = Vue.extend({
135 135
...this.bvAttrs,
136 136
// Now we can override any `$attrs` here
137 137
id: this.safeId(),
138 -
role: 'table',
138 +
role: this.bvAttrs.role || 'table',
139 139
...ariaAttrs,
140 140
...selectableTableAttrs
141 141
}
@@ -52,6 +52,47 @@ describe('table > row select', () => {
52 52
wrapper.destroy()
53 53
})
54 54 55 +
it('should apply user role if provided, grid role if multiselectable or table role otherwise', async () => {
56 +
let wrapper = mount(BTable, {
57 +
propsData: {
58 +
fields: testFields,
59 +
items: testItems
60 +
}
61 +
})
62 + 63 +
expect(wrapper).toBeDefined()
64 +
await waitNT(wrapper.vm)
65 + 66 +
expect(wrapper.attributes('role')).toBe('table')
67 +
wrapper.destroy()
68 + 69 +
wrapper = mount(BTable, {
70 +
propsData: {
71 +
fields: testFields,
72 +
items: testItems,
73 +
role: 'foobar'
74 +
}
75 +
})
76 + 77 +
await waitNT(wrapper.vm)
78 + 79 +
expect(wrapper.attributes('role')).toBe('foobar')
80 +
wrapper.destroy()
81 + 82 +
wrapper = mount(BTable, {
83 +
propsData: {
84 +
fields: testFields,
85 +
items: testItems,
86 +
selectable: true
87 +
}
88 +
})
89 + 90 +
await waitNT(wrapper.vm)
91 + 92 +
expect(wrapper.attributes('role')).toBe('grid')
93 +
wrapper.destroy()
94 +
})
95 + 55 96
it('should have tabindex but not aria-selected when not selectable and has row-clicked listener', async () => {
56 97
const wrapper = mount(BTable, {
57 98
propsData: {
You can’t perform that action at this time.
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