Improve sidenav focus
PowerKiKi opened this issue · comments
When menu is hidden, it is possible to TAB through the invisible menu and select invisible link. This should not be possible to avoid accessibility issues.
Related, the burger menu should not become focused when after navigation when in mobile mode. And the first menu should not be auto-focused when opening the menu in mobile mode.
Those two behaviors are not present in native mat-sidenav
as can be seen there: https://stackblitz.com/angular/vobbrkxolqv. So we should be able to find a way to keep our features while preventing those bugs.
first seen on: https://support.ecodev.ch/issues/7101
Maybe part of solution, from here, could look like:
import { Component, AfterViewInit } from '@angular/core';
import { FocusMonitor } from '@angular/cdk/a11y';
@Component({
selector : 'test-component',
templateUrl: 'test-component.template.html',
})
export class TestComponent implements AfterViewInit {
constructor(private _focusMonitor: FocusMonitor) {}
ngAfterViewInit() {
this._focusMonitor.stopMonitoring(document.getElementById('navButton_1'));
}
}
See partially related: angular/components#22653
Not sure at all, but could this might help us when it lands ?angular/components@769996e
Not happening anymore