nits

Author: mmalerba

src/cdk-experimental/testing/component-harness.ts

@@ -24,17 +24,7 @@ export interface HarnessLoader {
    * @return A `HarnessLoader` rooted at the element matching the given selector.
    * @throws If a matching element can't be found.
    */
-  findRequired(selector: string): Promise<HarnessLoader>;
-
-  /**
-   * Searches for an element with the given selector under the current instances's root element,
-   * and returns a `HarnessLoader` rooted at the matching element. If multiple elements match the
-   * selector, the first is used. If no elements match, null is returned.
-   * @param selector The selector for the root element of the new `HarnessLoader`
-   * @return A `HarnessLoader` rooted at the element matching the given selector, or null if no
-   *     matching element was found.
-   */
-  findOptional(selector: string): Promise<HarnessLoader | null>;
+  getChildLoader(selector: string): Promise<HarnessLoader>;
 
   /**
    * Searches for all elements with the given selector under the current instances's root element,
@@ -43,7 +33,7 @@ export interface HarnessLoader {
    * @param selector The selector for the root element of the new `HarnessLoader`
    * @return A list of `HarnessLoader`s, one for each matching element, rooted at that element.
    */
-  findAll(selector: string): Promise<HarnessLoader[]>;
+  getAllChildLoaders(selector: string): Promise<HarnessLoader[]>;
 
   /**
    * Searches for an instance of the component corresponding to the given harness type under the
@@ -54,27 +44,16 @@ export interface HarnessLoader {
    * @return An instance of the given harness type
    * @throws If a matching component instance can't be found.
    */
-  requiredHarness<T extends ComponentHarness>(harnessType: ComponentHarnessConstructor<T>):
+  getHarness<T extends ComponentHarness>(harnessType: ComponentHarnessConstructor<T>):
       Promise<T>;
 
-  /**
-   * Searches for an instance of the component corresponding to the given harness type under the
-   * `HarnessLoader`'s root element, and returns a `ComponentHarness` for that instance. If multiple
-   * matching components are found, a harness for the first one is returned. If no matching
-   * component is found, null is returned.
-   * @param harnessType The type of harness to create
-   * @return An instance of the given harness type, or null if none is found.
-   */
-  optionalHarness<T extends ComponentHarness>(harnessType: ComponentHarnessConstructor<T>):
-      Promise<T | null>;
-
   /**
    * Searches for all instances of the component corresponding to the given harness type under the
    * `HarnessLoader`'s root element, and returns a list `ComponentHarness` for each instance.
    * @param harnessType The type of harness to create
    * @return A list instances of the given harness type.
    */
-  allHarnesses<T extends ComponentHarness>(harnessType: ComponentHarnessConstructor<T>):
+  getAllHarnesses<T extends ComponentHarness>(harnessType: ComponentHarnessConstructor<T>):
       Promise<T[]>;
 }
 
