iSharkFly-Docs
/
angular-docs-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

docs: unsubscribe from observables (#42284) 

Add rxjs `first` operator in `DashboardHeroComponent` unit
tests to ensure unsubscription from observables

PR Close #42284
This commit is contained in:
Sam Severance 2021-05-24 14:42:02 -04:00 committed by Zach Arend
parent cb48bde35d
commit ad12b31c27
1 changed files with 15 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
aio/content/examples/testing/src/app/dashboard/dashboard-hero.component.spec.ts
View File

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