From 5a4e46db20beaf0e13ad19d9a8344a9d56c8d04c Mon Sep 17 00:00:00 2001
From: Victor Berchet <victor@suumit.com>
Date: Fri, 9 Sep 2016 12:04:38 -0700
Subject: [PATCH] refactor(tests): simplify code (#11485)

---
 .../common/test/pipes/json_pipe_spec.ts       |   6 +-
 .../common/test/pipes/slice_pipe_spec.ts      |   6 +-
 .../animation/animation_integration_spec.ts   | 116 ++++-----
 .../core/test/debug/debug_node_spec.ts        |   8 +-
 .../core/test/linker/integration_spec.ts      | 138 +++++-----
 .../linker/ng_container_integration_spec.ts   |  14 +-
 .../linker/projection_integration_spec.ts     |  94 +++----
 .../test/linker/query_integration_spec.ts     |  26 +-
 .../linker/regression_integration_spec.ts     |   3 +-
 .../test/linker/security_integration_spec.ts  |  15 +-
 .../core/testing/component_fixture.ts         |  16 +-
 .../@angular/forms/test/form_array_spec.ts    |   2 +-
 .../@angular/forms/test/form_builder_spec.ts  |   2 +-
 .../forms/test/reactive_integration_spec.ts   | 246 +++++++++---------
 .../forms/test/template_integration_spec.ts   | 151 ++++++-----
 .../@angular/forms/test/validators_spec.ts    |   4 +-
 .../test/testing_public_browser_spec.ts       |   3 +-
 .../test/testing_public_spec.ts               |  18 +-
 .../worker/renderer_integration_spec.ts       |  16 +-
 .../@angular/router/test/integration.spec.ts  | 163 ++++++------
 .../public_api_guard/core/testing/index.d.ts  |   2 +-
 21 files changed, 505 insertions(+), 544 deletions(-)

diff --git a/modules/@angular/common/test/pipes/json_pipe_spec.ts b/modules/@angular/common/test/pipes/json_pipe_spec.ts
index edb6fa9ca0..84fe860378 100644
--- a/modules/@angular/common/test/pipes/json_pipe_spec.ts
+++ b/modules/@angular/common/test/pipes/json_pipe_spec.ts
@@ -67,13 +67,13 @@ export function main() {
       it('should work with mutable objects', async(() => {
            let fixture = TestBed.createComponent(TestComp);
            let mutable: number[] = [1];
-           fixture.debugElement.componentInstance.data = mutable;
+           fixture.componentInstance.data = mutable;
            fixture.detectChanges();
-           expect(fixture.debugElement.nativeElement).toHaveText('[\n  1\n]');
+           expect(fixture.nativeElement).toHaveText('[\n  1\n]');
 
            mutable.push(2);
            fixture.detectChanges();
-           expect(fixture.debugElement.nativeElement).toHaveText('[\n  1,\n  2\n]');
+           expect(fixture.nativeElement).toHaveText('[\n  1,\n  2\n]');
 
          }));
     });
diff --git a/modules/@angular/common/test/pipes/slice_pipe_spec.ts b/modules/@angular/common/test/pipes/slice_pipe_spec.ts
index c9eb5c751c..683f9bb5a6 100644
--- a/modules/@angular/common/test/pipes/slice_pipe_spec.ts
+++ b/modules/@angular/common/test/pipes/slice_pipe_spec.ts
@@ -96,13 +96,13 @@ export function main() {
       it('should work with mutable arrays', async(() => {
            let fixture = TestBed.createComponent(TestComp);
            let mutable: number[] = [1, 2];
-           fixture.debugElement.componentInstance.data = mutable;
+           fixture.componentInstance.data = mutable;
            fixture.detectChanges();
-           expect(fixture.debugElement.nativeElement).toHaveText('2');
+           expect(fixture.nativeElement).toHaveText('2');
 
            mutable.push(3);
            fixture.detectChanges();
-           expect(fixture.debugElement.nativeElement).toHaveText('2,3');
+           expect(fixture.nativeElement).toHaveText('2,3');
          }));
     });
   });
diff --git a/modules/@angular/core/test/animation/animation_integration_spec.ts b/modules/@angular/core/test/animation/animation_integration_spec.ts
index 1d8ab43f5e..88a1f56cbe 100644
--- a/modules/@angular/core/test/animation/animation_integration_spec.ts
+++ b/modules/@angular/core/test/animation/animation_integration_spec.ts
@@ -59,7 +59,7 @@ function declareTests({useJit}: {useJit: boolean}) {
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
 
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
            cmp.exp = true;
            fixture.detectChanges();
            flushMicrotasks();
@@ -88,7 +88,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
 
            cmp.exp = true;
            fixture.detectChanges();
@@ -125,7 +125,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
            cmp.exp = 'state1';
            fixture.detectChanges();
 
@@ -164,7 +164,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
            cmp.exp = true;
            fixture.detectChanges();
            flushMicrotasks();
@@ -209,7 +209,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
            cmp.exp = true;
            fixture.detectChanges();
 
@@ -278,7 +278,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
              const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
              let fixture = TestBed.createComponent(DummyIfCmp);
-             var cmp = fixture.debugElement.componentInstance;
+             var cmp = fixture.componentInstance;
 
              cmp.exp = true;
              fixture.detectChanges();
@@ -334,7 +334,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
              const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
              let fixture = TestBed.createComponent(DummyIfCmp);
-             var cmp = fixture.debugElement.componentInstance;
+             var cmp = fixture.componentInstance;
 
              cmp.exp = true;
              fixture.detectChanges();
@@ -395,7 +395,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
              const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
              const fixture = TestBed.createComponent(DummyIfCmp);
-             const cmp = fixture.debugElement.componentInstance;
+             const cmp = fixture.componentInstance;
 
              cmp.exp = true;
              fixture.detectChanges();
@@ -427,7 +427,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
              const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
              let fixture = TestBed.createComponent(DummyIfCmp);
-             var cmp = fixture.debugElement.componentInstance;
+             var cmp = fixture.componentInstance;
              cmp.exp = true;
              fixture.detectChanges();
              flushMicrotasks();
@@ -466,7 +466,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
              const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
              let fixture = TestBed.createComponent(DummyIfCmp);
-             var cmp = fixture.debugElement.componentInstance;
+             var cmp = fixture.componentInstance;
              cmp.exp = true;
              fixture.detectChanges();
              flushMicrotasks();
@@ -498,7 +498,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
 
            cmp.exp = 'state1';
            fixture.detectChanges();
@@ -544,7 +544,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
 
            cmp.exp = true;
            fixture.detectChanges();
@@ -592,7 +592,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
 
            cmp.exp = 'start';
            cmp.exp2 = 'start';
@@ -639,7 +639,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
            cmp.exp = true;
            fixture.detectChanges();
            flushMicrotasks();
@@ -649,7 +649,7 @@ function declareTests({useJit}: {useJit: boolean}) {
            flushMicrotasks();
 
            var player = driver.log[0]['player'];
-           var container = fixture.debugElement.nativeElement;
+           var container = fixture.nativeElement;
            var ifElm = getDOM().querySelector(container, '.my-if');
            expect(ifElm).toBeTruthy();
 
@@ -677,7 +677,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
            cmp.exp = 'state1';
            fixture.detectChanges();
            flushMicrotasks();
@@ -716,7 +716,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
            cmp.exp = 'state1';
            cmp.exp2 = 'state1';
            fixture.detectChanges();
@@ -784,8 +784,8 @@ function declareTests({useJit}: {useJit: boolean}) {
 
              const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
              let fixture = TestBed.createComponent(DummyIfCmp);
-             var cmp = fixture.debugElement.componentInstance;
-             var parent = fixture.debugElement.nativeElement;
+             var cmp = fixture.componentInstance;
+             var parent = fixture.nativeElement;
              cmp.items = [0, 2, 4, 6, 8];
              fixture.detectChanges();
              flushMicrotasks();
@@ -813,8 +813,8 @@ function declareTests({useJit}: {useJit: boolean}) {
 
              const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
              let fixture = TestBed.createComponent(DummyIfCmp);
-             var cmp = fixture.debugElement.componentInstance;
-             var parent = fixture.debugElement.nativeElement;
+             var cmp = fixture.componentInstance;
+             var parent = fixture.nativeElement;
 
              cmp.items = [0, 1, 2, 3, 4];
              fixture.detectChanges();
@@ -879,8 +879,8 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as InnerContentTrackingAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
-           var node = getDOM().querySelector(fixture.debugElement.nativeElement, '.target');
+           var cmp = fixture.componentInstance;
+           var node = getDOM().querySelector(fixture.nativeElement, '.target');
            cmp.exp = true;
            cmp.exp2 = true;
            fixture.detectChanges();
@@ -911,7 +911,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as InnerContentTrackingAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
            cmp.exp = true;
            cmp.exp2 = true;
            fixture.detectChanges();
@@ -943,7 +943,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as InnerContentTrackingAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
            cmp.exp = true;
            cmp.exp2 = true;
            fixture.detectChanges();
@@ -972,7 +972,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as InnerContentTrackingAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
            cmp.exp = true;
            fixture.detectChanges();
            flushMicrotasks();
@@ -1010,7 +1010,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as InnerContentTrackingAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
            cmp.exp = true;
            cmp.exp2 = true;
            fixture.detectChanges();
@@ -1051,7 +1051,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as InnerContentTrackingAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
            cmp.exp = true;
            cmp.exp2 = true;
            fixture.detectChanges();
@@ -1087,7 +1087,7 @@ function declareTests({useJit}: {useJit: boolean}) {
            let fixture = TestBed.createComponent(DummyIfCmp);
            var isAnimationRunning = false;
            var calls = 0;
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
            cmp.callback = (e: AnimationTransitionEvent) => {
              isAnimationRunning = e.totalTime > 0;
              calls++;
@@ -1123,7 +1123,7 @@ function declareTests({useJit}: {useJit: boolean}) {
            let fixture = TestBed.createComponent(DummyIfCmp);
            var isAnimationRunning = false;
            var calls = 0;
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
            cmp.callback = (e: AnimationTransitionEvent) => {
              isAnimationRunning = e.totalTime > 0;
              calls++;
@@ -1165,7 +1165,7 @@ function declareTests({useJit}: {useJit: boolean}) {
            const driver = TestBed.get(AnimationDriver) as InnerContentTrackingAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
            var eventData: AnimationTransitionEvent = null;
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
            cmp.callback = (e: AnimationTransitionEvent) => { eventData = e; };
            cmp.exp = 'one';
            fixture.detectChanges();
@@ -1202,7 +1202,7 @@ function declareTests({useJit}: {useJit: boolean}) {
            let fixture = TestBed.createComponent(DummyIfCmp);
            var eventData1: AnimationTransitionEvent = null;
            var eventData2: AnimationTransitionEvent = null;
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
            cmp.callback1 = (e: AnimationTransitionEvent) => { eventData1 = e; };
            cmp.callback2 = (e: AnimationTransitionEvent) => { eventData2 = e; };
            cmp.exp = 'one';
@@ -1347,7 +1347,7 @@ function declareTests({useJit}: {useJit: boolean}) {
            var ifCalls = 0;
            var loadingCalls = 0;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var ifCmp = fixture.debugElement.componentInstance;
+           var ifCmp = fixture.componentInstance;
            var loadingCmp = fixture.debugElement.childNodes[1].componentInstance;
 
            ifCmp.callback = (e: any) => ifCalls++;
@@ -1390,7 +1390,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as InnerContentTrackingAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
 
            var startCalls = [0, 0, 0, 0, 0];
            var doneCalls = [0, 0, 0, 0, 0];
@@ -1442,7 +1442,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
              const driver = TestBed.get(AnimationDriver) as InnerContentTrackingAnimationDriver;
              let fixture = TestBed.createComponent(DummyIfCmp);
-             var cmp = fixture.debugElement.componentInstance;
+             var cmp = fixture.componentInstance;
              cmp.exp = true;
              cmp.exp2 = 'blue';
              fixture.detectChanges();
@@ -1500,7 +1500,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
            let fixture = TestBed.createComponent(DummyLoadingCmp);
-           var cmp = fixture.debugElement.componentInstance;
+           var cmp = fixture.componentInstance;
            cmp.exp = 'final';
            fixture.detectChanges();
            flushMicrotasks();
@@ -1542,8 +1542,8 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
-           var node = getDOM().querySelector(fixture.debugElement.nativeElement, '.target');
+           var cmp = fixture.componentInstance;
+           var node = getDOM().querySelector(fixture.nativeElement, '.target');
            cmp.exp = 'final';
            fixture.detectChanges();
            flushMicrotasks();
@@ -1575,8 +1575,8 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
-           var node = getDOM().querySelector(fixture.debugElement.nativeElement, '.target');
+           var cmp = fixture.componentInstance;
+           var node = getDOM().querySelector(fixture.nativeElement, '.target');
            cmp.exp = 'green';
            fixture.detectChanges();
            flushMicrotasks();
@@ -1631,8 +1631,8 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
-           var node = getDOM().querySelector(fixture.debugElement.nativeElement, '.target');
+           var cmp = fixture.componentInstance;
+           var node = getDOM().querySelector(fixture.nativeElement, '.target');
            cmp.exp = 'final';
            fixture.detectChanges();
            flushMicrotasks();
@@ -1659,8 +1659,8 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
-           var node = getDOM().querySelector(fixture.debugElement.nativeElement, '.target');
+           var cmp = fixture.componentInstance;
+           var node = getDOM().querySelector(fixture.nativeElement, '.target');
            cmp.exp = 'final';
            fixture.detectChanges();
            flushMicrotasks();
@@ -1688,8 +1688,8 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
-           var node = getDOM().querySelector(fixture.debugElement.nativeElement, '.target');
+           var cmp = fixture.componentInstance;
+           var node = getDOM().querySelector(fixture.nativeElement, '.target');
 
            cmp.exp = 'a';
            fixture.detectChanges();
@@ -1744,8 +1744,8 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
-           var node = getDOM().querySelector(fixture.debugElement.nativeElement, '.target');
+           var cmp = fixture.componentInstance;
+           var node = getDOM().querySelector(fixture.nativeElement, '.target');
 
            cmp.exp = 'a';
            fixture.detectChanges();
@@ -1791,8 +1791,8 @@ function declareTests({useJit}: {useJit: boolean}) {
 
            const driver = TestBed.get(AnimationDriver) as MockAnimationDriver;
            let fixture = TestBed.createComponent(DummyIfCmp);
-           var cmp = fixture.debugElement.componentInstance;
-           var node = getDOM().querySelector(fixture.debugElement.nativeElement, '.target');
+           var cmp = fixture.componentInstance;
+           getDOM().querySelector(fixture.nativeElement, '.target');
 
            cmp.exp = 'final';
            fixture.detectChanges();
@@ -1843,27 +1843,25 @@ class InnerContentTrackingAnimationPlayer extends MockAnimationPlayer {
 @Component({
   selector: 'if-cmp',
   animations: [trigger('myAnimation', [])],
-  template: `
-    <div *ngIf="exp" [@myAnimation]="exp"></div>
-  `
+  template: `<div *ngIf="exp" [@myAnimation]="exp"></div>`
 })
 class DummyIfCmp {
-  exp = false;
-  exp2 = false;
+  exp: any = false;
+  exp2: any = false;
   items = [0, 1, 2, 3, 4];
   callback: Function = () => {};
+  callback1: Function = () => {};
+  callback2: Function = () => {};
 }
 
 @Component({
   selector: 'dummy-loading-cmp',
   host: {'[@loading]': 'exp'},
   animations: [trigger('loading', [])],
-  template: `
-    <div>loading...</div>
-  `
+  template: `<div>loading...</div>`
 })
 class DummyLoadingCmp {
-  exp = false;
+  exp: any = false;
   callback = () => {};
 }
 
diff --git a/modules/@angular/core/test/debug/debug_node_spec.ts b/modules/@angular/core/test/debug/debug_node_spec.ts
index 04fb637fbb..a4fed0f2be 100644
--- a/modules/@angular/core/test/debug/debug_node_spec.ts
+++ b/modules/@angular/core/test/debug/debug_node_spec.ts
@@ -345,14 +345,14 @@ export function main() {
       fixture = TestBed.createComponent(EventsComp);
       fixture.detectChanges();
 
-      expect(fixture.debugElement.componentInstance.clicked).toBe(false);
-      expect(fixture.debugElement.componentInstance.customed).toBe(false);
+      expect(fixture.componentInstance.clicked).toBe(false);
+      expect(fixture.componentInstance.customed).toBe(false);
 
       fixture.debugElement.children[0].triggerEventHandler('click', <Event>{});
-      expect(fixture.debugElement.componentInstance.clicked).toBe(true);
+      expect(fixture.componentInstance.clicked).toBe(true);
 
       fixture.debugElement.children[1].triggerEventHandler('myevent', <Event>{});
-      expect(fixture.debugElement.componentInstance.customed).toBe(true);
+      expect(fixture.componentInstance.customed).toBe(true);
 
     });
   });
diff --git a/modules/@angular/core/test/linker/integration_spec.ts b/modules/@angular/core/test/linker/integration_spec.ts
index a0e795f2ef..d1975a114e 100644
--- a/modules/@angular/core/test/linker/integration_spec.ts
+++ b/modules/@angular/core/test/linker/integration_spec.ts
@@ -44,10 +44,10 @@ function declareTests({useJit}: {useJit: boolean}) {
         const template = '<div>{{ctxProp}}</div>';
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
-        fixture.debugElement.componentInstance.ctxProp = 'Hello World!';
+        fixture.componentInstance.ctxProp = 'Hello World!';
 
         fixture.detectChanges();
-        expect(fixture.debugElement.nativeElement).toHaveText('Hello World!');
+        expect(fixture.nativeElement).toHaveText('Hello World!');
       });
 
       it('should update text node with a blank string when interpolation evaluates to null', () => {
@@ -55,10 +55,10 @@ function declareTests({useJit}: {useJit: boolean}) {
         const template = '<div>{{null}}{{ctxProp}}</div>';
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
-        fixture.debugElement.componentInstance.ctxProp = null;
+        fixture.componentInstance.ctxProp = null;
 
         fixture.detectChanges();
-        expect(fixture.debugElement.nativeElement).toHaveText('');
+        expect(fixture.nativeElement).toHaveText('');
       });
 
       it('should consume element binding changes', () => {
@@ -67,7 +67,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
 
-        fixture.debugElement.componentInstance.ctxProp = 'Hello World!';
+        fixture.componentInstance.ctxProp = 'Hello World!';
         fixture.detectChanges();
 
         expect(fixture.debugElement.children[0].nativeElement.id).toEqual('Hello World!');
@@ -79,12 +79,12 @@ function declareTests({useJit}: {useJit: boolean}) {
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
 
-        fixture.debugElement.componentInstance.ctxProp = 'Initial aria label';
+        fixture.componentInstance.ctxProp = 'Initial aria label';
         fixture.detectChanges();
         expect(getDOM().getAttribute(fixture.debugElement.children[0].nativeElement, 'aria-label'))
             .toEqual('Initial aria label');
 
-        fixture.debugElement.componentInstance.ctxProp = 'Changed aria label';
+        fixture.componentInstance.ctxProp = 'Changed aria label';
         fixture.detectChanges();
         expect(getDOM().getAttribute(fixture.debugElement.children[0].nativeElement, 'aria-label'))
             .toEqual('Changed aria label');
@@ -96,12 +96,12 @@ function declareTests({useJit}: {useJit: boolean}) {
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
 
-        fixture.debugElement.componentInstance.ctxProp = 'bar';
+        fixture.componentInstance.ctxProp = 'bar';
         fixture.detectChanges();
         expect(getDOM().getAttribute(fixture.debugElement.children[0].nativeElement, 'foo'))
             .toEqual('bar');
 
-        fixture.debugElement.componentInstance.ctxProp = null;
+        fixture.componentInstance.ctxProp = null;
         fixture.detectChanges();
         expect(getDOM().hasAttribute(fixture.debugElement.children[0].nativeElement, 'foo'))
             .toBeFalsy();
@@ -113,12 +113,12 @@ function declareTests({useJit}: {useJit: boolean}) {
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
 
-        fixture.debugElement.componentInstance.ctxProp = '10';
+        fixture.componentInstance.ctxProp = '10';
         fixture.detectChanges();
         expect(getDOM().getStyle(fixture.debugElement.children[0].nativeElement, 'height'))
             .toEqual('10px');
 
-        fixture.debugElement.componentInstance.ctxProp = null;
+        fixture.componentInstance.ctxProp = null;
         fixture.detectChanges();
         expect(getDOM().getStyle(fixture.debugElement.children[0].nativeElement, 'height'))
             .toEqual('');
@@ -134,7 +134,7 @@ function declareTests({useJit}: {useJit: boolean}) {
            fixture.detectChanges();
            expect(fixture.debugElement.children[0].nativeElement.tabIndex).toEqual(0);
 
-           fixture.debugElement.componentInstance.ctxNumProp = 5;
+           fixture.componentInstance.ctxNumProp = 5;
            fixture.detectChanges();
            expect(fixture.debugElement.children[0].nativeElement.tabIndex).toEqual(5);
          });
@@ -148,7 +148,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         fixture.detectChanges();
         expect(fixture.debugElement.children[0].nativeElement.readOnly).toBeFalsy();
 
-        fixture.debugElement.componentInstance.ctxBoolProp = true;
+        fixture.componentInstance.ctxBoolProp = true;
         fixture.detectChanges();
         expect(fixture.debugElement.children[0].nativeElement.readOnly).toBeTruthy();
       });
@@ -159,12 +159,12 @@ function declareTests({useJit}: {useJit: boolean}) {
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
 
-        fixture.debugElement.componentInstance.ctxProp = 'Some <span>HTML</span>';
+        fixture.componentInstance.ctxProp = 'Some <span>HTML</span>';
         fixture.detectChanges();
         expect(getDOM().getInnerHTML(fixture.debugElement.children[0].nativeElement))
             .toEqual('Some <span>HTML</span>');
 
-        fixture.debugElement.componentInstance.ctxProp = 'Some other <div>HTML</div>';
+        fixture.componentInstance.ctxProp = 'Some other <div>HTML</div>';
         fixture.detectChanges();
         expect(getDOM().getInnerHTML(fixture.debugElement.children[0].nativeElement))
             .toEqual('Some other <div>HTML</div>');
@@ -177,7 +177,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         const fixture = TestBed.createComponent(MyComp);
 
         var nativeEl = fixture.debugElement.children[0].nativeElement;
-        fixture.debugElement.componentInstance.ctxProp = 'foo bar';
+        fixture.componentInstance.ctxProp = 'foo bar';
         fixture.detectChanges();
 
         expect(nativeEl).toHaveCssClass('foo');
@@ -196,7 +196,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
 
-        fixture.debugElement.componentInstance.ctxProp = 'Hello World!';
+        fixture.componentInstance.ctxProp = 'Hello World!';
         fixture.detectChanges();
 
         var containerSpan = fixture.debugElement.children[0];
@@ -215,7 +215,7 @@ function declareTests({useJit}: {useJit: boolean}) {
           TestBed.overrideComponent(MyComp, {set: {template}});
           const fixture = TestBed.createComponent(MyComp);
 
-          fixture.debugElement.componentInstance.ctxProp = 'a';
+          fixture.componentInstance.ctxProp = 'a';
           fixture.detectChanges();
 
           var dir = fixture.debugElement.children[0].references['dir'];
@@ -231,7 +231,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
         fixture.detectChanges();
 
-        expect(fixture.debugElement.nativeElement).toHaveText('hello');
+        expect(fixture.nativeElement).toHaveText('hello');
       });
 
       // GH issue 328 - https://github.com/angular/angular/issues/328
@@ -241,7 +241,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
 
-        fixture.debugElement.componentInstance.ctxProp = 'Hello World!';
+        fixture.componentInstance.ctxProp = 'Hello World!';
         fixture.detectChanges();
 
         var tc = fixture.debugElement.children[0];
@@ -263,7 +263,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         const template = '<p no-duplicate></p>';
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
-        expect(fixture.debugElement.nativeElement).toHaveText('noduplicate');
+        expect(fixture.nativeElement).toHaveText('noduplicate');
       });
 
       it('should support directives where a selector matches property binding', () => {
@@ -275,11 +275,11 @@ function declareTests({useJit}: {useJit: boolean}) {
         var tc = fixture.debugElement.children[0];
         var idDir = tc.injector.get(IdDir);
 
-        fixture.debugElement.componentInstance.ctxProp = 'some_id';
+        fixture.componentInstance.ctxProp = 'some_id';
         fixture.detectChanges();
         expect(idDir.id).toEqual('some_id');
 
-        fixture.debugElement.componentInstance.ctxProp = 'other_id';
+        fixture.componentInstance.ctxProp = 'other_id';
         fixture.detectChanges();
         expect(idDir.id).toEqual('other_id');
       });
@@ -310,7 +310,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
         fixture.detectChanges();
 
-        var childNodesOfWrapper = getDOM().childNodes(fixture.debugElement.nativeElement);
+        var childNodesOfWrapper = getDOM().childNodes(fixture.nativeElement);
         // 1 template + 2 copies.
         expect(childNodesOfWrapper.length).toBe(3);
         expect(childNodesOfWrapper[1]).toHaveText('hello');
@@ -325,7 +325,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         const fixture = TestBed.createComponent(MyComp);
 
         fixture.detectChanges();
-        expect(fixture.debugElement.nativeElement).toHaveText('baz');
+        expect(fixture.nativeElement).toHaveText('baz');
       });
 
       it('should not detach views in ViewContainers when the parent view is destroyed.', () => {
@@ -335,7 +335,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
 
-        fixture.debugElement.componentInstance.ctxBoolProp = true;
+        fixture.componentInstance.ctxBoolProp = true;
         fixture.detectChanges();
 
         var ngIfEl = fixture.debugElement.children[0];
@@ -343,7 +343,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         expect(someViewport.container.length).toBe(2);
         expect(ngIfEl.children.length).toBe(2);
 
-        fixture.debugElement.componentInstance.ctxBoolProp = false;
+        fixture.componentInstance.ctxBoolProp = false;
         fixture.detectChanges();
 
         expect(someViewport.container.length).toBe(2);
@@ -356,7 +356,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
 
-        var childNodesOfWrapper = getDOM().childNodes(fixture.debugElement.nativeElement);
+        var childNodesOfWrapper = getDOM().childNodes(fixture.nativeElement);
         expect(childNodesOfWrapper.length).toBe(1);
         expect(getDOM().isCommentNode(childNodesOfWrapper[0])).toBe(true);
       });
@@ -370,7 +370,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
         fixture.detectChanges();
 
-        var childNodesOfWrapper = getDOM().childNodes(fixture.debugElement.nativeElement);
+        var childNodesOfWrapper = getDOM().childNodes(fixture.nativeElement);
         // 1 template + 2 copies.
         expect(childNodesOfWrapper.length).toBe(3);
         expect(childNodesOfWrapper[1]).toHaveText('hello');
@@ -390,10 +390,10 @@ function declareTests({useJit}: {useJit: boolean}) {
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
 
-        fixture.debugElement.componentInstance.ctxProp = 'From myComp';
+        fixture.componentInstance.ctxProp = 'From myComp';
         fixture.detectChanges();
 
-        expect(fixture.debugElement.nativeElement)
+        expect(fixture.nativeElement)
             .toHaveText('TOOLBAR(From myComp,From toolbar,Component with an injected host)');
       });
 
@@ -428,7 +428,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
              fixture.detectChanges();
 
-             expect(fixture.debugElement.nativeElement).toHaveText('hello|hello|hello');
+             expect(fixture.nativeElement).toHaveText('hello|hello|hello');
            });
 
         it('should assign two component instances each with a ref-', () => {
@@ -498,7 +498,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
           fixture.detectChanges();
           // Get the element at index 2, since index 0 is the <template>.
-          expect(getDOM().childNodes(fixture.debugElement.nativeElement)[2]).toHaveText('1-hello');
+          expect(getDOM().childNodes(fixture.nativeElement)[2]).toHaveText('1-hello');
         });
       });
 
@@ -533,11 +533,11 @@ function declareTests({useJit}: {useJit: boolean}) {
 
           var cmp = fixture.debugElement.children[0].references['cmp'];
 
-          fixture.debugElement.componentInstance.ctxProp = 'one';
+          fixture.componentInstance.ctxProp = 'one';
           fixture.detectChanges();
           expect(cmp.numberOfChecks).toEqual(1);
 
-          fixture.debugElement.componentInstance.ctxProp = 'two';
+          fixture.componentInstance.ctxProp = 'two';
           fixture.detectChanges();
           expect(cmp.numberOfChecks).toEqual(2);
         });
@@ -604,11 +604,11 @@ function declareTests({useJit}: {useJit: boolean}) {
 
           var cmp = fixture.debugElement.children[0].references['cmp'];
 
-          fixture.debugElement.componentInstance.ctxProp = 'one';
+          fixture.componentInstance.ctxProp = 'one';
           fixture.detectChanges();
           expect(cmp.prop).toEqual('one');
 
-          fixture.debugElement.componentInstance.ctxProp = 'two';
+          fixture.componentInstance.ctxProp = 'two';
           fixture.detectChanges();
           expect(cmp.prop).toEqual('two');
         });
@@ -745,14 +745,13 @@ function declareTests({useJit}: {useJit: boolean}) {
            var tc = fixture.debugElement.children[0];
            var dir = tc.injector.get(DirectiveWithTwoWayBinding);
 
-           fixture.debugElement.componentInstance.ctxProp = 'one';
+           fixture.componentInstance.ctxProp = 'one';
            fixture.detectChanges();
 
            expect(dir.control).toEqual('one');
 
-           dir.controlChange.subscribe({
-             next: () => { expect(fixture.debugElement.componentInstance.ctxProp).toEqual('two'); }
-           });
+           dir.controlChange.subscribe(
+               {next: () => { expect(fixture.componentInstance.ctxProp).toEqual('two'); }});
 
            dir.triggerChange('two');
          }));
