I'm experiencing accessibility issues when loading a page from my mfe-base. When loading my shell application, the displayed page is from mfe-base. The focus is being assigned to an image, which should automatically enable reading and navigation, but this isn't happening. It's important to note that when navigating manually using the tab and arrow keys, the flow is correct. However, the automatic navigation isn't working as expected, compromising the experience for users who rely on screen readers. I noticed that the focus always remains stuck on the body, even when manually forcing focus. I'm using ModuleFederationPlugin and Angular version 17 with standalone components. ngAfterViewInit(): void { (document.activeElement as HTMLElement)?.blur(); setTimeout(() => { this.title.nativeElement?.focus(); this.cd.markForCheck(); }, 100); this.loadPage(); } Continue reading...
