feat(core): introduce fixture.whenRenderingDone for testing (angular#16732)

Author: matsko

packages/core/test/component_fixture_spec.ts

@@ -158,6 +158,25 @@ export function main() {
          });
        }));
 
+    it('should signal through whenRenderingDone when the fixture is stable', async(() => {
+         const componentFixture = TestBed.createComponent(AsyncComp);
+
+         componentFixture.detectChanges();
+         expect(componentFixture.nativeElement).toHaveText('1');
+
+         const element = componentFixture.debugElement.children[0];
+         dispatchEvent(element.nativeElement, 'click');
+         expect(componentFixture.nativeElement).toHaveText('1');
+
+         // Component is updated asynchronously. Wait for the fixture to become stable
+         // before checking.
+         componentFixture.whenRenderingDone().then((waited) => {
+           expect(waited).toBe(true);
+           componentFixture.detectChanges();
+           expect(componentFixture.nativeElement).toHaveText('11');
+         });
+       }));
+
     it('should wait for macroTask(setTimeout) while checking for whenStable ' +
            '(autoDetectChanges)',
        async(() => {

packages/core/testing/src/component_fixture.ts

@@ -160,6 +160,14 @@ export class ComponentFixture<T> {
     }
   }
 
+  /**
+   * Get a promise that resolves when the ui state is stable following animations.
+   */
+  whenRenderingDone(): Promise<any> {
+    // this is temporary until this is functional
+    return this.whenStable();
+  }
+
   /**
    * Trigger component destruction.
    */

tools/public_api_guard/core/testing.d.ts

@@ -16,6 +16,7 @@ export declare class ComponentFixture<T> {
     destroy(): void;
     detectChanges(checkNoChanges?: boolean): void;
     isStable(): boolean;
+    whenRenderingDone(): Promise<any>;
     whenStable(): Promise<any>;
 }