@@ -857,7 +856,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         const fixture = TestBed.createComponent(MyComp);
 
         globalCounter = 0;
-        fixture.debugElement.componentInstance.ctxBoolProp = true;
+        fixture.componentInstance.ctxBoolProp = true;
         fixture.detectChanges();
 
         var tc = fixture.debugElement.children[0];
@@ -870,12 +869,12 @@ function declareTests({useJit}: {useJit: boolean}) {
         expect(globalCounter).toEqual(1);
 
 
-        fixture.debugElement.componentInstance.ctxBoolProp = false;
+        fixture.componentInstance.ctxBoolProp = false;
         fixture.detectChanges();
         dispatchEvent(getDOM().getGlobalEventTarget('window'), 'domEvent');
         expect(globalCounter).toEqual(1);
 
-        fixture.debugElement.componentInstance.ctxBoolProp = true;
+        fixture.componentInstance.ctxBoolProp = true;
         fixture.detectChanges();
         dispatchEvent(getDOM().getGlobalEventTarget('window'), 'domEvent');
         expect(globalCounter).toEqual(2);
@@ -940,10 +939,10 @@ function declareTests({useJit}: {useJit: boolean}) {
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
 
-        fixture.debugElement.componentInstance.ctxProp = 'Default Interpolation';
+        fixture.componentInstance.ctxProp = 'Default Interpolation';
 
         fixture.detectChanges();
-        expect(fixture.debugElement.nativeElement)
+        expect(fixture.nativeElement)
             .toHaveText(
                 'Default Interpolation\nCustom Interpolation A\nCustom Interpolation B (Default Interpolation)');
       });
@@ -1061,7 +1060,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         var providing = fixture.debugElement.children[0].references['providing'];
         expect(providing.created).toBe(false);
 
-        fixture.debugElement.componentInstance.ctxBoolProp = true;
+        fixture.componentInstance.ctxBoolProp = true;
         fixture.detectChanges();
 
         expect(providing.created).toBe(true);
@@ -1077,8 +1076,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
 
-        expect(getDOM().querySelectorAll(fixture.debugElement.nativeElement, 'script').length)
-            .toEqual(0);
+        expect(getDOM().querySelectorAll(fixture.nativeElement, 'script').length).toEqual(0);
       });
 
       it('should throw when using directives without selector', () => {
@@ -1179,7 +1177,7 @@ function declareTests({useJit}: {useJit: boolean}) {
           expect(getDOM().nodeName(c.componentRenderElement).toUpperCase()).toEqual('DIV');
           expect((<Injector>c.injector).get).toBeTruthy();
           expect(c.source).toContain(':0:7');
-          expect(c.context).toBe(fixture.debugElement.componentInstance);
+          expect(c.context).toBe(fixture.componentInstance);
           expect(c.references['local']).toBeDefined();
         }
       });
@@ -1221,7 +1219,7 @@ function declareTests({useJit}: {useJit: boolean}) {
                expect(getDOM().nodeName(c.renderNode).toUpperCase()).toEqual('SPAN');
                expect(getDOM().nodeName(c.componentRenderElement).toUpperCase()).toEqual('DIV');
                expect((<Injector>c.injector).get).toBeTruthy();
-               expect(c.context).toBe(fixture.debugElement.componentInstance);
+               expect(c.context).toBe(fixture.componentInstance);
                expect(c.references['local']).toBeDefined();
              }
            }));
@@ -1264,7 +1262,7 @@ function declareTests({useJit}: {useJit: boolean}) {
       TestBed.overrideComponent(MyComp, {set: {template}});
       const fixture = TestBed.createComponent(MyComp);
 
-      expect(fixture.debugElement.nativeElement).toHaveText('hello imp view');
+      expect(fixture.nativeElement).toHaveText('hello imp view');
     });
 
     it('should support moving embedded views around', () => {
@@ -1280,14 +1278,14 @@ function declareTests({useJit}: {useJit: boolean}) {
       fixture.detectChanges();
       expect(anchorElement).toHaveText('');
 
-      fixture.debugElement.componentInstance.ctxBoolProp = true;
+      fixture.componentInstance.ctxBoolProp = true;
       fixture.detectChanges();
 
       expect(anchorElement).toHaveText('hello');
 
-      fixture.debugElement.componentInstance.ctxBoolProp = false;
+      fixture.componentInstance.ctxBoolProp = false;
       fixture.detectChanges();
-      expect(fixture.debugElement.nativeElement).toHaveText('');
+      expect(fixture.nativeElement).toHaveText('');
     });
 
     describe('Property bindings', () => {
@@ -1318,10 +1316,10 @@ function declareTests({useJit}: {useJit: boolean}) {
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
 
-        fixture.debugElement.componentInstance.ctxProp = 'TITLE';
+        fixture.componentInstance.ctxProp = 'TITLE';
         fixture.detectChanges();
 
-        var el = getDOM().querySelector(fixture.debugElement.nativeElement, 'span');
+        var el = getDOM().querySelector(fixture.nativeElement, 'span');
         expect(isBlank(el.title) || el.title == '').toBeTruthy();
       });
 
@@ -1331,10 +1329,10 @@ function declareTests({useJit}: {useJit: boolean}) {
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
 
-        fixture.debugElement.componentInstance.ctxProp = 'TITLE';
+        fixture.componentInstance.ctxProp = 'TITLE';
         fixture.detectChanges();
 
-        var el = getDOM().querySelector(fixture.debugElement.nativeElement, 'span');
+        var el = getDOM().querySelector(fixture.nativeElement, 'span');
         expect(el.title).toEqual('TITLE');
       });
     });
@@ -1348,10 +1346,10 @@ function declareTests({useJit}: {useJit: boolean}) {
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
 
-        fixture.debugElement.componentInstance.ctxProp = 'hello';
+        fixture.componentInstance.ctxProp = 'hello';
         fixture.detectChanges();
 
-        expect(getDOM().getInnerHTML(fixture.debugElement.nativeElement))
+        expect(getDOM().getInnerHTML(fixture.nativeElement))
             .toContain('ng-reflect-dir-prop="hello"');
       });
 
@@ -1361,10 +1359,10 @@ function declareTests({useJit}: {useJit: boolean}) {
         TestBed.overrideComponent(MyComp, {set: {template}});
         const fixture = TestBed.createComponent(MyComp);
 
-        fixture.debugElement.componentInstance.ctxBoolProp = true;
+        fixture.componentInstance.ctxBoolProp = true;
         fixture.detectChanges();
 
-        expect(getDOM().getInnerHTML(fixture.debugElement.nativeElement))
+        expect(getDOM().getInnerHTML(fixture.nativeElement))
             .toContain('"ng\-reflect\-ng\-if"\: "true"');
       });
 
@@ -1375,7 +1373,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         const fixture = TestBed.createComponent(MyComp);
 
         fixture.detectChanges();
-        expect(getDOM().getInnerHTML(fixture.debugElement.nativeElement)).toContain('[ERROR]');
+        expect(getDOM().getInnerHTML(fixture.nativeElement)).toContain('[ERROR]');
       });
     });
 
@@ -1430,7 +1428,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
              tick();
 
-             expect(fixture.debugElement.componentInstance.ctxProp).toEqual('called');
+             expect(fixture.componentInstance.ctxProp).toEqual('called');
            }));
 
 