@@ -87,8 +66,8 @@ export interface LocatorFactory {
   /** Gets a locator factory rooted at the document root. */
   documentRootLocatorFactory(): LocatorFactory;
 
-  /** Gets the root element of this `LocatorFactory` as a `TestElement`. */
-  rootElement(): TestElement;
+  /** The root element of this `LocatorFactory` as a `TestElement`. */
+  rootElement: TestElement;
 
   /**
    * Creates an asynchronous locator function that can be used to search for elements with the given
@@ -99,7 +78,7 @@ export interface LocatorFactory {
    * @return An asynchronous locator function that searches for elements with the given selector,
    *     and either finds one or throws an error
    */
-  locatorForRequired(selector: string): AsyncFn<TestElement>;
+  locatorFor(selector: string): AsyncFn<TestElement>;
 
   /**
    * Creates an asynchronous locator function that can be used to find a `ComponentHarness` for a
@@ -110,7 +89,7 @@ export interface LocatorFactory {
    * @return An asynchronous locator function that searches components matching the given harness
    *     type, and either returns a `ComponentHarness` for the component, or throws an error.
    */
-  locatorForRequired<T extends ComponentHarness>(harnessType: ComponentHarnessConstructor<T>):
+  locatorFor<T extends ComponentHarness>(harnessType: ComponentHarnessConstructor<T>):
       AsyncFn<T>;
 
   /**
@@ -165,11 +144,11 @@ export interface LocatorFactory {
  * should be inherited when defining user's own harness.
  */
 export abstract class ComponentHarness {
-  constructor(private readonly locatorFacotry: LocatorFactory) {}
+  constructor(private readonly locatorFactory: LocatorFactory) {}
 
   /** Gets a `Promise` for the `TestElement` representing the host element of the component. */
   async host(): Promise<TestElement> {
-    return this.locatorFacotry.rootElement();
+    return this.locatorFactory.rootElement;
   }
 
   /**
@@ -178,7 +157,7 @@ export abstract class ComponentHarness {
    * appending to document.body).
    */
   protected documentRootLocatorFactory(): LocatorFactory {
-    return this.locatorFacotry.documentRootLocatorFactory();
+    return this.locatorFactory.documentRootLocatorFactory();
   }
 
   /**
@@ -190,7 +169,7 @@ export abstract class ComponentHarness {
    * @return An asynchronous locator function that searches for elements with the given selector,
    *     and either finds one or throws an error
    */
-  protected locatorForRequired(selector: string): AsyncFn<TestElement>;
+  protected locatorFor(selector: string): AsyncFn<TestElement>;
 
   /**
    * Creates an asynchronous locator function that can be used to find a `ComponentHarness` for a
@@ -201,11 +180,11 @@ export abstract class ComponentHarness {
    * @return An asynchronous locator function that searches components matching the given harness
    *     type, and either returns a `ComponentHarness` for the component, or throws an error.
    */
-  protected locatorForRequired<T extends ComponentHarness>(
+  protected locatorFor<T extends ComponentHarness>(
       harnessType: ComponentHarnessConstructor<T>): AsyncFn<T>;
 
-  protected locatorForRequired(arg: any): any {
-    return this.locatorFacotry.locatorForRequired(arg);
+  protected locatorFor(arg: any): any {
+    return this.locatorFactory.locatorFor(arg);
   }
 
   /**
@@ -232,7 +211,7 @@ export abstract class ComponentHarness {
       harnessType: ComponentHarnessConstructor<T>): AsyncFn<T | null>;
 
   protected locatorForOptional(arg: any): any {
-    return this.locatorFacotry.locatorForOptional(arg);
+    return this.locatorFactory.locatorForOptional(arg);
   }
 
   /**
@@ -258,7 +237,7 @@ export abstract class ComponentHarness {
       AsyncFn<T[]>;
 
   protected locatorForAll(arg: any): any {
-    return this.locatorFacotry.locatorForAll(arg);
+    return this.locatorFactory.locatorForAll(arg);
   }
 }
 

src/cdk-experimental/testing/harness-environment.ts

@@ -22,21 +22,23 @@ import {TestElement} from './test-element';
  * element type, `E`, used by the particular test environment.
  */
 export abstract class HarnessEnvironment<E> implements HarnessLoader, LocatorFactory {
-  protected constructor(protected rawRootElement: E) {}
+  // Implemented as part of the `LocatorFactory` interface.
+  rootElement: TestElement;
 
-  // Part of the `HarnessLoader` interface, delegated to concrete implementation.
-  abstract documentRootLocatorFactory(): LocatorFactory;
+  protected constructor(protected rawRootElement: E) {
+    this.rootElement = this.createTestElement(rawRootElement);
+  }
 
   // Implemented as part of the `LocatorFactory` interface.
-  rootElement(): TestElement {
-    return this.createTestElement(this.rawRootElement);
+  documentRootLocatorFactory(): LocatorFactory {
+    return this.createEnvironment(this.getDocumentRoot());
   }
 
   // Implemented as part of the `LocatorFactory` interface.
-  locatorForRequired(selector: string): AsyncFn<TestElement>;
-  locatorForRequired<T extends ComponentHarness>(harness: ComponentHarnessConstructor<T>):
+  locatorFor(selector: string): AsyncFn<TestElement>;
+  locatorFor<T extends ComponentHarness>(harnessType: ComponentHarnessConstructor<T>):
       AsyncFn<T>;
-  locatorForRequired<T extends ComponentHarness>(
+  locatorFor<T extends ComponentHarness>(
       arg: string | ComponentHarnessConstructor<T>): AsyncFn<TestElement | T> {
     return async () => {
       if (typeof arg === 'string') {
@@ -57,7 +59,7 @@ export abstract class HarnessEnvironment<E> implements HarnessLoader, LocatorFac
 
   // Implemented as part of the `LocatorFactory` interface.
   locatorForOptional(selector: string): AsyncFn<TestElement | null>;
-  locatorForOptional<T extends ComponentHarness>(harness: ComponentHarnessConstructor<T>):
+  locatorForOptional<T extends ComponentHarness>(harnessType: ComponentHarnessConstructor<T>):
       AsyncFn<T | null>;
   locatorForOptional<T extends ComponentHarness>(
       arg: string | ComponentHarnessConstructor<T>): AsyncFn<TestElement | T | null> {
@@ -74,7 +76,8 @@ export abstract class HarnessEnvironment<E> implements HarnessLoader, LocatorFac
 
   // Implemented as part of the `LocatorFactory` interface.
   locatorForAll(selector: string): AsyncFn<TestElement[]>;
-  locatorForAll<T extends ComponentHarness>(harness: ComponentHarnessConstructor<T>): AsyncFn<T[]>;
+  locatorForAll<T extends ComponentHarness>(harnessType: ComponentHarnessConstructor<T>):
+      AsyncFn<T[]>;
   locatorForAll<T extends ComponentHarness>(
       arg: string | ComponentHarnessConstructor<T>): AsyncFn<TestElement[] | T[]> {
     return async () => {
@@ -88,50 +91,45 @@ export abstract class HarnessEnvironment<E> implements HarnessLoader, LocatorFac
   }
 
   // Implemented as part of the `HarnessLoader` interface.
-  requiredHarness<T extends ComponentHarness>(harness: ComponentHarnessConstructor<T>): Promise<T> {
-    return this.locatorForRequired(harness)();
-  }
-
-  // Implemented as part of the `HarnessLoader` interface.
-  optionalHarness<T extends ComponentHarness>(harness: ComponentHarnessConstructor<T>):
-    Promise<T | null> {
-    return this.locatorForOptional(harness)();
+  getHarness<T extends ComponentHarness>(harnessType: ComponentHarnessConstructor<T>):
+      Promise<T> {
+    return this.locatorFor(harnessType)();
   }
 
   // Implemented as part of the `HarnessLoader` interface.
-  allHarnesses<T extends ComponentHarness>(harness: ComponentHarnessConstructor<T>): Promise<T[]> {
-    return this.locatorForAll(harness)();
+  getAllHarnesses<T extends ComponentHarness>(harnessType: ComponentHarnessConstructor<T>):
+      Promise<T[]> {
+    return this.locatorForAll(harnessType)();
   }
 
   // Implemented as part of the `HarnessLoader` interface.
-  async findRequired(selector: string): Promise<HarnessLoader> {
+  async getChildLoader(selector: string): Promise<HarnessLoader> {
     const element = await this.getRawElement(selector);
     if (element) {
-      return this.createHarnessLoader(element);
+      return this.createEnvironment(element);
     }
     throw Error(`Expected to find element matching selector: "${selector}", but none was found`);
   }
 
   // Implemented as part of the `HarnessLoader` interface.
-  async findOptional(selector: string): Promise<HarnessLoader | null> {
-    const element = await this.getRawElement(selector);
-    return element ? this.createHarnessLoader(element) : null;
+  async getAllChildLoaders(selector: string): Promise<HarnessLoader[]> {
+    return (await this.getAllRawElements(selector)).map(e => this.createEnvironment(e));
   }
 
-  // Implemented as part of the `HarnessLoader` interface.
-  async findAll(selector: string): Promise<HarnessLoader[]> {
-    return (await this.getAllRawElements(selector)).map(e => this.createHarnessLoader(e));
+  /** Creates a `ComponentHarness` for the given harness type with the given raw host element. */
+  protected createComponentHarness<T extends ComponentHarness>(
+      harnessType: ComponentHarnessConstructor<T>, element: E): T {
+    return new harnessType(this.createEnvironment(element));
   }
 
+  /** Gets the root element for the document. */
+  protected abstract getDocumentRoot(): E;
+
   /** Creates a `TestElement` from a raw element. */
   protected abstract createTestElement(element: E): TestElement;
 
-  /** Creates a `ComponentHarness` for the given harness type with the given raw host element. */
-  protected abstract createComponentHarness<T extends ComponentHarness>(
-    harnessType: ComponentHarnessConstructor<T>, element: E): T;
-
   /** Creates a `HarnessLoader` rooted at the given raw element. */
-  protected abstract createHarnessLoader(element: E): HarnessLoader;
+  protected abstract createEnvironment(element: E): HarnessEnvironment<E>;
 
   /**
    * Gets the first element matching the given selector under this environment's root element, or

src/cdk-experimental/testing/protractor/protractor-harness-environment.ts

@@ -7,12 +7,7 @@
  */
 
 import {by, element as protractorElement, ElementFinder} from 'protractor';
-import {
-  ComponentHarness,
-  ComponentHarnessConstructor,
-  HarnessLoader,
-  LocatorFactory,
-} from '../component-harness';
+import {HarnessLoader} from '../component-harness';
 import {HarnessEnvironment} from '../harness-environment';
 import {TestElement} from '../test-element';
 import {ProtractorElement} from './protractor-element';
@@ -28,20 +23,15 @@ export class ProtractorHarnessEnvironment extends HarnessEnvironment<ElementFind
     return new ProtractorHarnessEnvironment(protractorElement(by.css('body')));
   }
 
-  documentRootLocatorFactory(): LocatorFactory {
-    return new ProtractorHarnessEnvironment(protractorElement(by.css('body')));
+  protected getDocumentRoot(): ElementFinder {
+    return protractorElement(by.css('body'));
   }
 
   protected createTestElement(element: ElementFinder): TestElement {
     return new ProtractorElement(element);
   }
 
-  protected createComponentHarness<T extends ComponentHarness>(
-      harnessType: ComponentHarnessConstructor<T>, element: ElementFinder): T {
-    return new harnessType(new ProtractorHarnessEnvironment(element));
-  }
-
-  protected createHarnessLoader(element: ElementFinder): HarnessLoader {
+  protected createEnvironment(element: ElementFinder): HarnessEnvironment<ElementFinder> {
     return new ProtractorHarnessEnvironment(element);
   }
 

src/cdk-experimental/testing/testbed/testbed-harness-environment.ts

@@ -7,29 +7,20 @@
  */
 
 import {ComponentFixture} from '@angular/core/testing';
-import {
-  ComponentHarness,
-  ComponentHarnessConstructor,
-  HarnessLoader,
-  LocatorFactory
-} from '../component-harness';
+import {ComponentHarness, ComponentHarnessConstructor, HarnessLoader} from '../component-harness';
 import {HarnessEnvironment} from '../harness-environment';
 import {TestElement} from '../test-element';
 import {UnitTestElement} from './unit-test-element';
 
 /** A `HarnessEnvironment` implementation for Angular's Testbed. */
 export class TestbedHarnessEnvironment extends HarnessEnvironment<Element> {
-  protected constructor(rawRootElement: Element, private _stabilize: () => Promise<void>) {
+  protected constructor(rawRootElement: Element, private _fixture: ComponentFixture<unknown>) {
     super(rawRootElement);
   }
 
   /** Creates a `HarnessLoader` rooted at the given fixture's root element. */
   static create(fixture: ComponentFixture<unknown>): HarnessLoader {
-    const stabilize = async () => {
-      fixture.detectChanges();
-      await fixture.whenStable();
-    };
-    return new TestbedHarnessEnvironment(fixture.nativeElement, stabilize);
+    return new TestbedHarnessEnvironment(fixture.nativeElement, fixture);
   }
 
   /**
@@ -38,36 +29,23 @@ export class TestbedHarnessEnvironment extends HarnessEnvironment<Element> {
    * of a fixture, as components do not have the correct selector when they are created as the root
    * of the fixture.
    */
-  static async harnessForFixtureRoot<T extends ComponentHarness>(
+  static async harnessForFixture<T extends ComponentHarness>(
       fixture: ComponentFixture<unknown>, harnessType: ComponentHarnessConstructor<T>): Promise<T> {
-    const stabilize = async () => {
-      fixture.detectChanges();
-      await fixture.whenStable();
-    };
-    const environment = new TestbedHarnessEnvironment(fixture.nativeElement, stabilize);
+    const environment = new TestbedHarnessEnvironment(fixture.nativeElement, fixture);
     await environment._stabilize();
     return environment.createComponentHarness(harnessType, fixture.nativeElement);
   }
 
-  documentRootLocatorFactory(): LocatorFactory {
-    let element = this.rawRootElement;
-    while (element.parentElement) {
-      element = element.parentElement;
-    }
-    return new TestbedHarnessEnvironment(element, this._stabilize);
+  protected getDocumentRoot(): Element {
+    return this._fixture.nativeElement;
   }
 
   protected createTestElement(element: Element): TestElement {
-    return new UnitTestElement(element, this._stabilize);
+    return new UnitTestElement(element, this._stabilize.bind(this));
   }
 
-  protected createComponentHarness<T extends ComponentHarness>(
-      harnessType: ComponentHarnessConstructor<T>, element: Element): T {
-    return new harnessType(new TestbedHarnessEnvironment(element, this._stabilize));
-  }
-
-  protected createHarnessLoader(element: Element): HarnessLoader {
-    return new TestbedHarnessEnvironment(element, this._stabilize);
+  protected createEnvironment(element: Element): HarnessEnvironment<Element> {
+    return new TestbedHarnessEnvironment(element, this._fixture);
   }
 
   protected async getRawElement(selector: string): Promise<Element | null> {
@@ -79,4 +57,9 @@ export class TestbedHarnessEnvironment extends HarnessEnvironment<Element> {
     await this._stabilize();
     return Array.from(this.rawRootElement.querySelectorAll(selector));
   }
+
+  private async _stabilize(): Promise<void> {
+    this._fixture.detectChanges();
+    await this._fixture.whenStable();
+  }
 }