docs: testing guide for CLI (#20697)

- updates tests
- heavy prose revisions
- uses HttpClient (with angular-in-memory-web-api)
- test HeroService using `HttpClientTestingModule`
- scrub away most By.CSS
- fake async observable with `asyncData()`
- extensive Twain work
- different take on retryWhen
- remove app barrels (& systemjs.extras) which troubled plunker/systemjs
- add dummy export const to hero.ts (plunkr/systemjs fails w/o it)
- shrink and re-organize TOC
- add marble testing package and tests
- demonstrate the "no beforeEach()" test coding style
- add section on Http service testing
- prepare for stackblitz
- confirm works in plunker except excluded marble test
- add tests for avoidFile class feature of CodeExampleComponent

PR Close #20697

aio/src/app/embedded/code/code-example.component.spec.ts

@@ -72,12 +72,40 @@ describe('CodeExampleComponent', () => {
     expect(codeExampleDe.nativeElement.getAttribute('title')).toEqual(null);
   });
 
-  it('should pass hideCopy to CodeComonent', () => {
+  it('should pass hideCopy to CodeComponent', () => {
     TestBed.overrideComponent(HostComponent, {
       set: {template: '<code-example hideCopy="true"></code-example>'}});
     createComponent(oneLineCode);
     expect(codeComponent.hideCopy).toBe(true);
   });
+
+  it('should have `avoidFile` class when `avoid` atty present', () => {
+    TestBed.overrideComponent(HostComponent, {
+      set: {template: '<code-example avoid></code-example>'}});
+    createComponent(oneLineCode);
+    const classes: DOMTokenList = codeExampleDe.nativeElement.classList;
+    expect(classes.contains('avoidFile')).toBe(true, 'has avoidFile class');
+    expect(codeExampleComponent.isAvoid).toBe(true, 'isAvoid flag');
+    expect(codeComponent.hideCopy).toBe(true, 'hiding copy button');
+  });
+
+  it('should have `avoidFile` class when `.avoid` in path', () => {
+    TestBed.overrideComponent(HostComponent, {
+      set: {template: '<code-example path="test.avoid.ts"></code-example>'}});
+    createComponent(oneLineCode);
+    const classes: DOMTokenList = codeExampleDe.nativeElement.classList;
+    expect(classes.contains('avoidFile')).toBe(true, 'has avoidFile class');
+    expect(codeExampleComponent.isAvoid).toBe(true, 'isAvoid flag');
+    expect(codeComponent.hideCopy).toBe(true, 'hide copy button flag');
+  });
+
+  it('should not have `avoidFile` class in normal case', () => {
+    createComponent(oneLineCode);
+    const classes: DOMTokenList = codeExampleDe.nativeElement.classList;
+    expect(classes.contains('avoidFile')).toBe(false, 'avoidFile class');
+    expect(codeExampleComponent.isAvoid).toBe(false, 'isAvoid flag');
+    expect(codeComponent.hideCopy).toBe(false, 'hide copy button flag');
+  });
 });
 
 //// Test helpers ////