@@ -1477,7 +1475,7 @@ function declareTests({useJit}: {useJit: boolean}) {
           TestBed.overrideComponent(MyComp, {set: {template}});
           const fixture = TestBed.createComponent(MyComp);
 
-          var el = fixture.debugElement.nativeElement;
+          var el = fixture.nativeElement;
           var svg = getDOM().childNodes(el)[0];
           var use = getDOM().childNodes(svg)[0];
           expect(getDOM().getProperty(<Element>svg, 'namespaceURI'))
@@ -1497,7 +1495,7 @@ function declareTests({useJit}: {useJit: boolean}) {
           TestBed.overrideComponent(MyComp, {set: {template}});
           const fixture = TestBed.createComponent(MyComp);
 
-          var el = fixture.debugElement.nativeElement;
+          var el = fixture.nativeElement;
           var svg = getDOM().childNodes(el)[0];
           var foreignObject = getDOM().childNodes(svg)[0];
           var p = getDOM().childNodes(foreignObject)[0];
@@ -1518,7 +1516,7 @@ function declareTests({useJit}: {useJit: boolean}) {
           TestBed.overrideComponent(SomeCmp, {set: {template}});
           const fixture = TestBed.createComponent(SomeCmp);
 
-          let useEl = getDOM().firstChild(fixture.debugElement.nativeElement);
+          let useEl = getDOM().firstChild(fixture.nativeElement);
           expect(getDOM().getAttributeNS(useEl, 'http://www.w3.org/1999/xlink', 'href'))
               .toEqual('#id');
         });
@@ -1529,8 +1527,8 @@ function declareTests({useJit}: {useJit: boolean}) {
           TestBed.overrideComponent(SomeCmp, {set: {template}});
           const fixture = TestBed.createComponent(SomeCmp);
 
-          let cmp = fixture.debugElement.componentInstance;
-          let useEl = getDOM().firstChild(fixture.debugElement.nativeElement);
+          let cmp = fixture.componentInstance;
+          let useEl = getDOM().firstChild(fixture.nativeElement);
 
           cmp.value = '#id';
           fixture.detectChanges();
diff --git a/modules/@angular/core/test/linker/ng_container_integration_spec.ts b/modules/@angular/core/test/linker/ng_container_integration_spec.ts
index 6c947ce5b1..1e4559cf83 100644
--- a/modules/@angular/core/test/linker/ng_container_integration_spec.ts
+++ b/modules/@angular/core/test/linker/ng_container_integration_spec.ts
@@ -34,7 +34,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
       fixture.detectChanges();
 
-      const el = fixture.debugElement.nativeElement;
+      const el = fixture.nativeElement;
       expect(el).toHaveText('foo');
     });
 
@@ -45,7 +45,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
       fixture.detectChanges();
 
-      const el = fixture.debugElement.nativeElement;
+      const el = fixture.nativeElement;
       const children = getDOM().childNodes(el);
       expect(children.length).toBe(2);
       expect(getDOM().isCommentNode(children[0])).toBe(true);
@@ -60,7 +60,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
       fixture.detectChanges();
 
-      const el = fixture.debugElement.nativeElement;
+      const el = fixture.nativeElement;
       const children = getDOM().childNodes(el);
       expect(children.length).toBe(5);
       expect(getDOM().isCommentNode(children[0])).toBe(true);
@@ -75,10 +75,10 @@ function declareTests({useJit}: {useJit: boolean}) {
       TestBed.overrideComponent(MyComp, {set: {template}});
       const fixture = TestBed.createComponent(MyComp);
 
-      fixture.debugElement.componentInstance.ctxBoolProp = true;
+      fixture.componentInstance.ctxBoolProp = true;
       fixture.detectChanges();
 
-      const el = fixture.debugElement.nativeElement;
+      const el = fixture.nativeElement;
       const children = getDOM().childNodes(el);
 
       expect(children.length).toBe(4);
@@ -89,7 +89,7 @@ function declareTests({useJit}: {useJit: boolean}) {
       expect(getDOM().tagName(children[2]).toUpperCase()).toEqual('P');
       expect(getDOM().tagName(children[3]).toUpperCase()).toEqual('B');
 
-      fixture.debugElement.componentInstance.ctxBoolProp = false;
+      fixture.componentInstance.ctxBoolProp = false;
       fixture.detectChanges();
 
       expect(children.length).toBe(1);
@@ -103,7 +103,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
       fixture.detectChanges();
 
-      const el = fixture.debugElement.nativeElement;
+      const el = fixture.nativeElement;
       expect(el).toHaveText('SIMPLE(12)');
     });
 
diff --git a/modules/@angular/core/test/linker/projection_integration_spec.ts b/modules/@angular/core/test/linker/projection_integration_spec.ts
index 1ece1aa955..c41694cfa1 100644
--- a/modules/@angular/core/test/linker/projection_integration_spec.ts
+++ b/modules/@angular/core/test/linker/projection_integration_spec.ts
@@ -23,7 +23,7 @@ export function main() {
       TestBed.overrideComponent(MainComp, {set: {template}});
       const main = TestBed.createComponent(MainComp);
 
-      expect(main.debugElement.nativeElement).toHaveText('SIMPLE(A)');
+      expect(main.nativeElement).toHaveText('SIMPLE(A)');
     });
 
     it('should support simple components with text interpolation as direct children', () => {
@@ -33,9 +33,9 @@ export function main() {
       TestBed.overrideComponent(MainComp, {set: {template}});
       const main = TestBed.createComponent(MainComp);
 
-      main.debugElement.componentInstance.text = 'A';
+      main.componentInstance.text = 'A';
       main.detectChanges();
-      expect(main.debugElement.nativeElement).toHaveText('START(SIMPLE(A))END');
+      expect(main.nativeElement).toHaveText('START(SIMPLE(A))END');
     });
 
     it('should support projecting text interpolation to a non bound element', () => {
@@ -44,9 +44,9 @@ export function main() {
       TestBed.overrideComponent(MainComp, {set: {template: '<simple>{{text}}</simple>'}});
       const main = TestBed.createComponent(MainComp);
 
-      main.debugElement.componentInstance.text = 'A';
+      main.componentInstance.text = 'A';
       main.detectChanges();
-      expect(main.debugElement.nativeElement).toHaveText('SIMPLE(A)');
+      expect(main.nativeElement).toHaveText('SIMPLE(A)');
     });
 
     it('should support projecting text interpolation to a non bound element with other bound elements after it',
@@ -59,9 +59,9 @@ export function main() {
          TestBed.overrideComponent(MainComp, {set: {template: '<simple>{{text}}</simple>'}});
          const main = TestBed.createComponent(MainComp);
 
-         main.debugElement.componentInstance.text = 'A';
+         main.componentInstance.text = 'A';
          main.detectChanges();
-         expect(main.debugElement.nativeElement).toHaveText('SIMPLE(AEL)');
+         expect(main.nativeElement).toHaveText('SIMPLE(AEL)');
        });
 
     it('should project content components', () => {
@@ -72,7 +72,7 @@ export function main() {
       const main = TestBed.createComponent(MainComp);
 
       main.detectChanges();
-      expect(main.debugElement.nativeElement).toHaveText('SIMPLE(0|1|2)');
+      expect(main.nativeElement).toHaveText('SIMPLE(0|1|2)');
     });
 
     it('should not show the light dom even if there is no content tag', () => {
@@ -80,7 +80,7 @@ export function main() {
       TestBed.overrideComponent(MainComp, {set: {template: '<empty>A</empty>'}});
       const main = TestBed.createComponent(MainComp);
 
-      expect(main.debugElement.nativeElement).toHaveText('');
+      expect(main.nativeElement).toHaveText('');
     });
 
     it('should support multiple content tags', () => {
@@ -96,7 +96,7 @@ export function main() {
       });
       const main = TestBed.createComponent(MainComp);
 
-      expect(main.debugElement.nativeElement).toHaveText('(A, BC)');
+      expect(main.nativeElement).toHaveText('(A, BC)');
     });
 
     it('should redistribute only direct children', () => {
@@ -111,7 +111,7 @@ export function main() {
       });
       const main = TestBed.createComponent(MainComp);
 
-      expect(main.debugElement.nativeElement).toHaveText('(, BAC)');
+      expect(main.nativeElement).toHaveText('(, BAC)');
     });
 
     it('should redistribute direct child viewcontainers when the light dom changes', () => {
@@ -131,13 +131,13 @@ export function main() {
                                    .childNodes.filter(By.directive(ManualViewportDirective))
                                    .map(de => de.injector.get(ManualViewportDirective));
 
-      expect(main.debugElement.nativeElement).toHaveText('(, B)');
+      expect(main.nativeElement).toHaveText('(, B)');
       viewportDirectives.forEach(d => d.show());
-      expect(main.debugElement.nativeElement).toHaveText('(A1, B)');
+      expect(main.nativeElement).toHaveText('(A1, B)');
 
       viewportDirectives.forEach(d => d.hide());
 
-      expect(main.debugElement.nativeElement).toHaveText('(, B)');
+      expect(main.nativeElement).toHaveText('(, B)');
     });
 
     it('should support nested components', () => {
@@ -152,7 +152,7 @@ export function main() {
       });
       const main = TestBed.createComponent(MainComp);
 
-      expect(main.debugElement.nativeElement).toHaveText('OUTER(SIMPLE(AB))');
+      expect(main.nativeElement).toHaveText('OUTER(SIMPLE(AB))');
     });
 
     it('should support nesting with content being direct child of a nested component', () => {
@@ -175,10 +175,10 @@ export function main() {
           main.debugElement.queryAllNodes(By.directive(ManualViewportDirective))[0].injector.get(
               ManualViewportDirective);
 
-      expect(main.debugElement.nativeElement).toHaveText('OUTER(INNER(INNERINNER(,BC)))');
+      expect(main.nativeElement).toHaveText('OUTER(INNER(INNERINNER(,BC)))');
       viewportDirective.show();
 
-      expect(main.debugElement.nativeElement).toHaveText('OUTER(INNER(INNERINNER(A,BC)))');
+      expect(main.nativeElement).toHaveText('OUTER(INNER(INNERINNER(A,BC)))');
     });
 
     it('should redistribute when the shadow dom changes', () => {
@@ -199,14 +199,14 @@ export function main() {
           main.debugElement.queryAllNodes(By.directive(ManualViewportDirective))[0].injector.get(
               ManualViewportDirective);
 
-      expect(main.debugElement.nativeElement).toHaveText('(, BC)');
+      expect(main.nativeElement).toHaveText('(, BC)');
 
       viewportDirective.show();
-      expect(main.debugElement.nativeElement).toHaveText('(A, BC)');
+      expect(main.nativeElement).toHaveText('(A, BC)');
 
       viewportDirective.hide();
 
-      expect(main.debugElement.nativeElement).toHaveText('(, BC)');
+      expect(main.nativeElement).toHaveText('(, BC)');
     });
 
     // GH-2095 - https://github.com/angular/angular/issues/2095
@@ -220,7 +220,7 @@ export function main() {
 
       main.detectChanges();
 
-      expect(main.debugElement.nativeElement).toHaveText('P,text');
+      expect(main.nativeElement).toHaveText('P,text');
     });
 
     // important as we are moving style tags around during compilation,
@@ -232,7 +232,7 @@ export function main() {
       const main = TestBed.createComponent(MainComp);
 
       main.detectChanges();
-      expect(main.debugElement.nativeElement).toHaveText('P,text');
+      expect(main.nativeElement).toHaveText('P,text');
     });
 
     it('should support moving non projected light dom around', () => {
@@ -263,10 +263,10 @@ export function main() {
           main.debugElement.queryAllNodes(By.directive(ProjectDirective))[0].injector.get(
               ProjectDirective);
 
-      expect(main.debugElement.nativeElement).toHaveText('START()END');
+      expect(main.nativeElement).toHaveText('START()END');
 
       projectDirective.show(sourceDirective.templateRef);
-      expect(main.debugElement.nativeElement).toHaveText('START(A)END');
+      expect(main.nativeElement).toHaveText('START(A)END');
     });
 
     it('should support moving projected light dom around', () => {
@@ -286,10 +286,10 @@ export function main() {
       var projectDirective: ProjectDirective =
           main.debugElement.queryAllNodes(By.directive(ProjectDirective))[0].injector.get(
               ProjectDirective);
-      expect(main.debugElement.nativeElement).toHaveText('SIMPLE()START()END');
+      expect(main.nativeElement).toHaveText('SIMPLE()START()END');
 
       projectDirective.show(sourceDirective.templateRef);
-      expect(main.debugElement.nativeElement).toHaveText('SIMPLE()START(A)END');
+      expect(main.nativeElement).toHaveText('SIMPLE()START(A)END');
     });
 
     it('should support moving ng-content around', () => {
@@ -312,15 +312,15 @@ export function main() {
       var projectDirective: ProjectDirective =
           main.debugElement.queryAllNodes(By.directive(ProjectDirective))[0].injector.get(
               ProjectDirective);
-      expect(main.debugElement.nativeElement).toHaveText('(, B)START()END');
+      expect(main.nativeElement).toHaveText('(, B)START()END');
 
       projectDirective.show(sourceDirective.templateRef);
-      expect(main.debugElement.nativeElement).toHaveText('(, B)START(A)END');
+      expect(main.nativeElement).toHaveText('(, B)START(A)END');
 
       // Stamping ng-content multiple times should not produce the content multiple
       // times...
       projectDirective.show(sourceDirective.templateRef);
-      expect(main.debugElement.nativeElement).toHaveText('(, B)START(A)END');
+      expect(main.nativeElement).toHaveText('(, B)START(A)END');
     });
 
     // Note: This does not use a ng-content element, but
@@ -335,10 +335,10 @@ export function main() {
       var manualDirective: ManualViewportDirective =
           main.debugElement.queryAllNodes(By.directive(ManualViewportDirective))[0].injector.get(
               ManualViewportDirective);
-      expect(main.debugElement.nativeElement).toHaveText('TREE(0:)');
+      expect(main.nativeElement).toHaveText('TREE(0:)');
       manualDirective.show();
       main.detectChanges();
-      expect(main.debugElement.nativeElement).toHaveText('TREE(0:TREE(1:))');
+      expect(main.nativeElement).toHaveText('TREE(0:TREE(1:))');
     });
 
     // Note: This does not use a ng-content element, but
@@ -353,21 +353,21 @@ export function main() {
 
       main.detectChanges();
 
-      expect(main.debugElement.nativeElement).toHaveText('TREE(0:)');
+      expect(main.nativeElement).toHaveText('TREE(0:)');
 
       var tree = main.debugElement.query(By.directive(Tree));
       var manualDirective: ManualViewportDirective = tree.queryAllNodes(By.directive(
           ManualViewportDirective))[0].injector.get(ManualViewportDirective);
       manualDirective.show();
       main.detectChanges();
-      expect(main.debugElement.nativeElement).toHaveText('TREE(0:TREE2(1:))');
+      expect(main.nativeElement).toHaveText('TREE(0:TREE2(1:))');
 
       var tree2 = main.debugElement.query(By.directive(Tree2));
       manualDirective = tree2.queryAllNodes(By.directive(ManualViewportDirective))[0].injector.get(
           ManualViewportDirective);
       manualDirective.show();
       main.detectChanges();
-      expect(main.debugElement.nativeElement).toHaveText('TREE(0:TREE2(1:TREE(2:)))');
+      expect(main.nativeElement).toHaveText('TREE(0:TREE2(1:TREE(2:)))');
     });
 
     if (getDOM().supportsNativeShadowDOM()) {
@@ -381,7 +381,7 @@ export function main() {
         });
         const main = TestBed.createComponent(MainComp);
 
-        var childNodes = getDOM().childNodes(main.debugElement.nativeElement);
+        var childNodes = getDOM().childNodes(main.nativeElement);
         expect(childNodes[0]).toHaveText('div {color: red}SIMPLE1(A)');
         expect(childNodes[1]).toHaveText('div {color: blue}SIMPLE2(B)');
         main.destroy();
@@ -400,7 +400,7 @@ export function main() {
         });
         const main = TestBed.createComponent(MainComp);
 
-        var mainEl = main.debugElement.nativeElement;
+        var mainEl = main.nativeElement;
         var div1 = getDOM().firstChild(mainEl);
         var div2 = getDOM().createElement('div');
         getDOM().setAttribute(div2, 'class', 'redStyle');
@@ -420,7 +420,7 @@ export function main() {
         });
         const main = TestBed.createComponent(MainComp);
 
-        var mainEl = main.debugElement.nativeElement;
+        var mainEl = main.nativeElement;
         var div1 = getDOM().firstChild(mainEl);
         var div2 = getDOM().createElement('div');
         getDOM().appendChild(mainEl, div2);
@@ -436,16 +436,16 @@ export function main() {
           MainComp, {set: {template: `<conditional-text>a</conditional-text>`}});
       const main = TestBed.createComponent(MainComp);
 
-      expect(main.debugElement.nativeElement).toHaveText('MAIN()');
+      expect(main.nativeElement).toHaveText('MAIN()');
 
       var viewportElement =
           main.debugElement.queryAllNodes(By.directive(ManualViewportDirective))[0];
       viewportElement.injector.get(ManualViewportDirective).show();
-      expect(main.debugElement.nativeElement).toHaveText('MAIN(FIRST())');
+      expect(main.nativeElement).toHaveText('MAIN(FIRST())');
 
       viewportElement = main.debugElement.queryAllNodes(By.directive(ManualViewportDirective))[1];
       viewportElement.injector.get(ManualViewportDirective).show();
-      expect(main.debugElement.nativeElement).toHaveText('MAIN(FIRST(SECOND(a)))');
+      expect(main.nativeElement).toHaveText('MAIN(FIRST(SECOND(a)))');
     });
 
     it('should allow to switch the order of nested components via ng-content', () => {
@@ -454,7 +454,7 @@ export function main() {
       const main = TestBed.createComponent(MainComp);
 
       main.detectChanges();
-      expect(getDOM().getInnerHTML(main.debugElement.nativeElement))
+      expect(getDOM().getInnerHTML(main.nativeElement))
           .toEqual(
               '<cmp-a><cmp-b><cmp-d><i>cmp-d</i></cmp-d></cmp-b>' +
               '<cmp-c><b>cmp-c</b></cmp-c></cmp-a>');
@@ -467,7 +467,7 @@ export function main() {
       const main = TestBed.createComponent(MainComp);
 
       main.detectChanges();
-      expect(getDOM().getInnerHTML(main.debugElement.nativeElement))
+      expect(getDOM().getInnerHTML(main.nativeElement))
           .toEqual(
               '<cmp-a1>a1<cmp-b11>b11</cmp-b11><cmp-b12>b12</cmp-b12></cmp-a1>' +
               '<cmp-a2>a2<cmp-b21>b21</cmp-b21><cmp-b22>b22</cmp-b22></cmp-a2>');
@@ -494,12 +494,12 @@ export function main() {
           conditionalComp.queryAllNodes(By.directive(ManualViewportDirective))[0].injector.get(
               ManualViewportDirective);
 
-      expect(main.debugElement.nativeElement).toHaveText('(, D)');
-      expect(main.debugElement.nativeElement).toHaveText('(, D)');
+      expect(main.nativeElement).toHaveText('(, D)');
+      expect(main.nativeElement).toHaveText('(, D)');
 
       viewViewportDir.show();
 
-      expect(main.debugElement.nativeElement).toHaveText('(AC, D)');
+      expect(main.nativeElement).toHaveText('(AC, D)');
 
       var contentViewportDir =
           conditionalComp.queryAllNodes(By.directive(ManualViewportDirective))[1].injector.get(
@@ -507,12 +507,12 @@ export function main() {
 
       contentViewportDir.show();
 
-      expect(main.debugElement.nativeElement).toHaveText('(ABC, D)');
+      expect(main.nativeElement).toHaveText('(ABC, D)');
 
       // hide view viewport, and test that it also hides
       // the content viewport's views
       viewViewportDir.hide();
-      expect(main.debugElement.nativeElement).toHaveText('(, D)');
+      expect(main.nativeElement).toHaveText('(, D)');
     });
   });
 }
diff --git a/modules/@angular/core/test/linker/query_integration_spec.ts b/modules/@angular/core/test/linker/query_integration_spec.ts
index 16b6e4d224..4928c9c2bc 100644
--- a/modules/@angular/core/test/linker/query_integration_spec.ts
+++ b/modules/@angular/core/test/linker/query_integration_spec.ts
@@ -84,14 +84,14 @@ export function main() {
         TestBed.overrideComponent(MyComp0, {set: {template}});
         const view = TestBed.createComponent(MyComp0);
 
-        view.debugElement.componentInstance.shouldShow = true;
+        view.componentInstance.shouldShow = true;
         view.detectChanges();
 
         var q: NeedsContentChild = view.debugElement.children[0].references['q'];
 
         expect(q.logs).toEqual([['setter', 'foo'], ['init', 'foo'], ['check', 'foo']]);
 
-        view.debugElement.componentInstance.shouldShow = false;
+        view.componentInstance.shouldShow = false;
         view.detectChanges();
 
         expect(q.logs).toEqual([
@@ -199,7 +199,7 @@ export function main() {
         view.detectChanges();
         expect(asNativeElements(view.debugElement.children)).toHaveText('2|');
 
-        view.debugElement.componentInstance.shouldShow = true;
+        view.componentInstance.shouldShow = true;
         view.detectChanges();
         expect(asNativeElements(view.debugElement.children)).toHaveText('2|3|');
       });
@@ -212,7 +212,7 @@ export function main() {
         TestBed.overrideComponent(MyComp0, {set: {template}});
         const fixture = TestBed.createComponent(MyComp0);
 
-        fixture.debugElement.componentInstance.shouldShow = true;
+        fixture.componentInstance.shouldShow = true;
         fixture.detectChanges();
         fixture.destroy();
       });
@@ -228,7 +228,7 @@ export function main() {
 
         expect(asNativeElements(view.debugElement.children)).toHaveText('2|1d|2d|3d|');
 
-        view.debugElement.componentInstance.list = ['3d', '2d'];
+        view.componentInstance.list = ['3d', '2d'];
         view.detectChanges();
         expect(asNativeElements(view.debugElement.children)).toHaveText('2|3d|2d|');
       });
@@ -357,7 +357,7 @@ export function main() {
              }
            });
 
