fix(material/testing): Fix newly introduced issue caused by the addition

of floating label functionality to MatFormFieldControlHarness class

Adding anything to this abstract class causes compilation issues when
using MatFormFieldHarness.getControl(...) to fetch a type other than the
directly supported types. The most common problems arise when fetching
MatAutocompleteHarness or MatChipGridHarness, but I have found instances
of other components such as MatCheckboxHarness. Moving the functionality
to a base class resolves this.

Author: wildcardalice

src/cdk/testing/component-harness.ts

@@ -119,17 +119,6 @@ export interface HarnessLoader {
    */
   getHarnessOrNull<T extends ComponentHarness>(query: HarnessQuery<T>): Promise<T | null>;
 
-  /**
-   * Searches for an instance of the component corresponding to the given harness type under the
-   * `HarnessLoader`'s root element, and returns a `ComponentHarness` for the instance on the page
-   * at the given index. If no matching component exists at that index, an error is thrown.
-   * @param query A query for a harness to create
-   * @param index The zero-indexed offset of the matching component instance to return
-   * @return An instance of the given harness type.
-   * @throws If a matching component instance can't be found at the given index.
-   */
-  getHarnessAtIndex<T extends ComponentHarness>(query: HarnessQuery<T>, index: number): Promise<T>;
-
   /**
    * 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.
@@ -138,14 +127,6 @@ export interface HarnessLoader {
    */
   getAllHarnesses<T extends ComponentHarness>(query: HarnessQuery<T>): Promise<T[]>;
 
-  /**
-   * Searches for all instances of the component corresponding to the given harness type under the
-   * `HarnessLoader`'s root element, and returns the total count of all matching components.
-   * @param query A query for a harness to create
-   * @return An integer indicating the number of instances that were found.
-   */
-  countHarnesses<T extends ComponentHarness>(query: HarnessQuery<T>): Promise<number>;
-
   /**
    * Searches for an instance of the component corresponding to the given harness type under the
    * `HarnessLoader`'s root element, and returns a boolean indicating if any were found.
@@ -519,20 +500,6 @@ export abstract class ContentContainerComponentHarness<S extends string = string
     return (await this.getRootHarnessLoader()).getHarnessOrNull(query);
   }
 
-  /**
-   * Gets a matching harness for the given query and index within the current harness's content.
-   * @param query The harness query to search for.
-   * @param index The zero-indexed offset of the component to find.
-   * @returns The first harness matching the given query.
-   * @throws If no matching harness is found.
-   */
-  async getHarnessAtIndex<T extends ComponentHarness>(
-    query: HarnessQuery<T>,
-    index: number,
-  ): Promise<T> {
-    return (await this.getRootHarnessLoader()).getHarnessAtIndex(query, index);
-  }
-
   /**
    * Gets all matching harnesses for the given query within the current harness's content.
    * @param query The harness query to search for.
@@ -542,23 +509,12 @@ export abstract class ContentContainerComponentHarness<S extends string = string
     return (await this.getRootHarnessLoader()).getAllHarnesses(query);
   }
 
- /**
-   * Returns the number of matching harnesses for the given query within the current harness's
-   * content.
-   *
-   * @param query The harness query to search for.
-   * @returns The number of matching harnesses for the given query.
-   */
-  async countHarnesses<T extends ComponentHarness>(query: HarnessQuery<T>): Promise<number> {
-    return (await this.getRootHarnessLoader()).countHarnesses(query);
-  }
-
   /**
    * Checks whether there is a matching harnesses for the given query within the current harness's
    * content.
    *
    * @param query The harness query to search for.
-   * @returns Whether there is matching harnesses for the given query.
+   * @returns Whetehr there is matching harnesses for the given query.
    */
   async hasHarness<T extends ComponentHarness>(query: HarnessQuery<T>): Promise<boolean> {
     return (await this.getRootHarnessLoader()).hasHarness(query);

src/material/datepicker/testing/date-range-input-harness.ts

@@ -93,7 +93,7 @@ export class MatDateRangeInputHarness extends DatepickerTriggerHarnessBase {
 
   /** Gets the floating label text for the range input, if it exists. */
   async getLabel(): Promise<string | null> {
-    // Copied from MatFormFieldControlHarness since this class cannot extend two classes
+    // Copied from MatFormFieldControlHarnessBase since this class cannot extend two classes
     const documentRootLocator = await this.documentRootLocatorFactory();
     const labelId = await (await this.host()).getAttribute('aria-labelledby');
     const hostId = await (await this.host()).getAttribute('id');

src/material/datepicker/testing/datepicker-input-harness-base.ts

@@ -7,7 +7,7 @@
  */
 
 import {ComponentHarnessConstructor, HarnessPredicate} from '@angular/cdk/testing';
-import {MatFormFieldControlHarness} from '@angular/material/form-field/testing/control';
+import {MatFormFieldControlHarnessBase} from '@angular/material/form-field/testing/control';
 import {DatepickerInputHarnessFilters} from './datepicker-harness-filters';
 
 /** Sets up the filter predicates for a datepicker input harness. */
@@ -28,7 +28,7 @@ export function getInputPredicate<T extends MatDatepickerInputHarnessBase>(
 }
 
 /** Base class for datepicker input harnesses. */
-export abstract class MatDatepickerInputHarnessBase extends MatFormFieldControlHarness {
+export abstract class MatDatepickerInputHarnessBase extends MatFormFieldControlHarnessBase {
   /** Whether the input is disabled. */
   async isDisabled(): Promise<boolean> {
     return (await this.host()).getProperty<boolean>('disabled');
@@ -39,11 +39,6 @@ export abstract class MatDatepickerInputHarnessBase extends MatFormFieldControlH
     return (await this.host()).getProperty<boolean>('required');
   }
 
-  /** Gets the floating label text for the input, if it exists. */
-  async getLabel(): Promise<string | null> {
-    return await this._getFloatingLabelText();
-  }
-
   /** Gets the value of the input. */
   async getValue(): Promise<string> {
     // The "value" property of the native input is always defined.

src/material/form-field/testing/control/form-field-control-harness.ts

@@ -12,11 +12,16 @@ import {ComponentHarness} from '@angular/cdk/testing';
  * Base class for custom form-field control harnesses. Harnesses for
  * custom controls with form-fields need to implement this interface.
  */
-export abstract class MatFormFieldControlHarness extends ComponentHarness {
+export abstract class MatFormFieldControlHarness extends ComponentHarness {}
+
+/**
+ * Shared functionality for many MatFormFieldControlHarnesses
+ */
+export abstract class MatFormFieldControlHarnessBase extends MatFormFieldControlHarness {
   private readonly floatingLabelSelector = '.mdc-floating-label';
 
   /** Gets the text content of the floating label, if it exists. */
-  protected async _getFloatingLabelText(): Promise<string | null> {
+  public async getLabel(): Promise<string | null> {
     const documentRootLocator = await this.documentRootLocatorFactory();
     const labelId = await (await this.host()).getAttribute('aria-labelledby');
     const hostId = await (await this.host()).getAttribute('id');

src/material/input/testing/input-harness.ts

@@ -7,12 +7,12 @@
  */
 
 import {HarnessPredicate, parallel} from '@angular/cdk/testing';
-import {MatFormFieldControlHarness} from '@angular/material/form-field/testing/control';
+import {MatFormFieldControlHarnessBase} from '@angular/material/form-field/testing/control';
 import {coerceBooleanProperty} from '@angular/cdk/coercion';
 import {InputHarnessFilters} from './input-harness-filters';
 
 /** Harness for interacting with a standard Material inputs in tests. */
-export class MatInputHarness extends MatFormFieldControlHarness {
+export class MatInputHarness extends MatFormFieldControlHarnessBase {
   private readonly _documentRootLocator = this.documentRootLocatorFactory();
 
   // TODO: We do not want to handle `select` elements with `matNativeControl` because
@@ -99,11 +99,6 @@ export class MatInputHarness extends MatFormFieldControlHarness {
     return await (await this.host()).getProperty<string>('id');
   }
 
-  /** Gets the floating label text for the input, if it exists. */
-  async getLabel(): Promise<string | null> {
-    return await this._getFloatingLabelText();
-  }
-
   /**
    * Focuses the input and returns a promise that indicates when the
    * action is complete.

src/material/input/testing/native-select-harness.ts

@@ -7,15 +7,15 @@
  */
 
 import {HarnessPredicate, parallel} from '@angular/cdk/testing';
-import {MatFormFieldControlHarness} from '../../form-field/testing/control';
+import {MatFormFieldControlHarnessBase} from '../../form-field/testing/control';
 import {MatNativeOptionHarness} from './native-option-harness';
 import {
   NativeOptionHarnessFilters,
   NativeSelectHarnessFilters,
 } from './native-select-harness-filters';
 
 /** Harness for interacting with a native `select` in tests. */
-export class MatNativeSelectHarness extends MatFormFieldControlHarness {
+export class MatNativeSelectHarness extends MatFormFieldControlHarnessBase {
   static hostSelector = 'select[matNativeControl]';
 
   /**
@@ -61,11 +61,6 @@ export class MatNativeSelectHarness extends MatFormFieldControlHarness {
     return await (await this.host()).getProperty<string>('id');
   }
 
-  /** Gets the floating label text for the input, if it exists. */
-  async getLabel(): Promise<string | null> {
-    return await this._getFloatingLabelText();
-  }
-
   /** Focuses the select and returns a void promise that indicates when the action is complete. */
   async focus(): Promise<void> {
     return (await this.host()).focus();

src/material/select/testing/select-harness.ts

@@ -13,11 +13,11 @@ import {
   OptionHarnessFilters,
   OptgroupHarnessFilters,
 } from '@angular/material/core/testing';
-import {MatFormFieldControlHarness} from '@angular/material/form-field/testing/control';
+import {MatFormFieldControlHarnessBase} from '@angular/material/form-field/testing/control';
 import {SelectHarnessFilters} from './select-harness-filters';
 
 /** Harness for interacting with a mat-select in tests. */
-export class MatSelectHarness extends MatFormFieldControlHarness {
+export class MatSelectHarness extends MatFormFieldControlHarnessBase {
   static hostSelector = '.mat-mdc-select';
   private _prefix = 'mat-mdc';
   private _optionClass = MatOptionHarness;
@@ -74,11 +74,6 @@ export class MatSelectHarness extends MatFormFieldControlHarness {
     return value.text();
   }
 
-  /** Gets the floating label text for the select, if it exists. */
-  async getLabel(): Promise<string | null> {
-    return await this._getFloatingLabelText();
-  }
-
   /** Focuses the select and returns a void promise that indicates when the action is complete. */
   async focus(): Promise<void> {
     return (await this.host()).focus();