From 26a6ca75d00ce9b33553504bc251cc4b635fdc8b Mon Sep 17 00:00:00 2001 From: crisbeto Date: Fri, 8 Feb 2019 12:46:00 +0100 Subject: [PATCH] fix(bottom-sheet): focus trap not being attached when autoFocus is disabled Fixes the bottom sheet container not creating a focus trap, if `autoFocus` is set to `false`. Fixes #15119. --- src/lib/bottom-sheet/bottom-sheet-container.ts | 6 ++++-- src/lib/bottom-sheet/bottom-sheet.spec.ts | 14 ++++++++++++++ 2 files changed, 18 insertions(+), 2 deletions(-) diff --git a/src/lib/bottom-sheet/bottom-sheet-container.ts b/src/lib/bottom-sheet/bottom-sheet-container.ts index 8056ee5957f2..22848aa70b5e 100644 --- a/src/lib/bottom-sheet/bottom-sheet-container.ts +++ b/src/lib/bottom-sheet/bottom-sheet-container.ts @@ -146,7 +146,7 @@ export class MatBottomSheetContainer extends BasePortalOutlet implements OnDestr _onAnimationDone(event: AnimationEvent) { if (event.toState === 'hidden') { this._restoreFocus(); - } else if (event.toState === 'visible' && this.bottomSheetConfig.autoFocus) { + } else if (event.toState === 'visible') { this._trapFocus(); } @@ -187,7 +187,9 @@ export class MatBottomSheetContainer extends BasePortalOutlet implements OnDestr this._focusTrap = this._focusTrapFactory.create(this._elementRef.nativeElement); } - this._focusTrap.focusInitialElementWhenReady(); + if (this.bottomSheetConfig.autoFocus) { + this._focusTrap.focusInitialElementWhenReady(); + } } /** Restores focus to the element that was focused before the bottom sheet was opened. */ diff --git a/src/lib/bottom-sheet/bottom-sheet.spec.ts b/src/lib/bottom-sheet/bottom-sheet.spec.ts index 1ad501c6bc97..e5e9c8bebc6b 100644 --- a/src/lib/bottom-sheet/bottom-sheet.spec.ts +++ b/src/lib/bottom-sheet/bottom-sheet.spec.ts @@ -547,6 +547,20 @@ describe('MatBottomSheet', () => { 'Expected bottom sheet container to be focused.'); })); + it('should create a focus trap if autoFocus is disabled', fakeAsync(() => { + bottomSheet.open(PizzaMsg, { + viewContainerRef: testViewContainerRef, + autoFocus: false + }); + + viewContainerFixture.detectChanges(); + flushMicrotasks(); + + const focusTrapAnchors = overlayContainerElement.querySelectorAll('.cdk-focus-trap-anchor'); + + expect(focusTrapAnchors.length).toBeGreaterThan(0); + })); + it('should focus the first tabbable element of the bottom sheet on open when' + 'autoFocus is enabled', fakeAsync(() => { bottomSheet.open(PizzaMsg, {