-           view.debugElement.componentInstance.shouldShow = true;
+           view.componentInstance.shouldShow = true;
            view.detectChanges();
          }));
 
@@ -368,17 +368,17 @@ export function main() {
            TestBed.overrideComponent(MyComp0, {set: {template}});
            const view = TestBed.createComponent(MyComp0);
 
-           view.debugElement.componentInstance.shouldShow = true;
+           view.componentInstance.shouldShow = true;
            view.detectChanges();
 
            var q: NeedsQuery = view.debugElement.children[0].references['q'];
 
            expect(q.query.length).toEqual(1);
 
-           view.debugElement.componentInstance.shouldShow = false;
+           view.componentInstance.shouldShow = false;
            view.detectChanges();
 
-           view.debugElement.componentInstance.shouldShow = true;
+           view.componentInstance.shouldShow = true;
            view.detectChanges();
 
            var q2: NeedsQuery = view.debugElement.children[0].references['q'];
@@ -398,7 +398,7 @@ export function main() {
 
            var q = view.debugElement.children[0].references['q'];
 
-           view.debugElement.componentInstance.list = ['1d', '2d'];
+           view.componentInstance.list = ['1d', '2d'];
 
            view.detectChanges();
 
@@ -430,11 +430,11 @@ export function main() {
 
         var q = view.debugElement.children[0].references['q'];
 
-        view.debugElement.componentInstance.list = ['1d', '2d'];
+        view.componentInstance.list = ['1d', '2d'];
 
         view.detectChanges();
 
-        view.debugElement.componentInstance.list = ['2d', '1d'];
+        view.componentInstance.list = ['2d', '1d'];
 
         view.detectChanges();
 
@@ -452,7 +452,7 @@ export function main() {
 
         var q = view.debugElement.children[0].references['q'];
 
-        view.debugElement.componentInstance.list = ['1d', '2d'];
+        view.componentInstance.list = ['1d', '2d'];
 
         view.detectChanges();
 
diff --git a/modules/@angular/core/test/linker/regression_integration_spec.ts b/modules/@angular/core/test/linker/regression_integration_spec.ts
index 1972fdf8ca..cf4575058f 100644
--- a/modules/@angular/core/test/linker/regression_integration_spec.ts
+++ b/modules/@angular/core/test/linker/regression_integration_spec.ts
@@ -165,8 +165,7 @@ function declareTests({useJit}: {useJit: boolean}) {
       TestBed.configureTestingModule(
           {declarations: [HeroComponent, VillianComponent, MainComponent]});
       const fixture = TestBed.createComponent(MainComponent);
-      expect(fixture.debugElement.nativeElement)
-          .toHaveText('I was saved by my hero from a villian.');
+      expect(fixture.nativeElement).toHaveText('I was saved by my hero from a villian.');
     });
   });
 }
diff --git a/modules/@angular/core/test/linker/security_integration_spec.ts b/modules/@angular/core/test/linker/security_integration_spec.ts
index 3fb0891e90..b0f302d3fa 100644
--- a/modules/@angular/core/test/linker/security_integration_spec.ts
+++ b/modules/@angular/core/test/linker/security_integration_spec.ts
@@ -21,8 +21,7 @@ export function main() {
 
 @Component({selector: 'my-comp', template: ''})
 class SecuredComponent {
-  ctxProp: string;
-  constructor() { this.ctxProp = 'some value'; }
+  ctxProp: any = 'some value';
 }
 
 function declareTests({useJit}: {useJit: boolean}) {
@@ -81,7 +80,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         const sanitizer: DomSanitizer = getTestBed().get(DomSanitizer);
 
         let e = fixture.debugElement.children[0].nativeElement;
-        let ci = fixture.debugElement.componentInstance;
+        let ci = fixture.componentInstance;
         let trusted = sanitizer.bypassSecurityTrustUrl('javascript:alert(1)');
         ci.ctxProp = trusted;
         fixture.detectChanges();
@@ -95,7 +94,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         const sanitizer: DomSanitizer = getTestBed().get(DomSanitizer);
 
         let trusted = sanitizer.bypassSecurityTrustScript('javascript:alert(1)');
-        let ci = fixture.debugElement.componentInstance;
+        let ci = fixture.componentInstance;
         ci.ctxProp = trusted;
         expect(() => fixture.detectChanges()).toThrowError(/Required a safe URL, got a Script/);
       });
