mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-11 16:14:04 +02:00
Code Issues Releases Wiki Activity

Add shift-tab keyboard support for dialogs (modal & Offcanvas components) (#33865)

Browse Source 
* consolidate dialog focus trap logic

* add shift-tab support to focustrap

* remove redundant null check of trap element

Co-authored-by: GeoSot <geo.sotis@gmail.com>

* remove area support forom focusableChildren

* fix no expectations warning in focustrap tests

Co-authored-by: GeoSot <geo.sotis@gmail.com>
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
This commit is contained in:
Ryan Berliner
2021-07-27 01:01:04 -04:00
committed by GitHub
parent 8536474583
commit 7646f6bd33
9 changed files with 499 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
js/tests/unit/offcanvas.spec.js
View File

@@ -219,7 +219,7 @@ describe('Offcanvas', () => {
offCanvas.show()
})
it('should not enforce focus if focus scroll is allowed', done => {
it('should not trap focus if scroll is allowed', done => {
fixtureEl.innerHTML = '<div class="offcanvas"></div>'
const offCanvasEl = fixtureEl.querySelector('.offcanvas')
@@ -227,10 +227,10 @@ describe('Offcanvas', () => {
scroll: true
})
spyOn(offCanvas, '_enforceFocusOnElement')
spyOn(offCanvas._focustrap, 'activate').and.callThrough()
offCanvasEl.addEventListener('shown.bs.offcanvas', () => {
expect(offCanvas._enforceFocusOnElement).not.toHaveBeenCalled()
expect(offCanvas._focustrap.activate).not.toHaveBeenCalled()
done()
})
@@ -345,16 +345,16 @@ describe('Offcanvas', () => {
expect(Offcanvas.prototype.show).toHaveBeenCalled()
})
it('should enforce focus', done => {
it('should trap focus', done => {
fixtureEl.innerHTML = '<div class="offcanvas"></div>'
const offCanvasEl = fixtureEl.querySelector('.offcanvas')
const offCanvas = new Offcanvas(offCanvasEl)
spyOn(offCanvas, '_enforceFocusOnElement')
spyOn(offCanvas._focustrap, 'activate').and.callThrough()
offCanvasEl.addEventListener('shown.bs.offcanvas', () => {
expect(offCanvas._enforceFocusOnElement).toHaveBeenCalled()
expect(offCanvas._focustrap.activate).toHaveBeenCalled()
done()
})
@@ -421,6 +421,22 @@ describe('Offcanvas', () => {
offCanvas.hide()
})
it('should release focus trap', done => {
fixtureEl.innerHTML = '<div class="offcanvas"></div>'
const offCanvasEl = fixtureEl.querySelector('div')
const offCanvas = new Offcanvas(offCanvasEl)
spyOn(offCanvas._focustrap, 'deactivate').and.callThrough()
offCanvas.show()
offCanvasEl.addEventListener('hidden.bs.offcanvas', () => {
expect(offCanvas._focustrap.deactivate).toHaveBeenCalled()
done()
})
offCanvas.hide()
})
})
describe('dispose', () => {
@@ -431,6 +447,8 @@ describe('Offcanvas', () => {
const offCanvas = new Offcanvas(offCanvasEl)
const backdrop = offCanvas._backdrop
spyOn(backdrop, 'dispose').and.callThrough()
const focustrap = offCanvas._focustrap
spyOn(focustrap, 'deactivate').and.callThrough()
expect(Offcanvas.getInstance(offCanvasEl)).toEqual(offCanvas)
@@ -440,6 +458,8 @@ describe('Offcanvas', () => {
expect(backdrop.dispose).toHaveBeenCalled()
expect(offCanvas._backdrop).toBeNull()
expect(focustrap.deactivate).toHaveBeenCalled()
expect(offCanvas._focustrap).toBeNull()
expect(Offcanvas.getInstance(offCanvasEl)).toEqual(null)
})
})