Ensure TOC scroll occurs after intial autofocus

Author: willshowell

src/app/pages/component-viewer/component-api.html

@@ -4,5 +4,5 @@
 <doc-viewer
   documentUrl="/assets/documents/api/{{componentViewer.componentDocItem.packageName}}-{{componentViewer.componentDocItem.id}}.html"
   class="docs-component-view-text-content docs-component-api"
-  (contentLoaded)="toc.createLinksAndScroll()"></doc-viewer>
+  (contentLoaded)="focusInitialTarget(); toc.createLinksAndScroll()"></doc-viewer>
 <table-of-contents #toc headerSelectors=".docs-api-h3,.docs-api-h4"></table-of-contents>

src/app/pages/component-viewer/component-overview.html

@@ -4,6 +4,6 @@
 <doc-viewer
     documentUrl="/assets/documents/overview/{{componentViewer.componentDocItem.packageName}}-{{componentViewer.componentDocItem.id}}.html"
     class="docs-component-view-text-content docs-component-overview"
-    (contentLoaded)="toc.createLinksAndScroll()">
+    (contentLoaded)="focusInitialTarget(); toc.createLinksAndScroll()">
 </doc-viewer>
 <table-of-contents #toc></table-of-contents>

src/app/pages/component-viewer/component-viewer.ts

@@ -1,4 +1,4 @@
-import {Component, OnInit, NgModule, ElementRef, ViewEncapsulation, ViewChild} from '@angular/core';
+import {Component, NgModule, ElementRef, ViewEncapsulation, ViewChild} from '@angular/core';
 import {ActivatedRoute, Params, Router, RouterModule} from '@angular/router';
 import {DocumentationItems, DocItem} from '../../shared/documentation-items/documentation-items';
 import {ComponentPageTitle} from '../page-title/page-title';
@@ -49,14 +49,13 @@ export class ComponentViewer {
   templateUrl: './component-overview.html',
   encapsulation: ViewEncapsulation.None,
 })
-export class ComponentOverview implements OnInit {
+export class ComponentOverview {
   @ViewChild('intialFocusTarget') focusTarget: ElementRef;
 
   constructor(public componentViewer: ComponentViewer) {}
 
-  ngOnInit() {
-    // 100ms timeout is used to allow the page to settle before moving focus for screen readers.
-    setTimeout(() => this.focusTarget.nativeElement.focus(), 100);
+  focusInitialTarget() {
+    this.focusTarget.nativeElement.focus();
   }
 }