@@ -108,7 +107,7 @@ function declareTests({useJit}: {useJit: boolean}) {
 
         let e = fixture.debugElement.children[0].nativeElement;
         let trusted = sanitizer.bypassSecurityTrustUrl('bar/baz');
-        let ci = fixture.debugElement.componentInstance;
+        let ci = fixture.componentInstance;
         ci.ctxProp = trusted;
         fixture.detectChanges();
         expect(getDOM().getProperty(e, 'href')).toMatch(/SafeValue(%20| )must(%20| )use/);
@@ -122,7 +121,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         const fixture = TestBed.createComponent(SecuredComponent);
 
         let e = fixture.debugElement.children[0].nativeElement;
-        let ci = fixture.debugElement.componentInstance;
+        let ci = fixture.componentInstance;
         ci.ctxProp = 'hello';
         fixture.detectChanges();
         // In the browser, reading href returns an absolute URL. On the server side,
@@ -140,7 +139,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         const fixture = TestBed.createComponent(SecuredComponent);
 
         let e = fixture.debugElement.children[0].nativeElement;
-        let ci = fixture.debugElement.componentInstance;
+        let ci = fixture.componentInstance;
         // Make sure binding harmless values works.
         ci.ctxProp = 'red';
         fixture.detectChanges();
@@ -172,7 +171,7 @@ function declareTests({useJit}: {useJit: boolean}) {
         const fixture = TestBed.createComponent(SecuredComponent);
 
         let e = fixture.debugElement.children[0].nativeElement;
-        let ci = fixture.debugElement.componentInstance;
+        let ci = fixture.componentInstance;
         // Make sure binding harmless values works.
         ci.ctxProp = 'some <p>text</p>';
         fixture.detectChanges();
diff --git a/modules/@angular/core/testing/component_fixture.ts b/modules/@angular/core/testing/component_fixture.ts
index 49df10bb0b..e9b54233bb 100644
--- a/modules/@angular/core/testing/component_fixture.ts
+++ b/modules/@angular/core/testing/component_fixture.ts
@@ -36,23 +36,11 @@ export class ComponentFixture<T> {
    */
   elementRef: ElementRef;
 
-  /**
-   * The ComponentRef for the component
-   */
-  componentRef: ComponentRef<T>;
-
   /**
    * The ChangeDetectorRef for the component
    */
   changeDetectorRef: ChangeDetectorRef;
 
-  /**
-   * The NgZone in which this component was instantiated.
-   */
-  ngZone: NgZone;
-
-  private _autoDetect: boolean;
-
   private _isStable: boolean = true;
   private _isDestroyed: boolean = false;
   private _resolve: (result: any) => void;
@@ -62,7 +50,8 @@ export class ComponentFixture<T> {
   private _onMicrotaskEmptySubscription: any /** TODO #9100 */ = null;
   private _onErrorSubscription: any /** TODO #9100 */ = null;
 
-  constructor(componentRef: ComponentRef<T>, ngZone: NgZone, autoDetect: boolean) {
+  constructor(
+      public componentRef: ComponentRef<T>, public ngZone: NgZone, private _autoDetect: boolean) {
     this.changeDetectorRef = componentRef.changeDetectorRef;
     this.elementRef = componentRef.location;
     this.debugElement = <DebugElement>getDebugNode(this.elementRef.nativeElement);
@@ -70,7 +59,6 @@ export class ComponentFixture<T> {
     this.nativeElement = this.elementRef.nativeElement;
     this.componentRef = componentRef;
     this.ngZone = ngZone;
-    this._autoDetect = autoDetect;
 
     if (ngZone != null) {
       this._onUnstableSubscription =
diff --git a/modules/@angular/forms/test/form_array_spec.ts b/modules/@angular/forms/test/form_array_spec.ts
index c5fadaa805..17569940c3 100644
--- a/modules/@angular/forms/test/form_array_spec.ts
+++ b/modules/@angular/forms/test/form_array_spec.ts
@@ -8,7 +8,7 @@
 
 import {fakeAsync, tick} from '@angular/core/testing';
 import {AsyncTestCompleter, beforeEach, ddescribe, describe, iit, inject, it, xit} from '@angular/core/testing/testing_internal';
-import {AbstractControl, FormArray, FormControl, FormGroup} from '@angular/forms';
+import {FormArray, FormControl, FormGroup} from '@angular/forms';
 
 import {isPresent} from '../src/facade/lang';
 import {Validators} from '../src/validators';
diff --git a/modules/@angular/forms/test/form_builder_spec.ts b/modules/@angular/forms/test/form_builder_spec.ts
index 5e931506bf..51e6c6ba37 100644
--- a/modules/@angular/forms/test/form_builder_spec.ts
+++ b/modules/@angular/forms/test/form_builder_spec.ts
@@ -7,7 +7,7 @@
  */
 
 import {afterEach, beforeEach, ddescribe, describe, expect, iit, it, xit} from '@angular/core/testing/testing_internal';
-import {FormBuilder, FormControl} from '@angular/forms';
+import {FormBuilder} from '@angular/forms';
 
 export function main() {
   function syncValidator(_: any /** TODO #9100 */): any /** TODO #9100 */ { return null; }
diff --git a/modules/@angular/forms/test/reactive_integration_spec.ts b/modules/@angular/forms/test/reactive_integration_spec.ts
index cc35912ebb..fab4d2461f 100644
--- a/modules/@angular/forms/test/reactive_integration_spec.ts
+++ b/modules/@angular/forms/test/reactive_integration_spec.ts
@@ -6,9 +6,8 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {NgFor, NgIf} from '@angular/common';
 import {Component, Directive, EventEmitter, Input, Output, forwardRef} from '@angular/core';
-import {ComponentFixture, TestBed, fakeAsync, tick} from '@angular/core/testing';
+import {TestBed, fakeAsync, tick} from '@angular/core/testing';
 import {ControlValueAccessor, FormArray, FormControl, FormGroup, FormGroupDirective, FormsModule, NG_ASYNC_VALIDATORS, NG_VALIDATORS, NgControl, ReactiveFormsModule, Validator, Validators} from '@angular/forms';
 import {By} from '@angular/platform-browser/src/dom/debug/by';
 import {getDOM} from '@angular/platform-browser/src/dom/dom_adapter';
@@ -37,7 +36,7 @@ export function main() {
       it('should work with single controls', () => {
         const fixture = TestBed.createComponent(FormControlComp);
         const control = new FormControl('old value');
-        fixture.debugElement.componentInstance.control = control;
+        fixture.componentInstance.control = control;
         fixture.detectChanges();
 
         // model -> view
@@ -53,8 +52,7 @@ export function main() {
 
       it('should work with formGroups (model -> view)', () => {
         const fixture = TestBed.createComponent(FormGroupComp);
-        fixture.debugElement.componentInstance.form =
-            new FormGroup({'login': new FormControl('loginValue')});
+        fixture.componentInstance.form = new FormGroup({'login': new FormControl('loginValue')});
         fixture.detectChanges();
 
         const input = fixture.debugElement.query(By.css('input'));
@@ -64,7 +62,7 @@ export function main() {
       it('work with formGroups (view -> model)', () => {
         const fixture = TestBed.createComponent(FormGroupComp);
         const form = new FormGroup({'login': new FormControl('oldValue')});
-        fixture.debugElement.componentInstance.form = form;
+        fixture.componentInstance.form = form;
         fixture.detectChanges();
 
         const input = fixture.debugElement.query(By.css('input'));
@@ -80,12 +78,10 @@ export function main() {
 
       it('should update DOM elements initially', () => {
         const fixture = TestBed.createComponent(FormGroupComp);
-        fixture.debugElement.componentInstance.form =
-            new FormGroup({'login': new FormControl('oldValue')});
+        fixture.componentInstance.form = new FormGroup({'login': new FormControl('oldValue')});
         fixture.detectChanges();
 
-        fixture.debugElement.componentInstance.form =
-            new FormGroup({'login': new FormControl('newValue')});
+        fixture.componentInstance.form = new FormGroup({'login': new FormControl('newValue')});
         fixture.detectChanges();
 
         const input = fixture.debugElement.query(By.css('input'));
@@ -94,12 +90,11 @@ export function main() {
 
       it('should update model when UI changes', () => {
         const fixture = TestBed.createComponent(FormGroupComp);
-        fixture.debugElement.componentInstance.form =
-            new FormGroup({'login': new FormControl('oldValue')});
+        fixture.componentInstance.form = new FormGroup({'login': new FormControl('oldValue')});
         fixture.detectChanges();
 
         const newForm = new FormGroup({'login': new FormControl('newValue')});
-        fixture.debugElement.componentInstance.form = newForm;
+        fixture.componentInstance.form = newForm;
         fixture.detectChanges();
 
         const input = fixture.debugElement.query(By.css('input'));
@@ -117,12 +112,12 @@ export function main() {
       it('should work with radio buttons when reusing control', () => {
         const fixture = TestBed.createComponent(FormControlRadioButtons);
         const food = new FormControl('chicken');
-        fixture.debugElement.componentInstance.form =
+        fixture.componentInstance.form =
             new FormGroup({'food': food, 'drink': new FormControl('')});
         fixture.detectChanges();
 
         const newForm = new FormGroup({'food': food, 'drink': new FormControl('')});
-        fixture.debugElement.componentInstance.form = newForm;
+        fixture.componentInstance.form = newForm;
         fixture.detectChanges();
 
         newForm.setValue({food: 'fish', drink: ''});
@@ -134,7 +129,7 @@ export function main() {
 
       it('should update nested form group model when UI changes', () => {
         const fixture = TestBed.createComponent(NestedFormGroupComp);
-        fixture.debugElement.componentInstance.form = new FormGroup(
+        fixture.componentInstance.form = new FormGroup(
             {'signin': new FormGroup({'login': new FormControl(), 'password': new FormControl()})});
         fixture.detectChanges();
 
@@ -142,7 +137,7 @@ export function main() {
           'signin': new FormGroup(
               {'login': new FormControl('Nancy'), 'password': new FormControl('secret')})
         });
-        fixture.debugElement.componentInstance.form = newForm;
+        fixture.componentInstance.form = newForm;
         fixture.detectChanges();
 
         const inputs = fixture.debugElement.queryAll(By.css('input'));
@@ -168,7 +163,7 @@ export function main() {
           'max': new FormControl(''),
           'pattern': new FormControl('')
         });
-        fixture.debugElement.componentInstance.form = form;
+        fixture.componentInstance.form = form;
         fixture.detectChanges();
         expect(form.get('login').errors).toEqual({required: true});
 
@@ -178,7 +173,7 @@ export function main() {
           'max': new FormControl(''),
           'pattern': new FormControl('')
         });
-        fixture.debugElement.componentInstance.form = newForm;
+        fixture.componentInstance.form = newForm;
         fixture.detectChanges();
 
         expect(newForm.get('login').errors).toEqual({required: true});
@@ -190,7 +185,7 @@ export function main() {
           'signin':
               new FormGroup({'login': new FormControl(''), 'password': new FormControl('')})
         });
-        fixture.debugElement.componentInstance.form = form;
+        fixture.componentInstance.form = form;
         fixture.detectChanges();
         expect(form.get('signin').valid).toBe(false);
 
@@ -198,7 +193,7 @@ export function main() {
           'signin':
               new FormGroup({'login': new FormControl(''), 'password': new FormControl('')})
         });
-        fixture.debugElement.componentInstance.form = newForm;
+        fixture.componentInstance.form = newForm;
         fixture.detectChanges();
 
         expect(form.get('signin').valid).toBe(false);
@@ -210,7 +205,7 @@ export function main() {
           'signin':
               new FormGroup({'login': new FormControl(''), 'password': new FormControl('')})
         });
-        fixture.debugElement.componentInstance.form = form;
+        fixture.componentInstance.form = form;
         fixture.detectChanges();
 
         form.addControl('email', new FormControl('email'));
@@ -223,7 +218,7 @@ export function main() {
           'signin':
               new FormGroup({'login': new FormControl(''), 'password': new FormControl('')})
         });
-        fixture.debugElement.componentInstance.form = newForm;
+        fixture.componentInstance.form = newForm;
         fixture.detectChanges();
 
         emailInput = fixture.debugElement.query(By.css('[formControlName="email"]'));
@@ -234,8 +229,8 @@ export function main() {
         const fixture = TestBed.createComponent(FormArrayComp);
         const cityArray = new FormArray([new FormControl('SF'), new FormControl('NY')]);
         const form = new FormGroup({cities: cityArray});
-        fixture.debugElement.componentInstance.form = form;
-        fixture.debugElement.componentInstance.cityArray = cityArray;
+        fixture.componentInstance.form = form;
+        fixture.componentInstance.cityArray = cityArray;
         fixture.detectChanges();
 
         let inputs = fixture.debugElement.queryAll(By.css('input'));
@@ -248,8 +243,8 @@ export function main() {
 
         const newArr = new FormArray([new FormControl('SF'), new FormControl('NY')]);
         const newForm = new FormGroup({cities: newArr});
-        fixture.debugElement.componentInstance.form = newForm;
-        fixture.debugElement.componentInstance.cityArray = newArr;
+        fixture.componentInstance.form = newForm;
+        fixture.componentInstance.cityArray = newArr;
         fixture.detectChanges();
 
         inputs = fixture.debugElement.queryAll(By.css('input'));
@@ -261,7 +256,7 @@ export function main() {
         it('should attach dir to control when leaf control changes', () => {
           const form = new FormGroup({'login': new FormControl('oldValue')});
           const fixture = TestBed.createComponent(FormGroupComp);
-          fixture.debugElement.componentInstance.form = form;
+          fixture.componentInstance.form = form;
           fixture.detectChanges();
 
           form.removeControl('login');
@@ -288,7 +283,7 @@ export function main() {
             signin: new FormGroup(
                 {login: new FormControl('oldLogin'), password: new FormControl('oldPassword')})
           });
-          fixture.debugElement.componentInstance.form = form;
+          fixture.componentInstance.form = form;
           fixture.detectChanges();
 
           form.removeControl('signin');
@@ -318,8 +313,8 @@ export function main() {
           const fixture = TestBed.createComponent(FormArrayComp);
           const cityArray = new FormArray([new FormControl('SF'), new FormControl('NY')]);
           const form = new FormGroup({cities: cityArray});
-          fixture.debugElement.componentInstance.form = form;
-          fixture.debugElement.componentInstance.cityArray = cityArray;
+          fixture.componentInstance.form = form;
+          fixture.componentInstance.cityArray = cityArray;
           fixture.detectChanges();
 
           form.removeControl('cities');
@@ -349,8 +344,8 @@ export function main() {
         const fixture = TestBed.createComponent(FormArrayComp);
         const cityArray = new FormArray([new FormControl('SF'), new FormControl('NY')]);
         const form = new FormGroup({cities: cityArray});
-        fixture.debugElement.componentInstance.form = form;
-        fixture.debugElement.componentInstance.cityArray = cityArray;
+        fixture.componentInstance.form = form;
+        fixture.componentInstance.cityArray = cityArray;
         fixture.detectChanges();
 
         const inputs = fixture.debugElement.queryAll(By.css('input'));
@@ -372,8 +367,8 @@ export function main() {
         const fixture = TestBed.createComponent(FormArrayComp);
         const cityArray = new FormArray([new FormControl('SF'), new FormControl('NY')]);
         const form = new FormGroup({cities: cityArray});
-        fixture.debugElement.componentInstance.form = form;
-        fixture.debugElement.componentInstance.cityArray = cityArray;
+        fixture.componentInstance.form = form;
+        fixture.componentInstance.cityArray = cityArray;
         fixture.detectChanges();
 
         cityArray.push(new FormControl('LA'));
@@ -391,8 +386,8 @@ export function main() {
           new FormGroup({town: new FormControl('NY'), state: new FormControl('NY')})
         ]);
         const form = new FormGroup({cities: cityArray});
-        fixture.debugElement.componentInstance.form = form;
-        fixture.debugElement.componentInstance.cityArray = cityArray;
+        fixture.componentInstance.form = form;
+        fixture.componentInstance.cityArray = cityArray;
         fixture.detectChanges();
 
         const inputs = fixture.debugElement.queryAll(By.css('input'));
@@ -420,7 +415,7 @@ export function main() {
         const fixture = TestBed.createComponent(FormGroupComp);
         const login = new FormControl('oldValue');
         const form = new FormGroup({'login': login});
-        fixture.debugElement.componentInstance.form = form;
+        fixture.componentInstance.form = form;
         fixture.detectChanges();
 
         login.setValue('newValue');
@@ -435,7 +430,7 @@ export function main() {
            () => {
              const fixture = TestBed.createComponent(FormControlComp);
              const control = new FormControl({value: 'some value', disabled: true});
-             fixture.debugElement.componentInstance.control = control;
+             fixture.componentInstance.control = control;
              fixture.detectChanges();
 
              const input = fixture.debugElement.query(By.css('input'));
@@ -449,8 +444,8 @@ export function main() {
         it('should add disabled attribute to formControlName when instantiated as disabled', () => {
           const fixture = TestBed.createComponent(FormGroupComp);
           const control = new FormControl({value: 'some value', disabled: true});
-          fixture.debugElement.componentInstance.form = new FormGroup({login: control});
-          fixture.debugElement.componentInstance.control = control;
+          fixture.componentInstance.form = new FormGroup({login: control});
+          fixture.componentInstance.control = control;
           fixture.detectChanges();
 
           const input = fixture.debugElement.query(By.css('input'));
@@ -465,7 +460,7 @@ export function main() {
            () => {
              const fixture = TestBed.createComponent(FormControlComp);
              const control = new FormControl('some value');
-             fixture.debugElement.componentInstance.control = control;
+             fixture.componentInstance.control = control;
              fixture.detectChanges();
 
              control.disable();
@@ -483,7 +478,7 @@ export function main() {
            () => {
              const fixture = TestBed.createComponent(FormGroupComp);
              const form = new FormGroup({'login': new FormControl('login')});
-             fixture.debugElement.componentInstance.form = form;
+             fixture.componentInstance.form = form;
              fixture.detectChanges();
 
              form.disable();
@@ -501,7 +496,7 @@ export function main() {
         it('should not add disabled attribute to custom controls when disable() is called', () => {
           const fixture = TestBed.createComponent(MyInputForm);
           const control = new FormControl('some value');
-          fixture.debugElement.componentInstance.form = new FormGroup({login: control});
+          fixture.componentInstance.form = new FormGroup({login: control});
           fixture.detectChanges();
 
           control.disable();
@@ -521,7 +516,7 @@ export function main() {
         const fixture = TestBed.createComponent(FormGroupComp);
         const login = new FormControl('oldValue');
         const form = new FormGroup({'login': login});
-        fixture.debugElement.componentInstance.form = form;
+        fixture.componentInstance.form = form;
         fixture.detectChanges();
 
         const loginEl = fixture.debugElement.query(By.css('input'));
@@ -537,22 +532,20 @@ export function main() {
     describe('submit and reset events', () => {
       it('should emit ngSubmit event on submit', () => {
         const fixture = TestBed.createComponent(FormGroupComp);
-        fixture.debugElement.componentInstance.form =
-            new FormGroup({'login': new FormControl('loginValue')});
-        fixture.debugElement.componentInstance.data = 'should be changed';
+        fixture.componentInstance.form = new FormGroup({'login': new FormControl('loginValue')});
+        fixture.componentInstance.data = 'should be changed';
         fixture.detectChanges();
 
         const formEl = fixture.debugElement.query(By.css('form')).nativeElement;
         dispatchEvent(formEl, 'submit');
 
         fixture.detectChanges();
-        expect(fixture.debugElement.componentInstance.data).toEqual('submitted');
+        expect(fixture.componentInstance.data).toEqual('submitted');
       });
 
       it('should mark formGroup as submitted on submit event', () => {
         const fixture = TestBed.createComponent(FormGroupComp);
-        fixture.debugElement.componentInstance.form =
-            new FormGroup({'login': new FormControl('loginValue')});
+        fixture.componentInstance.form = new FormGroup({'login': new FormControl('loginValue')});
         fixture.detectChanges();
 
         const formGroupDir = fixture.debugElement.children[0].injector.get(FormGroupDirective);
@@ -569,7 +562,7 @@ export function main() {
         const fixture = TestBed.createComponent(FormGroupComp);
         const login = new FormControl('some value');
         const form = new FormGroup({'login': login});
-        fixture.debugElement.componentInstance.form = form;
+        fixture.componentInstance.form = form;
         fixture.detectChanges();
 
         const loginEl = fixture.debugElement.query(By.css('input')).nativeElement;
@@ -583,7 +576,7 @@ export function main() {
         const fixture = TestBed.createComponent(FormGroupComp);
         const login = new FormControl('some value');
         const form = new FormGroup({'login': login});
-        fixture.debugElement.componentInstance.form = form;
+        fixture.componentInstance.form = form;
         fixture.detectChanges();
 
         const loginEl = fixture.debugElement.query(By.css('input')).nativeElement;
@@ -600,7 +593,7 @@ export function main() {
       it('should mark controls as dirty before emitting a value change event', () => {
         const fixture = TestBed.createComponent(FormGroupComp);
         const login = new FormControl('oldValue');
-        fixture.debugElement.componentInstance.form = new FormGroup({'login': login});
+        fixture.componentInstance.form = new FormGroup({'login': login});
         fixture.detectChanges();
 
         login.valueChanges.subscribe(() => { expect(login.dirty).toBe(true); });
@@ -616,7 +609,7 @@ export function main() {
            const fixture = TestBed.createComponent(FormGroupComp);
            const login = new FormControl('oldValue');
            const form = new FormGroup({'login': login});
-           fixture.debugElement.componentInstance.form = form;
+           fixture.componentInstance.form = form;
            fixture.detectChanges();
 
            const loginEl = fixture.debugElement.query(By.css('input')).nativeElement;
@@ -636,7 +629,7 @@ export function main() {
       it('should work with single fields', () => {
         const fixture = TestBed.createComponent(FormControlComp);
         const control = new FormControl('', Validators.required);
-        fixture.debugElement.componentInstance.control = control;
+        fixture.componentInstance.control = control;
         fixture.detectChanges();
 
         const input = fixture.debugElement.query(By.css('input')).nativeElement;
@@ -657,7 +650,7 @@ export function main() {
       it('should work with single fields in parent forms', () => {
         const fixture = TestBed.createComponent(FormGroupComp);
         const form = new FormGroup({'login': new FormControl('', Validators.required)});
-        fixture.debugElement.componentInstance.form = form;
+        fixture.componentInstance.form = form;
         fixture.detectChanges();
 
         const input = fixture.debugElement.query(By.css('input')).nativeElement;
@@ -678,7 +671,7 @@ export function main() {
       it('should work with formGroup', () => {
         const fixture = TestBed.createComponent(FormGroupComp);
         const form = new FormGroup({'login': new FormControl('', Validators.required)});
-        fixture.debugElement.componentInstance.form = form;
+        fixture.componentInstance.form = form;
         fixture.detectChanges();
 
         const input = fixture.debugElement.query(By.css('input')).nativeElement;
@@ -707,7 +700,7 @@ export function main() {
             FormControlComp, {set: {template: `<input [formControl]="control">`}});
         const fixture = TestBed.createComponent(FormControlComp);
         const control = new FormControl('old');
-        fixture.debugElement.componentInstance.control = control;
+        fixture.componentInstance.control = control;
         fixture.detectChanges();
 
         // model -> view
@@ -724,7 +717,7 @@ export function main() {
       it('should support <input type=text>', () => {
         const fixture = TestBed.createComponent(FormGroupComp);
         const form = new FormGroup({'login': new FormControl('old')});
-        fixture.debugElement.componentInstance.form = form;
+        fixture.componentInstance.form = form;
         fixture.detectChanges();
 
         // model -> view
@@ -741,7 +734,7 @@ export function main() {
       it('should ignore the change event for <input type=text>', () => {
         const fixture = TestBed.createComponent(FormGroupComp);
         const form = new FormGroup({'login': new FormControl('oldValue')});
-        fixture.debugElement.componentInstance.form = form;
+        fixture.componentInstance.form = form;
         fixture.detectChanges();
 
         const input = fixture.debugElement.query(By.css('input'));
@@ -756,7 +749,7 @@ export function main() {
             FormControlComp, {set: {template: `<textarea [formControl]="control"></textarea>`}});
         const fixture = TestBed.createComponent(FormControlComp);
         const control = new FormControl('old');
-        fixture.debugElement.componentInstance.control = control;
+        fixture.componentInstance.control = control;
         fixture.detectChanges();
 
         // model -> view
@@ -775,7 +768,7 @@ export function main() {
             FormControlComp, {set: {template: `<input type="checkbox" [formControl]="control">`}});
         const fixture = TestBed.createComponent(FormControlComp);
         const control = new FormControl(true);
-        fixture.debugElement.componentInstance.control = control;
+        fixture.componentInstance.control = control;
         fixture.detectChanges();
 
         // model -> view
@@ -805,14 +798,14 @@ export function main() {
 
         // view -> model
         expect(sfOption.nativeElement.selected).toBe(false);
-        expect(fixture.debugElement.componentInstance.form.value).toEqual({'city': 'NY'});
+        expect(fixture.componentInstance.form.value).toEqual({'city': 'NY'});
       });
 
       describe('should support <type=number>', () => {
         it('with basic use case', () => {
           const fixture = TestBed.createComponent(FormControlNumberInput);
           const control = new FormControl(10);
-          fixture.debugElement.componentInstance.control = control;
+          fixture.componentInstance.control = control;
           fixture.detectChanges();
 
           // model -> view
@@ -829,7 +822,7 @@ export function main() {
         it('when value is cleared in the UI', () => {
           const fixture = TestBed.createComponent(FormControlNumberInput);
           const control = new FormControl(10, Validators.required);
-          fixture.debugElement.componentInstance.control = control;
+          fixture.componentInstance.control = control;
           fixture.detectChanges();
 
           const input = fixture.debugElement.query(By.css('input'));
@@ -849,7 +842,7 @@ export function main() {
         it('when value is cleared programmatically', () => {
           const fixture = TestBed.createComponent(FormControlNumberInput);
           const control = new FormControl(10);
-          fixture.debugElement.componentInstance.control = control;
+          fixture.componentInstance.control = control;
           fixture.detectChanges();
 
           control.setValue(null);
@@ -865,7 +858,7 @@ export function main() {
           const fixture = TestBed.createComponent(FormControlRadioButtons);
           const form =
               new FormGroup({'food': new FormControl('fish'), 'drink': new FormControl('sprite')});
-          fixture.debugElement.componentInstance.form = form;
+          fixture.componentInstance.form = form;
           fixture.detectChanges();
 
           // model -> view
@@ -892,8 +885,7 @@ export function main() {
           const fixture = TestBed.createComponent(FormControlRadioButtons);
           const foodCtrl = new FormControl('fish');
           const drinkCtrl = new FormControl('sprite');
-          fixture.debugElement.componentInstance.form =
-              new FormGroup({'food': foodCtrl, 'drink': drinkCtrl});
+          fixture.componentInstance.form = new FormGroup({'food': foodCtrl, 'drink': drinkCtrl});
           fixture.detectChanges();
 
           const inputs = fixture.debugElement.queryAll(By.css('input'));
@@ -906,7 +898,7 @@ export function main() {
           inputs[0].nativeElement.checked = true;
           fixture.detectChanges();
 
-          const value = fixture.debugElement.componentInstance.form.value;
+          const value = fixture.componentInstance.form.value;
           expect(value.food).toEqual('chicken');
           expect(inputs[1].nativeElement.checked).toEqual(false);
           expect(inputs[2].nativeElement.checked).toEqual(false);
@@ -926,8 +918,8 @@ export function main() {
           const showRadio = new FormControl('yes');
           const form =
               new FormGroup({'food': new FormControl('fish'), 'drink': new FormControl('sprite')});
-          fixture.debugElement.componentInstance.form = form;
-          fixture.debugElement.componentInstance.showRadio = showRadio;
+          fixture.componentInstance.form = form;
+          fixture.componentInstance.showRadio = showRadio;
           showRadio.valueChanges.subscribe((change) => {
             (change === 'yes') ? form.addControl('food', new FormControl('fish')) :
                                  form.removeControl('food');
@@ -961,7 +953,7 @@ export function main() {
             food: new FormControl('fish'),
             nested: new FormGroup({food: new FormControl('fish')})
           });
-          fixture.debugElement.componentInstance.form = form;
+          fixture.componentInstance.form = form;
           fixture.detectChanges();
 
           // model -> view
@@ -989,8 +981,7 @@ export function main() {
       describe('custom value accessors', () => {
         it('should support custom value accessors', () => {
           const fixture = TestBed.createComponent(WrappedValueForm);
-          fixture.debugElement.componentInstance.form =
-              new FormGroup({'login': new FormControl('aa')});
+          fixture.componentInstance.form = new FormGroup({'login': new FormControl('aa')});
           fixture.detectChanges();
 
           // model -> view
@@ -1001,14 +992,13 @@ export function main() {
           dispatchEvent(input.nativeElement, 'input');
 
           // view -> model
-          expect(fixture.debugElement.componentInstance.form.value).toEqual({'login': 'bb'});
+          expect(fixture.componentInstance.form.value).toEqual({'login': 'bb'});
         });
 
         it('should support custom value accessors on non builtin input elements that fire a change event without a \'target\' property',
            () => {
              const fixture = TestBed.createComponent(MyInputForm);
-             fixture.debugElement.componentInstance.form =
-                 new FormGroup({'login': new FormControl('aa')});
+             fixture.componentInstance.form = new FormGroup({'login': new FormControl('aa')});
              fixture.detectChanges();
 
              const input = fixture.debugElement.query(By.css('my-input'));
@@ -1016,7 +1006,7 @@ export function main() {
 
              input.componentInstance.value = '!bb!';
              input.componentInstance.onInput.subscribe((value: any) => {
-               expect(fixture.debugElement.componentInstance.form.value).toEqual({'login': 'bb'});
+               expect(fixture.componentInstance.form.value).toEqual({'login': 'bb'});
              });
              input.componentInstance.dispatchChangeEvent();
            });
@@ -1029,9 +1019,8 @@ export function main() {
 
       it('should support ngModel for complex forms', fakeAsync(() => {
            const fixture = TestBed.createComponent(FormGroupNgModel);
-           fixture.debugElement.componentInstance.form =
-               new FormGroup({'login': new FormControl('')});
-           fixture.debugElement.componentInstance.login = 'oldValue';
+           fixture.componentInstance.form = new FormGroup({'login': new FormControl('')});
+           fixture.componentInstance.login = 'oldValue';
            fixture.detectChanges();
            tick();
 
@@ -1042,13 +1031,13 @@ export function main() {
            dispatchEvent(input, 'input');
 
            tick();
-           expect(fixture.debugElement.componentInstance.login).toEqual('updatedValue');
+           expect(fixture.componentInstance.login).toEqual('updatedValue');
          }));
 
       it('should support ngModel for single fields', fakeAsync(() => {
            const fixture = TestBed.createComponent(FormControlNgModel);
-           fixture.debugElement.componentInstance.control = new FormControl('');
-           fixture.debugElement.componentInstance.login = 'oldValue';
+           fixture.componentInstance.control = new FormControl('');
+           fixture.componentInstance.login = 'oldValue';
            fixture.detectChanges();
            tick();
 
@@ -1059,12 +1048,12 @@ export function main() {
            dispatchEvent(input, 'input');
            tick();
 
-           expect(fixture.debugElement.componentInstance.login).toEqual('updatedValue');
+           expect(fixture.componentInstance.login).toEqual('updatedValue');
          }));
 
       it('should not update the view when the value initially came from the view', fakeAsync(() => {
            const fixture = TestBed.createComponent(FormControlNgModel);
-           fixture.debugElement.componentInstance.control = new FormControl('');
+           fixture.componentInstance.control = new FormControl('');
            fixture.detectChanges();
            tick();
 
@@ -1091,7 +1080,7 @@ export function main() {
           'max': new FormControl(''),
           'pattern': new FormControl('')
         });
-        fixture.debugElement.componentInstance.form = form;
+        fixture.componentInstance.form = form;
         fixture.detectChanges();
 
         const required = fixture.debugElement.query(By.css('[required]'));
@@ -1136,11 +1125,11 @@ export function main() {
           'max': new FormControl(''),
           'pattern': new FormControl('')
         });
-        fixture.debugElement.componentInstance.form = form;
-        fixture.debugElement.componentInstance.required = true;
-        fixture.debugElement.componentInstance.minLen = 3;
-        fixture.debugElement.componentInstance.maxLen = 3;
-        fixture.debugElement.componentInstance.pattern = '.{3,}';
+        fixture.componentInstance.form = form;
+        fixture.componentInstance.required = true;
+        fixture.componentInstance.minLen = 3;
+        fixture.componentInstance.maxLen = 3;
+        fixture.componentInstance.pattern = '.{3,}';
         fixture.detectChanges();
 
         const required = fixture.debugElement.query(By.css('[name=required]'));
@@ -1184,7 +1173,7 @@ export function main() {
           'max': new FormControl(''),
           'pattern': new FormControl('')
         });
-        fixture.debugElement.componentInstance.form = form;
+        fixture.componentInstance.form = form;
         fixture.detectChanges();
 
         const required = fixture.debugElement.query(By.css('[name=required]'));
@@ -1208,10 +1197,10 @@ export function main() {
         expect(form.hasError('pattern', ['pattern'])).toEqual(false);
         expect(form.valid).toEqual(true);
 
-        fixture.debugElement.componentInstance.required = true;
-        fixture.debugElement.componentInstance.minLen = 3;
-        fixture.debugElement.componentInstance.maxLen = 3;
-        fixture.debugElement.componentInstance.pattern = '.{3,}';
+        fixture.componentInstance.required = true;
+        fixture.componentInstance.minLen = 3;
+        fixture.componentInstance.maxLen = 3;
+        fixture.componentInstance.pattern = '.{3,}';
         fixture.detectChanges();
 
         dispatchEvent(required.nativeElement, 'input');
@@ -1226,17 +1215,17 @@ export function main() {
         expect(form.valid).toEqual(false);
 
         expect(required.nativeElement.getAttribute('required')).toEqual('');
-        expect(fixture.debugElement.componentInstance.minLen.toString())
+        expect(fixture.componentInstance.minLen.toString())
             .toEqual(minLength.nativeElement.getAttribute('minlength'));
-        expect(fixture.debugElement.componentInstance.maxLen.toString())
+        expect(fixture.componentInstance.maxLen.toString())
             .toEqual(maxLength.nativeElement.getAttribute('maxlength'));
-        expect(fixture.debugElement.componentInstance.pattern.toString())
+        expect(fixture.componentInstance.pattern.toString())
             .toEqual(pattern.nativeElement.getAttribute('pattern'));
 
-        fixture.debugElement.componentInstance.required = false;
-        fixture.debugElement.componentInstance.minLen = null;
-        fixture.debugElement.componentInstance.maxLen = null;
-        fixture.debugElement.componentInstance.pattern = null;
+        fixture.componentInstance.required = false;
+        fixture.componentInstance.minLen = null;
+        fixture.componentInstance.maxLen = null;
+        fixture.componentInstance.pattern = null;
         fixture.detectChanges();
 
         expect(form.hasError('required', ['login'])).toEqual(false);
@@ -1259,11 +1248,11 @@ export function main() {
           'max': new FormControl(''),
           'pattern': new FormControl('')
         });
-        fixture.debugElement.componentInstance.form = form;
-        fixture.debugElement.componentInstance.required = true;
-        fixture.debugElement.componentInstance.minLen = 3;
-        fixture.debugElement.componentInstance.maxLen = 3;
-        fixture.debugElement.componentInstance.pattern = '.{3,}';
+        fixture.componentInstance.form = form;
+        fixture.componentInstance.required = true;
+        fixture.componentInstance.minLen = 3;
+        fixture.componentInstance.maxLen = 3;
+        fixture.componentInstance.pattern = '.{3,}';
         fixture.detectChanges();
 
         const newForm = new FormGroup({
@@ -1272,13 +1261,13 @@ export function main() {
           'max': new FormControl(''),
           'pattern': new FormControl('')
         });
-        fixture.debugElement.componentInstance.form = newForm;
+        fixture.componentInstance.form = newForm;
         fixture.detectChanges();
 
-        fixture.debugElement.componentInstance.required = false;
-        fixture.debugElement.componentInstance.minLen = null;
-        fixture.debugElement.componentInstance.maxLen = null;
-        fixture.debugElement.componentInstance.pattern = null;
+        fixture.componentInstance.required = false;
+        fixture.componentInstance.minLen = null;
+        fixture.componentInstance.maxLen = null;
+        fixture.componentInstance.pattern = null;
         fixture.detectChanges();
 
         expect(newForm.hasError('required', ['login'])).toEqual(false);
@@ -1292,7 +1281,7 @@ export function main() {
            const fixture = TestBed.createComponent(UniqLoginWrapper);
            const form = new FormGroup({'login': new FormControl('')});
            tick();
-           fixture.debugElement.componentInstance.form = form;
+           fixture.componentInstance.form = form;
            fixture.detectChanges();
 
            expect(form.pending).toEqual(true);
@@ -1311,7 +1300,7 @@ export function main() {
       it('should use sync validators defined in the model', () => {
         const fixture = TestBed.createComponent(FormGroupComp);
         const form = new FormGroup({'login': new FormControl('aa', Validators.required)});
-        fixture.debugElement.componentInstance.form = form;
+        fixture.componentInstance.form = form;
         fixture.detectChanges();
         expect(form.valid).toEqual(true);
 
@@ -1327,7 +1316,7 @@ export function main() {
            const control =
                new FormControl('', Validators.required, uniqLoginAsyncValidator('expected'));
            const form = new FormGroup({'login': control});
-           fixture.debugElement.componentInstance.form = form;
+           fixture.componentInstance.form = form;
            fixture.detectChanges();
            tick();
 
@@ -1453,8 +1442,7 @@ export function main() {
             template: `
          <div formArrayName="cities">
            <input type="text" formControlName="login">
-         </div>
-        `
+         </div>`
           }
         });
         const fixture = TestBed.createComponent(FormGroupComp);
@@ -1475,7 +1463,7 @@ export function main() {
           }
         });
         const fixture = TestBed.createComponent(FormGroupComp);
-        fixture.debugElement.componentInstance.myGroup = new FormGroup({});
+        fixture.componentInstance.myGroup = new FormGroup({});
 
         expect(() => fixture.detectChanges())
             .toThrowError(new RegExp(
@@ -1493,7 +1481,7 @@ export function main() {
           }
         });
         const fixture = TestBed.createComponent(FormGroupComp);
-        fixture.debugElement.componentInstance.myGroup = new FormGroup({});
+        fixture.componentInstance.myGroup = new FormGroup({});
 
         expect(() => fixture.detectChanges()).not.toThrowError();
       });
@@ -1512,7 +1500,7 @@ export function main() {
         });
         const fixture = TestBed.createComponent(FormGroupComp);
         const myGroup = new FormGroup({person: new FormGroup({})});
-        fixture.debugElement.componentInstance.myGroup = new FormGroup({person: new FormGroup({})});
+        fixture.componentInstance.myGroup = new FormGroup({person: new FormGroup({})});
 
         expect(() => fixture.detectChanges())
             .toThrowError(new RegExp(
@@ -1532,7 +1520,7 @@ export function main() {
           }
         });
         const fixture = TestBed.createComponent(FormGroupComp);
-        fixture.debugElement.componentInstance.myGroup = new FormGroup({});
+        fixture.componentInstance.myGroup = new FormGroup({});
 
         expect(() => fixture.detectChanges())
             .toThrowError(
@@ -1545,13 +1533,11 @@ export function main() {
             template: `
           <form [formGroup]="form">hav
             <input type="radio" formControlName="food" name="drink" value="chicken">
-          </form>
-        `
+          </form>`
           }
         });
         const fixture = TestBed.createComponent(FormGroupComp);
-        fixture.debugElement.componentInstance.form =
-            new FormGroup({'food': new FormControl('fish')});
+        fixture.componentInstance.form = new FormGroup({'food': new FormControl('fish')});
 
         expect(() => fixture.detectChanges())
             .toThrowError(new RegExp('If you define both a name and a formControlName'));
@@ -1655,7 +1641,9 @@ class FormControlComp {
   `
 })
 class FormGroupComp {
+  control: FormControl;
   form: FormGroup;
+  myGroup: FormGroup;
   data: string;
 }
 
diff --git a/modules/@angular/forms/test/template_integration_spec.ts b/modules/@angular/forms/test/template_integration_spec.ts
index 336e545134..4e38493d27 100644
--- a/modules/@angular/forms/test/template_integration_spec.ts
+++ b/modules/@angular/forms/test/template_integration_spec.ts
@@ -6,7 +6,6 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {NgFor, NgIf} from '@angular/common';
 import {Component, Input} from '@angular/core';
 import {TestBed, async, fakeAsync, tick} from '@angular/core/testing';
 import {ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR, NgForm} from '@angular/forms';
@@ -14,8 +13,6 @@ import {By} from '@angular/platform-browser/src/dom/debug/by';
 import {getDOM} from '@angular/platform-browser/src/dom/dom_adapter';
 import {dispatchEvent} from '@angular/platform-browser/testing/browser_util';
 
-import {ListWrapper} from '../src/facade/collection';
-
 export function main() {
   describe('template-driven forms integration tests', () => {
 
@@ -34,7 +31,7 @@ export function main() {
     describe('basic functionality', () => {
       it('should support ngModel for standalone fields', fakeAsync(() => {
            const fixture = TestBed.createComponent(StandaloneNgModel);
-           fixture.debugElement.componentInstance.name = 'oldValue';
+           fixture.componentInstance.name = 'oldValue';
 
            fixture.detectChanges();
            tick();
@@ -48,12 +45,12 @@ export function main() {
            tick();
 
            // view -> model
-           expect(fixture.debugElement.componentInstance.name).toEqual('updatedValue');
+           expect(fixture.componentInstance.name).toEqual('updatedValue');
          }));
 
       it('should support ngModel registration with a parent form', fakeAsync(() => {
            const fixture = TestBed.createComponent(NgModelForm);
-           fixture.debugElement.componentInstance.name = 'Nancy';
+           fixture.componentInstance.name = 'Nancy';
 
            fixture.detectChanges();
            tick();
@@ -65,9 +62,9 @@ export function main() {
 
       it('should support ngModelGroup', fakeAsync(() => {
            const fixture = TestBed.createComponent(NgModelGroupForm);
-           fixture.debugElement.componentInstance.first = 'Nancy';
-           fixture.debugElement.componentInstance.last = 'Drew';
-           fixture.debugElement.componentInstance.email = 'some email';
+           fixture.componentInstance.first = 'Nancy';
+           fixture.componentInstance.last = 'Drew';
+           fixture.componentInstance.email = 'some email';
 
            fixture.detectChanges();
            tick();
@@ -88,9 +85,9 @@ export function main() {
 
       it('should add controls and control groups to form control model', fakeAsync(() => {
            const fixture = TestBed.createComponent(NgModelGroupForm);
-           fixture.debugElement.componentInstance.first = 'Nancy';
-           fixture.debugElement.componentInstance.last = 'Drew';
-           fixture.debugElement.componentInstance.email = 'some email';
+           fixture.componentInstance.first = 'Nancy';
+           fixture.componentInstance.last = 'Drew';
+           fixture.componentInstance.email = 'some email';
 
            fixture.detectChanges();
            tick();
@@ -103,9 +100,9 @@ export function main() {
 
       it('should remove controls and control groups from form control model', fakeAsync(() => {
            const fixture = TestBed.createComponent(NgModelNgIfForm);
-           fixture.debugElement.componentInstance.emailShowing = true;
-           fixture.debugElement.componentInstance.first = 'Nancy';
-           fixture.debugElement.componentInstance.email = 'some email';
+           fixture.componentInstance.emailShowing = true;
+           fixture.componentInstance.first = 'Nancy';
+           fixture.componentInstance.email = 'some email';
            fixture.detectChanges();
            tick();
 
@@ -114,7 +111,7 @@ export function main() {
            expect(form.value).toEqual({name: {first: 'Nancy'}, email: 'some email'});
 
            // should remove individual control successfully
-           fixture.debugElement.componentInstance.emailShowing = false;
+           fixture.componentInstance.emailShowing = false;
            fixture.detectChanges();
            tick();
 
@@ -125,7 +122,7 @@ export function main() {
            expect(form.control.get('name.first').value).toEqual('Nancy');
 
            // should remove form group successfully
-           fixture.debugElement.componentInstance.groupShowing = false;
+           fixture.componentInstance.groupShowing = false;
            fixture.detectChanges();
            tick();
 
@@ -136,7 +133,7 @@ export function main() {
 
       it('should set status classes with ngModel', async(() => {
            const fixture = TestBed.createComponent(NgModelForm);
-           fixture.debugElement.componentInstance.name = 'aa';
+           fixture.componentInstance.name = 'aa';
            fixture.detectChanges();
            fixture.whenStable().then(() => {
              fixture.detectChanges();
@@ -159,7 +156,7 @@ export function main() {
 
       it('should set status classes with ngModelGroup and ngForm', async(() => {
            const fixture = TestBed.createComponent(NgModelGroupForm);
-           fixture.debugElement.componentInstance.first = '';
+           fixture.componentInstance.first = '';
            fixture.detectChanges();
 
            const form = fixture.debugElement.query(By.css('form')).nativeElement;
@@ -214,8 +211,8 @@ export function main() {
 
       it('should not register standalone ngModels with parent form', fakeAsync(() => {
            const fixture = TestBed.createComponent(NgModelOptionsStandalone);
-           fixture.debugElement.componentInstance.one = 'some data';
-           fixture.debugElement.componentInstance.two = 'should not show';
+           fixture.componentInstance.one = 'some data';
+           fixture.componentInstance.two = 'should not show';
            fixture.detectChanges();
            tick();
 
@@ -229,8 +226,8 @@ export function main() {
 
       it('should override name attribute with ngModelOptions name if provided', fakeAsync(() => {
            const fixture = TestBed.createComponent(NgModelForm);
-           fixture.debugElement.componentInstance.options = {name: 'override'};
-           fixture.debugElement.componentInstance.name = 'some data';
+           fixture.componentInstance.options = {name: 'override'};
+           fixture.componentInstance.name = 'some data';
            fixture.detectChanges();
            tick();
 
@@ -242,13 +239,13 @@ export function main() {
     describe('submit and reset events', () => {
       it('should emit ngSubmit event on submit', fakeAsync(() => {
            const fixture = TestBed.createComponent(NgModelForm);
-           fixture.debugElement.componentInstance.name = 'old';
+           fixture.componentInstance.name = 'old';
 
            const form = fixture.debugElement.query(By.css('form'));
            dispatchEvent(form.nativeElement, 'submit');
            tick();
 
-           expect(fixture.debugElement.componentInstance.name).toEqual('submitted');
+           expect(fixture.componentInstance.name).toEqual('submitted');
          }));
 
       it('should mark NgForm as submitted on submit event', fakeAsync(() => {
@@ -267,7 +264,7 @@ export function main() {
 
       it('should reset the form to empty when reset event is fired', fakeAsync(() => {
            const fixture = TestBed.createComponent(NgModelForm);
-           fixture.debugElement.componentInstance.name = 'should be cleared';
+           fixture.componentInstance.name = 'should be cleared';
            fixture.detectChanges();
            tick();
 
@@ -275,18 +272,17 @@ export function main() {
            const formEl = fixture.debugElement.query(By.css('form'));
            const input = fixture.debugElement.query(By.css('input'));
 
-           expect(input.nativeElement.value).toBe('should be cleared');  // view value
-           expect(fixture.debugElement.componentInstance.name)
-               .toBe('should be cleared');                        // ngModel value
-           expect(form.value.name).toEqual('should be cleared');  // control value
+           expect(input.nativeElement.value).toBe('should be cleared');       // view value
+           expect(fixture.componentInstance.name).toBe('should be cleared');  // ngModel value
+           expect(form.value.name).toEqual('should be cleared');              // control value
 
            dispatchEvent(formEl.nativeElement, 'reset');
            fixture.detectChanges();
            tick();
 
-           expect(input.nativeElement.value).toBe('');                      // view value
-           expect(fixture.debugElement.componentInstance.name).toBe(null);  // ngModel value
-           expect(form.value.name).toEqual(null);                           // control value
+           expect(input.nativeElement.value).toBe('');         // view value
+           expect(fixture.componentInstance.name).toBe(null);  // ngModel value
+           expect(form.value.name).toEqual(null);              // control value
          }));
 
       it('should reset the form submit state when reset button is clicked', fakeAsync(() => {
@@ -310,7 +306,7 @@ export function main() {
       it('should emit valueChanges and statusChanges on init', fakeAsync(() => {
            const fixture = TestBed.createComponent(NgModelForm);
            const form = fixture.debugElement.children[0].injector.get(NgForm);
-           fixture.debugElement.componentInstance.name = 'aa';
+           fixture.componentInstance.name = 'aa';
            fixture.detectChanges();
 
            expect(form.valid).toEqual(true);
@@ -369,10 +365,10 @@ export function main() {
     describe('disabled controls', () => {
       it('should not consider disabled controls in value or validation', fakeAsync(() => {
            const fixture = TestBed.createComponent(NgModelGroupForm);
-           fixture.debugElement.componentInstance.isDisabled = false;
-           fixture.debugElement.componentInstance.first = '';
-           fixture.debugElement.componentInstance.last = 'Drew';
-           fixture.debugElement.componentInstance.email = 'some email';
+           fixture.componentInstance.isDisabled = false;
+           fixture.componentInstance.first = '';
+           fixture.componentInstance.last = 'Drew';
+           fixture.componentInstance.email = 'some email';
            fixture.detectChanges();
            tick();
 
@@ -393,8 +389,8 @@ export function main() {
       it('should add disabled attribute in the UI if disable() is called programmatically',
          fakeAsync(() => {
            const fixture = TestBed.createComponent(NgModelGroupForm);
-           fixture.debugElement.componentInstance.isDisabled = false;
-           fixture.debugElement.componentInstance.first = 'Nancy';
+           fixture.componentInstance.isDisabled = false;
+           fixture.componentInstance.first = 'Nancy';
            fixture.detectChanges();
            tick();
 
@@ -409,8 +405,8 @@ export function main() {
 
       it('should disable a custom control if disabled attr is added', async(() => {
            const fixture = TestBed.createComponent(NgModelCustomWrapper);
-           fixture.debugElement.componentInstance.name = 'Nancy';
-           fixture.debugElement.componentInstance.isDisabled = true;
+           fixture.componentInstance.name = 'Nancy';
+           fixture.componentInstance.isDisabled = true;
            fixture.detectChanges();
            fixture.whenStable().then(() => {
              fixture.detectChanges();
@@ -429,7 +425,7 @@ export function main() {
     describe('radio controls', () => {
       it('should support <type=radio>', fakeAsync(() => {
            const fixture = TestBed.createComponent(NgModelRadioForm);
-           fixture.debugElement.componentInstance.food = 'fish';
+           fixture.componentInstance.food = 'fish';
            fixture.detectChanges();
            tick();
 
@@ -442,14 +438,14 @@ export function main() {
            tick();
 
            // view -> model
-           expect(fixture.debugElement.componentInstance.food).toEqual('chicken');
+           expect(fixture.componentInstance.food).toEqual('chicken');
            expect(inputs[1].nativeElement.checked).toEqual(false);
          }));
 
       it('should support multiple named <type=radio> groups', fakeAsync(() => {
            const fixture = TestBed.createComponent(NgModelRadioForm);
-           fixture.debugElement.componentInstance.food = 'fish';
-           fixture.debugElement.componentInstance.drink = 'sprite';
+           fixture.componentInstance.food = 'fish';
+           fixture.componentInstance.drink = 'sprite';
            fixture.detectChanges();
            tick();
 
@@ -462,8 +458,8 @@ export function main() {
            dispatchEvent(inputs[0].nativeElement, 'change');
            tick();
 
-           expect(fixture.debugElement.componentInstance.food).toEqual('chicken');
-           expect(fixture.debugElement.componentInstance.drink).toEqual('sprite');
+           expect(fixture.componentInstance.food).toEqual('chicken');
+           expect(fixture.componentInstance.drink).toEqual('sprite');
            expect(inputs[1].nativeElement.checked).toEqual(false);
            expect(inputs[2].nativeElement.checked).toEqual(false);
            expect(inputs[3].nativeElement.checked).toEqual(true);
@@ -473,7 +469,7 @@ export function main() {
     describe('select controls', () => {
       it('with option values that are objects', fakeAsync(() => {
            const fixture = TestBed.createComponent(NgModelSelectForm);
-           const comp = fixture.debugElement.componentInstance;
+           const comp = fixture.componentInstance;
            comp.cities = [{'name': 'SF'}, {'name': 'NYC'}, {'name': 'Buffalo'}];
            comp.selectedCity = comp.cities[1];
            fixture.detectChanges();
@@ -492,12 +488,12 @@ export function main() {
            tick();
 
            // view -> model
-           expect(comp.selectedCity.name).toEqual('Buffalo');
+           expect(comp.selectedCity['name']).toEqual('Buffalo');
          }));
 
       it('when new options are added', fakeAsync(() => {
            const fixture = TestBed.createComponent(NgModelSelectForm);
-           const comp = fixture.debugElement.componentInstance;
+           const comp = fixture.componentInstance;
            comp.cities = [{'name': 'SF'}, {'name': 'NYC'}];
            comp.selectedCity = comp.cities[1];
            fixture.detectChanges();
@@ -516,7 +512,7 @@ export function main() {
 
       it('when options are removed', fakeAsync(() => {
            const fixture = TestBed.createComponent(NgModelSelectForm);
-           const comp = fixture.debugElement.componentInstance;
+           const comp = fixture.componentInstance;
            comp.cities = [{'name': 'SF'}, {'name': 'NYC'}];
            comp.selectedCity = comp.cities[1];
            fixture.detectChanges();
@@ -534,7 +530,7 @@ export function main() {
 
       it('when option values have same content, but different identities', fakeAsync(() => {
            const fixture = TestBed.createComponent(NgModelSelectForm);
-           const comp = fixture.debugElement.componentInstance;
+           const comp = fixture.componentInstance;
            comp.cities = [{'name': 'SF'}, {'name': 'NYC'}, {'name': 'NYC'}];
            comp.selectedCity = comp.cities[0];
            fixture.detectChanges();
@@ -553,7 +549,7 @@ export function main() {
     describe('custom value accessors', () => {
       it('should support standard writing to view and model', async(() => {
            const fixture = TestBed.createComponent(NgModelCustomWrapper);
-           fixture.debugElement.componentInstance.name = 'Nancy';
+           fixture.componentInstance.name = 'Nancy';
            fixture.detectChanges();
            fixture.whenStable().then(() => {
              fixture.detectChanges();
@@ -567,7 +563,7 @@ export function main() {
                fixture.detectChanges();
 
                // view -> model
-               expect(fixture.debugElement.componentInstance.name).toEqual('Carson');
+               expect(fixture.componentInstance.name).toEqual('Carson');
              });
            });
          }));
@@ -578,10 +574,10 @@ export function main() {
 
       it('should support dir validators using bindings', fakeAsync(() => {
            const fixture = TestBed.createComponent(NgModelValidationBindings);
-           fixture.debugElement.componentInstance.required = true;
-           fixture.debugElement.componentInstance.minLen = 3;
-           fixture.debugElement.componentInstance.maxLen = 3;
-           fixture.debugElement.componentInstance.pattern = '.{3,}';
+           fixture.componentInstance.required = true;
+           fixture.componentInstance.minLen = 3;
+           fixture.componentInstance.maxLen = 3;
+           fixture.componentInstance.pattern = '.{3,}';
            fixture.detectChanges();
            tick();
 
@@ -648,10 +644,10 @@ export function main() {
            expect(form.control.hasError('pattern', ['pattern'])).toEqual(false);
            expect(form.valid).toEqual(true);
 
-           fixture.debugElement.componentInstance.required = true;
-           fixture.debugElement.componentInstance.minLen = 3;
-           fixture.debugElement.componentInstance.maxLen = 3;
-           fixture.debugElement.componentInstance.pattern = '.{3,}';
+           fixture.componentInstance.required = true;
+           fixture.componentInstance.minLen = 3;
+           fixture.componentInstance.maxLen = 3;
+           fixture.componentInstance.pattern = '.{3,}';
            fixture.detectChanges();
 
            dispatchEvent(required.nativeElement, 'input');
@@ -666,17 +662,17 @@ export function main() {
            expect(form.valid).toEqual(false);
 
            expect(required.nativeElement.getAttribute('required')).toEqual('');
-           expect(fixture.debugElement.componentInstance.minLen.toString())
+           expect(fixture.componentInstance.minLen.toString())
                .toEqual(minLength.nativeElement.getAttribute('minlength'));
-           expect(fixture.debugElement.componentInstance.maxLen.toString())
+           expect(fixture.componentInstance.maxLen.toString())
                .toEqual(maxLength.nativeElement.getAttribute('maxlength'));
-           expect(fixture.debugElement.componentInstance.pattern.toString())
+           expect(fixture.componentInstance.pattern.toString())
                .toEqual(pattern.nativeElement.getAttribute('pattern'));
 
-           fixture.debugElement.componentInstance.required = false;
-           fixture.debugElement.componentInstance.minLen = null;
-           fixture.debugElement.componentInstance.maxLen = null;
-           fixture.debugElement.componentInstance.pattern = null;
+           fixture.componentInstance.required = false;
+           fixture.componentInstance.minLen = null;
+           fixture.componentInstance.maxLen = null;
+           fixture.componentInstance.pattern = null;
            fixture.detectChanges();
 
            expect(form.control.hasError('required', ['required'])).toEqual(false);
@@ -697,7 +693,7 @@ export function main() {
       it('should update the view when the model is set back to what used to be in the view',
          fakeAsync(() => {
            const fixture = TestBed.createComponent(StandaloneNgModel);
-           fixture.debugElement.componentInstance.name = '';
+           fixture.componentInstance.name = '';
            fixture.detectChanges();
            tick();
 
@@ -708,16 +704,16 @@ export function main() {
 
            fixture.detectChanges();
            tick();
-           expect(fixture.debugElement.componentInstance.name).toEqual('aa');
+           expect(fixture.componentInstance.name).toEqual('aa');
 
            // Programmatically update the input value to be "bb".
-           fixture.debugElement.componentInstance.name = 'bb';
+           fixture.componentInstance.name = 'bb';
            fixture.detectChanges();
            tick();
            expect(input.value).toEqual('bb');
 
            // Programatically set it back to "aa".
-           fixture.debugElement.componentInstance.name = 'aa';
+           fixture.componentInstance.name = 'aa';
            fixture.detectChanges();
            tick();
            expect(input.value).toEqual('aa');
@@ -808,6 +804,7 @@ class NgModelNgIfForm {
   first: string;
   groupShowing = true;
   emailShowing = true;
+  email: string;
 }
 
 @Component({
@@ -872,7 +869,7 @@ class NgModelRadioForm {
   `
 })
 class NgModelSelectForm {
-  selectedCity: Object = {};
+  selectedCity: {[k: string]: string} = {};
   cities: any[] = [];
 }
 
@@ -929,7 +926,7 @@ class NgModelValidationBindings {
 }
 
 function sortedClassList(el: HTMLElement) {
-  var l = getDOM().classList(el);
-  ListWrapper.sort(l);
+  const l = getDOM().classList(el);
+  l.sort();
   return l;
 }
diff --git a/modules/@angular/forms/test/validators_spec.ts b/modules/@angular/forms/test/validators_spec.ts
index 499e237f91..98fae5b530 100644
--- a/modules/@angular/forms/test/validators_spec.ts
+++ b/modules/@angular/forms/test/validators_spec.ts
@@ -17,8 +17,8 @@ import {EventEmitter} from '../src/facade/async';
 export function main() {
   function validator(key: string, error: any) {
     return function(c: AbstractControl) {
-      var r = {};
-      (r as any)[key] = error;
+      var r: {[k: string]: string} = {};
+      r[key] = error;
       return r;
     };
   }
diff --git a/modules/@angular/platform-browser-dynamic/test/testing_public_browser_spec.ts b/modules/@angular/platform-browser-dynamic/test/testing_public_browser_spec.ts
index 03a26ab5ba..3bbefb52b3 100644
--- a/modules/@angular/platform-browser-dynamic/test/testing_public_browser_spec.ts
+++ b/modules/@angular/platform-browser-dynamic/test/testing_public_browser_spec.ts
@@ -124,8 +124,7 @@ export function main() {
            TestBed.compileComponents().then(() => {
              let componentFixture = TestBed.createComponent(ExternalTemplateComp);
              componentFixture.detectChanges();
-             expect(componentFixture.debugElement.nativeElement.textContent)
-                 .toEqual('from external template\n');
+             expect(componentFixture.nativeElement.textContent).toEqual('from external template\n');
            });
          }),
          10000);  // Long timeout here because this test makes an actual ResourceLoader request, and
diff --git a/modules/@angular/platform-browser/test/testing_public_spec.ts b/modules/@angular/platform-browser/test/testing_public_spec.ts
index 8fcf07d07d..0aad190002 100644
--- a/modules/@angular/platform-browser/test/testing_public_spec.ts
+++ b/modules/@angular/platform-browser/test/testing_public_spec.ts
@@ -545,25 +545,25 @@ export function main() {
            var fixture = TestBed.createComponent(ChildComp);
            fixture.detectChanges();
 
-           expect(fixture.debugElement.nativeElement).toHaveText('Original Child');
+           expect(fixture.nativeElement).toHaveText('Original Child');
          }));
 
       it('should allow changing members of the component', async(() => {
 
            var componentFixture = TestBed.createComponent(MyIfComp);
            componentFixture.detectChanges();
-           expect(componentFixture.debugElement.nativeElement).toHaveText('MyIf()');
+           expect(componentFixture.nativeElement).toHaveText('MyIf()');
 
-           componentFixture.debugElement.componentInstance.showMore = true;
+           componentFixture.componentInstance.showMore = true;
            componentFixture.detectChanges();
-           expect(componentFixture.debugElement.nativeElement).toHaveText('MyIf(More)');
+           expect(componentFixture.nativeElement).toHaveText('MyIf(More)');
          }));
 
       it('should override a template', async(() => {
            TestBed.overrideComponent(ChildComp, {set: {template: '<span>Mock</span>'}});
            let componentFixture = TestBed.createComponent(ChildComp);
            componentFixture.detectChanges();
-           expect(componentFixture.debugElement.nativeElement).toHaveText('Mock');
+           expect(componentFixture.nativeElement).toHaveText('Mock');
 
          }));
 
@@ -573,8 +573,7 @@ export function main() {
                {set: {providers: [{provide: FancyService, useClass: MockFancyService}]}});
            var componentFixture = TestBed.createComponent(TestProvidersComp);
            componentFixture.detectChanges();
-           expect(componentFixture.debugElement.nativeElement)
-               .toHaveText('injected value: mocked out value');
+           expect(componentFixture.nativeElement).toHaveText('injected value: mocked out value');
          }));
 
 
@@ -585,8 +584,7 @@ export function main() {
 
            var componentFixture = TestBed.createComponent(TestViewProvidersComp);
            componentFixture.detectChanges();
-           expect(componentFixture.debugElement.nativeElement)
-               .toHaveText('injected value: mocked out value');
+           expect(componentFixture.nativeElement).toHaveText('injected value: mocked out value');
          }));
     });
     describe('using alternate components', () => {
@@ -603,7 +601,7 @@ export function main() {
 
            let componentFixture = TestBed.createComponent(ParentComp);
            componentFixture.detectChanges();
-           expect(componentFixture.debugElement.nativeElement).toHaveText('Parent(Mock)');
+           expect(componentFixture.nativeElement).toHaveText('Parent(Mock)');
          }));
     });
   });
diff --git a/modules/@angular/platform-webworker/test/web_workers/worker/renderer_integration_spec.ts b/modules/@angular/platform-webworker/test/web_workers/worker/renderer_integration_spec.ts
index beec1b58cf..755b099921 100644
--- a/modules/@angular/platform-webworker/test/web_workers/worker/renderer_integration_spec.ts
+++ b/modules/@angular/platform-webworker/test/web_workers/worker/renderer_integration_spec.ts
@@ -106,10 +106,10 @@ export function main() {
       TestBed.overrideComponent(MyComp2, {set: {template: '<div>{{ctxProp}}</div>'}});
       const fixture = TestBed.createComponent(MyComp2);
 
-      var renderEl = getRenderElement(fixture.debugElement.nativeElement);
+      var renderEl = getRenderElement(fixture.nativeElement);
       expect(renderEl).toHaveText('');
 
-      fixture.debugElement.componentInstance.ctxProp = 'Hello World!';
+      fixture.componentInstance.ctxProp = 'Hello World!';
       fixture.detectChanges();
       expect(renderEl).toHaveText('Hello World!');
     });
@@ -142,7 +142,7 @@ export function main() {
              };
 
          // root element
-         checkSetters(fixture.componentRef, fixture.debugElement.nativeElement);
+         checkSetters(fixture.componentRef, fixture.nativeElement);
          // nested elements
          checkSetters(fixture.componentRef, fixture.debugElement.children[0].nativeElement);
        });
@@ -153,9 +153,9 @@ export function main() {
           MyComp2, {set: {template: '<template [ngIf]="ctxBoolProp"></template>'}});
       const fixture = TestBed.createComponent(MyComp2);
 
-      (<MyComp2>fixture.debugElement.componentInstance).ctxBoolProp = true;
+      (<MyComp2>fixture.componentInstance).ctxBoolProp = true;
       fixture.detectChanges();
-      var el = getRenderElement(fixture.debugElement.nativeElement);
+      var el = getRenderElement(fixture.nativeElement);
       expect(getDOM().getInnerHTML(el)).toContain('"ng-reflect-ng-if": "true"');
     });
 
@@ -164,14 +164,14 @@ export function main() {
           MyComp2, {set: {template: '<template [ngIf]="ctxBoolProp">hello</template>'}});
       const fixture = TestBed.createComponent(MyComp2);
 
-      var rootEl = getRenderElement(fixture.debugElement.nativeElement);
+      var rootEl = getRenderElement(fixture.nativeElement);
       expect(rootEl).toHaveText('');
 
-      fixture.debugElement.componentInstance.ctxBoolProp = true;
+      fixture.componentInstance.ctxBoolProp = true;
       fixture.detectChanges();
       expect(rootEl).toHaveText('hello');
 
-      fixture.debugElement.componentInstance.ctxBoolProp = false;
+      fixture.componentInstance.ctxBoolProp = false;
       fixture.detectChanges();
       expect(rootEl).toHaveText('');
     });
diff --git a/modules/@angular/router/test/integration.spec.ts b/modules/@angular/router/test/integration.spec.ts
index f1a850aef5..4a529dc443 100644
--- a/modules/@angular/router/test/integration.spec.ts
+++ b/modules/@angular/router/test/integration.spec.ts
@@ -131,14 +131,14 @@ describe('Integration', () => {
        advance(fixture);
        expect(location.path()).toEqual('/team/22');
 
-       expect(fixture.debugElement.nativeElement).toHaveText('team 22 [ , right:  ]');
+       expect(fixture.nativeElement).toHaveText('team 22 [ , right:  ]');
 
        router.navigateByUrl('/team/33', {skipLocationChange: true});
        advance(fixture);
 
        expect(location.path()).toEqual('/team/22');
 
-       expect(fixture.debugElement.nativeElement).toHaveText('team 33 [ , right:  ]');
+       expect(fixture.nativeElement).toHaveText('team 33 [ , right:  ]');
      })));
 
   it('should skip location update when using NavigationExtras.skipLocationChange with navigate',
@@ -152,14 +152,14 @@ describe('Integration', () => {
        advance(fixture);
        expect(location.path()).toEqual('/team/22');
 
-       expect(fixture.debugElement.nativeElement).toHaveText('team 22 [ , right:  ]');
+       expect(fixture.nativeElement).toHaveText('team 22 [ , right:  ]');
 
        router.navigate(['/team/33'], {skipLocationChange: true});
        advance(fixture);
 
        expect(location.path()).toEqual('/team/22');
 
-       expect(fixture.debugElement.nativeElement).toHaveText('team 33 [ , right:  ]');
+       expect(fixture.nativeElement).toHaveText('team 33 [ , right:  ]');
      })));
 
   it('should navigate back and forward',
@@ -212,7 +212,7 @@ describe('Integration', () => {
        (<any>location).simulateUrlPop('/team/22/user/fedor');
        advance(fixture);
 
-       expect(fixture.debugElement.nativeElement).toHaveText('team 22 [ user fedor, right:  ]');
+       expect(fixture.nativeElement).toHaveText('team 22 [ user fedor, right:  ]');
 
        expectEvents(recordedEvents, [
          [NavigationStart, '/team/22/user/victor'], [RoutesRecognized, '/team/22/user/victor'],
@@ -233,14 +233,14 @@ describe('Integration', () => {
        advance(fixture);
        const cmp = fixture.debugElement.children[1].componentInstance;
        expect(location.path()).toEqual('/one/two');
-       expect(fixture.debugElement.nativeElement).toHaveText('collect-params');
+       expect(fixture.nativeElement).toHaveText('collect-params');
 
        expect(cmp.recordedUrls()).toEqual(['one/two']);
 
        router.navigateByUrl('/three/four');
        advance(fixture);
        expect(location.path()).toEqual('/three/four');
-       expect(fixture.debugElement.nativeElement).toHaveText('collect-params');
+       expect(fixture.nativeElement).toHaveText('collect-params');
        expect(cmp.recordedUrls()).toEqual(['one/two', 'three/four']);
      })));
 
@@ -259,8 +259,7 @@ describe('Integration', () => {
        router.navigateByUrl('/team/22/(user/victor//right:simple)');
        advance(fixture);
 
-       expect(fixture.debugElement.nativeElement)
-           .toHaveText('team 22 [ user victor, right: simple ]');
+       expect(fixture.nativeElement).toHaveText('team 22 [ user victor, right: simple ]');
      })));
 
   it('should deactivate outlets', fakeAsync(inject([Router], (router: Router) => {
@@ -281,7 +280,7 @@ describe('Integration', () => {
        router.navigateByUrl('/team/22/user/victor');
        advance(fixture);
 
-       expect(fixture.debugElement.nativeElement).toHaveText('team 22 [ user victor, right:  ]');
+       expect(fixture.nativeElement).toHaveText('team 22 [ user victor, right:  ]');
      })));
 
   it('should deactivate nested outlets', fakeAsync(inject([Router], (router: Router) => {
@@ -305,7 +304,7 @@ describe('Integration', () => {
        router.navigateByUrl('/');
        advance(fixture);
 
-       expect(fixture.debugElement.nativeElement).toHaveText('');
+       expect(fixture.nativeElement).toHaveText('');
      })));
 
   it('should set query params and fragment', fakeAsync(inject([Router], (router: Router) => {
@@ -315,11 +314,11 @@ describe('Integration', () => {
 
        router.navigateByUrl('/query?name=1#fragment1');
        advance(fixture);
-       expect(fixture.debugElement.nativeElement).toHaveText('query: 1 fragment: fragment1');
+       expect(fixture.nativeElement).toHaveText('query: 1 fragment: fragment1');
 
        router.navigateByUrl('/query?name=2#fragment2');
        advance(fixture);
-       expect(fixture.debugElement.nativeElement).toHaveText('query: 2 fragment: fragment2');
+       expect(fixture.nativeElement).toHaveText('query: 2 fragment: fragment2');
      })));
 
   it('should push params only when they change', fakeAsync(inject([Router], (router: Router) => {
@@ -357,12 +356,12 @@ describe('Integration', () => {
        router.navigateByUrl('/user/victor');
        advance(fixture);
 
-       expect(fixture.debugElement.nativeElement).toHaveText('user victor');
+       expect(fixture.nativeElement).toHaveText('user victor');
 
        router.navigateByUrl('/');
        advance(fixture);
 
-       expect(fixture.debugElement.nativeElement).toHaveText('simple');
+       expect(fixture.nativeElement).toHaveText('simple');
      })));
 
   it('should cancel in-flight navigations', fakeAsync(inject([Router], (router: Router) => {
@@ -386,7 +385,7 @@ describe('Integration', () => {
        expect(r1).toEqual(false);  // returns false because it was canceled
        expect(r2).toEqual(true);   // returns true because it was successful
 
-       expect(fixture.debugElement.nativeElement).toHaveText('user fedor');
+       expect(fixture.nativeElement).toHaveText('user fedor');
        expect(user.recordedParams).toEqual([{name: 'init'}, {name: 'fedor'}]);
 
        expectEvents(recordedEvents, [
@@ -416,7 +415,7 @@ describe('Integration', () => {
        router.navigateByUrl('/user/fedor');
        advance(fixture);
 
-       expect(fixture.debugElement.nativeElement).toHaveText('user fedor');
+       expect(fixture.nativeElement).toHaveText('user fedor');
 
        expectEvents(recordedEvents, [
          [NavigationStart, '/invalid'], [NavigationError, '/invalid'],
@@ -488,27 +487,25 @@ describe('Integration', () => {
        router.navigateByUrl('/parent/11/(simple//right:user/victor)');
        advance(fixture);
        expect(location.path()).toEqual('/parent/11/(simple//right:user/victor)');
-       expect(fixture.debugElement.nativeElement)
-           .toHaveText('primary [simple] right [user victor]');
+       expect(fixture.nativeElement).toHaveText('primary [simple] right [user victor]');
 
        // navigate to the same route with different params (reuse)
        router.navigateByUrl('/parent/22/(simple//right:user/fedor)');
        advance(fixture);
        expect(location.path()).toEqual('/parent/22/(simple//right:user/fedor)');
-       expect(fixture.debugElement.nativeElement).toHaveText('primary [simple] right [user fedor]');
+       expect(fixture.nativeElement).toHaveText('primary [simple] right [user fedor]');
 
        // navigate to a normal route (check deactivation)
        router.navigateByUrl('/user/victor');
        advance(fixture);
        expect(location.path()).toEqual('/user/victor');
-       expect(fixture.debugElement.nativeElement).toHaveText('primary [user victor] right []');
+       expect(fixture.nativeElement).toHaveText('primary [user victor] right []');
 
        // navigate back to a componentless route
        router.navigateByUrl('/parent/11/(simple//right:user/victor)');
        advance(fixture);
        expect(location.path()).toEqual('/parent/11/(simple//right:user/victor)');
-       expect(fixture.debugElement.nativeElement)
-           .toHaveText('primary [simple] right [user victor]');
+       expect(fixture.nativeElement).toHaveText('primary [simple] right [user victor]');
      })));
 
   it('should emit an event when an outlet gets activated', fakeAsync(() => {
@@ -531,7 +528,7 @@ describe('Integration', () => {
        const router: Router = TestBed.get(Router);
 
        const fixture = createRoot(router, Container);
-       const cmp = fixture.debugElement.componentInstance;
+       const cmp = fixture.componentInstance;
 
        router.resetConfig(
            [{path: 'blank', component: BlankCmp}, {path: 'simple', component: SimpleCmp}]);
@@ -645,14 +642,14 @@ describe('Integration', () => {
 
          router.navigateByUrl('/team/22/link');
          advance(fixture);
-         expect(fixture.debugElement.nativeElement).toHaveText('team 22 [ link, right:  ]');
+         expect(fixture.nativeElement).toHaveText('team 22 [ link, right:  ]');
 
-         const native = fixture.debugElement.nativeElement.querySelector('a');
+         const native = fixture.nativeElement.querySelector('a');
          expect(native.getAttribute('href')).toEqual('/team/33/simple');
          native.click();
          advance(fixture);
 
-         expect(fixture.debugElement.nativeElement).toHaveText('team 33 [ simple, right:  ]');
+         expect(fixture.nativeElement).toHaveText('team 33 [ simple, right:  ]');
        })));
 
     it('should not preserve query params and fragment by default', fakeAsync(() => {
@@ -670,7 +667,7 @@ describe('Integration', () => {
 
          router.resetConfig([{path: 'home', component: SimpleCmp}]);
 
-         const native = fixture.debugElement.nativeElement.querySelector('a');
+         const native = fixture.nativeElement.querySelector('a');
 
          router.navigateByUrl('/home?q=123#fragment');
          advance(fixture);
@@ -692,7 +689,7 @@ describe('Integration', () => {
 
          router.resetConfig([{path: 'home', component: SimpleCmp}]);
 
-         const native = fixture.debugElement.nativeElement.querySelector('a');
+         const native = fixture.nativeElement.querySelector('a');
 
          router.navigateByUrl('/home?q=123');
          advance(fixture);
@@ -721,13 +718,13 @@ describe('Integration', () => {
 
          router.navigateByUrl('/team/22/link');
          advance(fixture);
-         expect(fixture.debugElement.nativeElement).toHaveText('team 22 [ link, right:  ]');
+         expect(fixture.nativeElement).toHaveText('team 22 [ link, right:  ]');
 
-         const native = fixture.debugElement.nativeElement.querySelector('button');
+         const native = fixture.nativeElement.querySelector('button');
          native.click();
          advance(fixture);
 
-         expect(fixture.debugElement.nativeElement).toHaveText('team 33 [ simple, right:  ]');
+         expect(fixture.nativeElement).toHaveText('team 33 [ simple, right:  ]');
        })));
 
     it('should support absolute router links', fakeAsync(inject([Router], (router: Router) => {
@@ -743,14 +740,14 @@ describe('Integration', () => {
 
          router.navigateByUrl('/team/22/link');
          advance(fixture);
-         expect(fixture.debugElement.nativeElement).toHaveText('team 22 [ link, right:  ]');
+         expect(fixture.nativeElement).toHaveText('team 22 [ link, right:  ]');
 
-         const native = fixture.debugElement.nativeElement.querySelector('a');
+         const native = fixture.nativeElement.querySelector('a');
          expect(native.getAttribute('href')).toEqual('/team/33/simple');
          native.click();
          advance(fixture);
 
-         expect(fixture.debugElement.nativeElement).toHaveText('team 33 [ simple, right:  ]');
+         expect(fixture.nativeElement).toHaveText('team 33 [ simple, right:  ]');
        })));
 
     it('should support relative router links', fakeAsync(inject([Router], (router: Router) => {
@@ -766,14 +763,14 @@ describe('Integration', () => {
 
          router.navigateByUrl('/team/22/link');
          advance(fixture);
-         expect(fixture.debugElement.nativeElement).toHaveText('team 22 [ link, right:  ]');
+         expect(fixture.nativeElement).toHaveText('team 22 [ link, right:  ]');
 
-         const native = fixture.debugElement.nativeElement.querySelector('a');
+         const native = fixture.nativeElement.querySelector('a');
          expect(native.getAttribute('href')).toEqual('/team/22/simple');
          native.click();
          advance(fixture);
 
-         expect(fixture.debugElement.nativeElement).toHaveText('team 22 [ simple, right:  ]');
+         expect(fixture.nativeElement).toHaveText('team 22 [ simple, right:  ]');
        })));
 
     it('should support top-level link', fakeAsync(inject([Router], (router: Router) => {
@@ -785,20 +782,20 @@ describe('Integration', () => {
 
          router.navigateByUrl('/');
          advance(fixture);
-         expect(fixture.debugElement.nativeElement).toHaveText(' ');
-         const cmp = fixture.debugElement.componentInstance;
+         expect(fixture.nativeElement).toHaveText(' ');
+         const cmp = fixture.componentInstance;
 
          cmp.show = true;
          advance(fixture);
 
-         expect(fixture.debugElement.nativeElement).toHaveText('link ');
-         const native = fixture.debugElement.nativeElement.querySelector('a');
+         expect(fixture.nativeElement).toHaveText('link ');
+         const native = fixture.nativeElement.querySelector('a');
 
          expect(native.getAttribute('href')).toEqual('/simple');
          native.click();
          advance(fixture);
 
-         expect(fixture.debugElement.nativeElement).toHaveText('link simple');
+         expect(fixture.nativeElement).toHaveText('link simple');
        })));
 
     it('should support query params and fragments',
@@ -817,12 +814,12 @@ describe('Integration', () => {
          router.navigateByUrl('/team/22/link');
          advance(fixture);
 
-         const native = fixture.debugElement.nativeElement.querySelector('a');
+         const native = fixture.nativeElement.querySelector('a');
          expect(native.getAttribute('href')).toEqual('/team/22/simple?q=1#f');
          native.click();
          advance(fixture);
 
-         expect(fixture.debugElement.nativeElement).toHaveText('team 22 [ simple, right:  ]');
+         expect(fixture.nativeElement).toHaveText('team 22 [ simple, right:  ]');
 
          expect(location.path()).toEqual('/team/22/simple?q=1#f');
        })));
@@ -1401,8 +1398,8 @@ describe('Integration', () => {
          advance(fixture);
          expect(location.path()).toEqual('/team/22/link;exact=true');
 
-         const nativeLink = fixture.debugElement.nativeElement.querySelector('a');
-         const nativeButton = fixture.debugElement.nativeElement.querySelector('button');
+         const nativeLink = fixture.nativeElement.querySelector('a');
+         const nativeButton = fixture.nativeElement.querySelector('button');
          expect(nativeLink.className).toEqual('active');
          expect(nativeButton.className).toEqual('active');
 
@@ -1427,7 +1424,7 @@ describe('Integration', () => {
          const f = TestBed.createComponent(RootCmpWithLink);
          advance(f);
 
-         const link = f.debugElement.nativeElement.querySelector('a');
+         const link = f.nativeElement.querySelector('a');
          expect(link.className).toEqual('');
 
          router.initialNavigation();
@@ -1456,7 +1453,7 @@ describe('Integration', () => {
          advance(fixture);
          expect(location.path()).toEqual('/team/22/link;exact=true');
 
-         const native = fixture.debugElement.nativeElement.querySelector('#link-parent');
+         const native = fixture.nativeElement.querySelector('#link-parent');
          expect(native.className).toEqual('active');
 
          router.navigateByUrl('/team/22/link/simple');
@@ -1484,7 +1481,7 @@ describe('Integration', () => {
          advance(fixture);
          expect(location.path()).toEqual('/team/22/link');
 
-         const native = fixture.debugElement.nativeElement.querySelector('a');
+         const native = fixture.nativeElement.querySelector('a');
          expect(native.className).toEqual('active');
 
          router.navigateByUrl('/team/22/link/simple');
@@ -1496,45 +1493,45 @@ describe('Integration', () => {
   });
 
   describe('lazy loading', () => {
-    it('works', fakeAsync(inject(
-                    [Router, Location, NgModuleFactoryLoader],
-                    (router: Router, location: Location, loader: SpyNgModuleFactoryLoader) => {
-                      @Component({
-                        selector: 'lazy',
-                        template: 'lazy-loaded-parent [<router-outlet></router-outlet>]'
-                      })
-                      class ParentLazyLoadedComponent {
-                      }
+    it('works',
+       fakeAsync(inject(
+           [Router, Location, NgModuleFactoryLoader],
+           (router: Router, location: Location, loader: SpyNgModuleFactoryLoader) => {
+             @Component({
+               selector: 'lazy',
+               template: 'lazy-loaded-parent [<router-outlet></router-outlet>]'
+             })
+             class ParentLazyLoadedComponent {
+             }
 
-                      @Component({selector: 'lazy', template: 'lazy-loaded-child'})
-                      class ChildLazyLoadedComponent {
-                      }
+             @Component({selector: 'lazy', template: 'lazy-loaded-child'})
+             class ChildLazyLoadedComponent {
+             }
 
-                      @NgModule({
-                        declarations: [ParentLazyLoadedComponent, ChildLazyLoadedComponent],
-                        imports: [RouterModule.forChild([{
-                          path: 'loaded',
-                          component: ParentLazyLoadedComponent,
-                          children: [{path: 'child', component: ChildLazyLoadedComponent}]
-                        }])]
-                      })
-                      class LoadedModule {
-                      }
+             @NgModule({
+               declarations: [ParentLazyLoadedComponent, ChildLazyLoadedComponent],
+               imports: [RouterModule.forChild([{
+                 path: 'loaded',
+                 component: ParentLazyLoadedComponent,
+                 children: [{path: 'child', component: ChildLazyLoadedComponent}]
+               }])]
+             })
+             class LoadedModule {
+             }
 
 
-                      loader.stubbedModules = {expected: LoadedModule};
+             loader.stubbedModules = {expected: LoadedModule};
 
-                      const fixture = createRoot(router, RootCmp);
+             const fixture = createRoot(router, RootCmp);
 
-                      router.resetConfig([{path: 'lazy', loadChildren: 'expected'}]);
+             router.resetConfig([{path: 'lazy', loadChildren: 'expected'}]);
 
-                      router.navigateByUrl('/lazy/loaded/child');
-                      advance(fixture);
+             router.navigateByUrl('/lazy/loaded/child');
+             advance(fixture);
 
-                      expect(location.path()).toEqual('/lazy/loaded/child');
-                      expect(fixture.debugElement.nativeElement)
-                          .toHaveText('lazy-loaded-parent [lazy-loaded-child]');
-                    })));
+             expect(location.path()).toEqual('/lazy/loaded/child');
+             expect(fixture.nativeElement).toHaveText('lazy-loaded-parent [lazy-loaded-child]');
+           })));
     it('throws an error when forRoot() is used in a lazy context',
        fakeAsync(inject(
            [Router, Location, NgModuleFactoryLoader],
@@ -1656,7 +1653,7 @@ describe('Integration', () => {
              advance(fixture);
 
              expect(location.path()).toEqual('/lazy/loaded/child');
-             expect(fixture.debugElement.nativeElement).toHaveText('lazy-loaded');
+             expect(fixture.nativeElement).toHaveText('lazy-loaded');
            })));
 
     it('works when given a callback',
@@ -1681,7 +1678,7 @@ describe('Integration', () => {
              advance(fixture);
 
              expect(location.path()).toEqual('/lazy/loaded');
-             expect(fixture.debugElement.nativeElement).toHaveText('lazy-loaded');
+             expect(fixture.nativeElement).toHaveText('lazy-loaded');
            })));
 
     it('error emit an error when cannot load a config',
diff --git a/tools/public_api_guard/core/testing/index.d.ts b/tools/public_api_guard/core/testing/index.d.ts
index a9ae47f8d5..676bfb81f2 100644
--- a/tools/public_api_guard/core/testing/index.d.ts
+++ b/tools/public_api_guard/core/testing/index.d.ts
@@ -10,7 +10,7 @@ export declare class ComponentFixture<T> {
     elementRef: ElementRef;
     nativeElement: any;
     ngZone: NgZone;
-    constructor(componentRef: ComponentRef<T>, ngZone: NgZone, autoDetect: boolean);
+    constructor(componentRef: ComponentRef<T>, ngZone: NgZone, _autoDetect: boolean);
     autoDetectChanges(autoDetect?: boolean): void;
     checkNoChanges(): void;
     destroy(): void;