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,5 +1,5 @@
 import {CommonModule} from '@angular/common';
-import {Component, ElementRef, NgModule, OnInit, ViewChild, ViewEncapsulation} from '@angular/core';
+import {Component, ElementRef, NgModule, ViewChild, ViewEncapsulation} from '@angular/core';
 import {MatTabsModule} from '@angular/material';
 import {ActivatedRoute, Params, Router, RouterModule} from '@angular/router';
 import 'rxjs/add/operator/map';
@@ -50,14 +50,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();
   }
 }