diff --git a/aio/content/examples/testing/src/app/dashboard/dashboard-hero.component.spec.ts b/aio/content/examples/testing/src/app/dashboard/dashboard-hero.component.spec.ts
index ff040f83f6..c89744a809 100644
--- a/aio/content/examples/testing/src/app/dashboard/dashboard-hero.component.spec.ts
+++ b/aio/content/examples/testing/src/app/dashboard/dashboard-hero.component.spec.ts
@@ -3,6 +3,7 @@
 import { DebugElement } from '@angular/core';
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
+import { first } from 'rxjs/operators';
 
 import { addMatchers, click } from '../../testing';
 import { Hero } from '../model/hero';
@@ -18,7 +19,7 @@ describe('DashboardHeroComponent class only', () => {
     const hero: Hero = {id: 42, name: 'Test'};
     comp.hero = hero;
 
-    comp.selected.subscribe((selectedHero: Hero) => expect(selectedHero).toBe(hero));
+    comp.selected.pipe(first()).subscribe((selectedHero: Hero) => expect(selectedHero).toBe(hero));
     comp.click();
   });
   // #enddocregion class-only
@@ -69,7 +70,7 @@ describe('DashboardHeroComponent when tested directly', () => {
   // #docregion click-test
   it('should raise selected event when clicked (triggerEventHandler)', () => {
     let selectedHero: Hero | undefined;
-    comp.selected.subscribe((hero: Hero) => selectedHero = hero);
+    comp.selected.pipe(first()).subscribe((hero: Hero) => selectedHero = hero);
 
     // #docregion trigger-event-handler
     heroDe.triggerEventHandler('click', null);
@@ -81,7 +82,7 @@ describe('DashboardHeroComponent when tested directly', () => {
   // #docregion click-test-2
   it('should raise selected event when clicked (element.click)', () => {
     let selectedHero: Hero | undefined;
-    comp.selected.subscribe((hero: Hero) => selectedHero = hero);
+    comp.selected.pipe(first()).subscribe((hero: Hero) => selectedHero = hero);
 
     heroEl.click();
     expect(selectedHero).toBe(expectedHero);
@@ -89,16 +90,24 @@ describe('DashboardHeroComponent when tested directly', () => {
   // #enddocregion click-test-2
 
   // #docregion click-test-3
-  it('should raise selected event when clicked (click helper)', () => {
+  it('should raise selected event when clicked (click helper with DebugElement)', () => {
     let selectedHero: Hero | undefined;
-    comp.selected.subscribe((hero: Hero) => selectedHero = hero);
+    comp.selected.pipe(first()).subscribe((hero: Hero) => selectedHero = hero);
 
     click(heroDe);  // click helper with DebugElement
-    click(heroEl);  // click helper with native element
 
     expect(selectedHero).toBe(expectedHero);
   });
   // #enddocregion click-test-3
+
+  it('should raise selected event when clicked (click helper with native element)', () => {
+    let selectedHero: Hero | undefined;
+    comp.selected.pipe(first()).subscribe((hero: Hero) => selectedHero = hero);
+
+    click(heroEl);  // click helper with native element
+
+    expect(selectedHero).toBe(expectedHero);
+  });
 });
 
 //////////////////