feat(cdk/testing): add isFocused method to TestElement (#18183)

Author: mmalerba

src/cdk/testing/protractor/protractor-element.ts

@@ -146,4 +146,8 @@ export class ProtractorElement implements TestElement {
                   Element.prototype.msMatchesSelector).call(arguments[0], arguments[1])
           `, this.element, selector);
   }
+
+  async isFocused(): Promise<boolean> {
+    return this.element.equals(browser.driver.switchTo().activeElement());
+  }
 }

src/cdk/testing/test-element.ts

@@ -111,4 +111,7 @@ export interface TestElement {
 
   /** Checks whether this element matches the given selector. */
   matchesSelector(selector: string): Promise<boolean>;
+
+  /** Checks whether the element is focused. */
+  isFocused(): Promise<boolean>;
 }

src/cdk/testing/testbed/unit-test-element.ts

@@ -142,4 +142,9 @@ export class UnitTestElement implements TestElement {
     return (elementPrototype['matches'] || elementPrototype['msMatchesSelector'])
         .call(this.element, selector);
   }
+
+  async isFocused(): Promise<boolean> {
+    await this._stabilize();
+    return document.activeElement === this.element;
+  }
 }

src/cdk/testing/tests/BUILD.bazel

@@ -39,6 +39,7 @@ ng_test_library(
         "//src/cdk/testing",
         "//src/cdk/testing/private",
         "//src/cdk/testing/testbed",
+        "@npm//@angular/platform-browser",
     ],
 )
 

src/cdk/testing/tests/protractor.e2e.spec.ts

@@ -398,6 +398,14 @@ describe('ProtractorHarnessEnvironment', () => {
           '\n(SubComponentHarness with host element matching selector: "test-sub" satisfying' +
           ' the constraints: title = /not found/)');
     });
+
+    it('should check if element is focused', async () => {
+      const button = await harness.button();
+      await button.focus();
+      expect(await button.isFocused()).toBe(true);
+      await button.blur();
+      expect(await button.isFocused()).toBe(false);
+    });
   });
 
   describe('HarnessPredicate', () => {

src/cdk/testing/tests/testbed.spec.ts

@@ -441,6 +441,14 @@ describe('TestbedHarnessEnvironment', () => {
           '\n(SubComponentHarness with host element matching selector: "test-sub" satisfying' +
           ' the constraints: title = /not found/)');
     });
+
+    it('should check if element is focused', async () => {
+      const button = await harness.button();
+      await button.focus();
+      expect(await button.isFocused()).toBe(true);
+      await button.blur();
+      expect(await button.isFocused()).toBe(false);
+    });
   });
 
   describe('HarnessPredicate', () => {

tools/public_api_guard/cdk/testing.d.ts

@@ -115,6 +115,7 @@ export interface TestElement {
     getProperty(name: string): Promise<any>;
     hasClass(name: string): Promise<boolean>;
     hover(): Promise<void>;
+    isFocused(): Promise<boolean>;
     matchesSelector(selector: string): Promise<boolean>;
     sendKeys(...keys: (string | TestKey)[]): Promise<void>;
     sendKeys(modifiers: ModifierKeys, ...keys: (string | TestKey)[]): Promise<void>;

tools/public_api_guard/cdk/testing/protractor.d.ts

@@ -11,6 +11,7 @@ export declare class ProtractorElement implements TestElement {
     getProperty(name: string): Promise<any>;
     hasClass(name: string): Promise<boolean>;
     hover(): Promise<void>;
+    isFocused(): Promise<boolean>;
     matchesSelector(selector: string): Promise<boolean>;
     sendKeys(...keys: (string | TestKey)[]): Promise<void>;
     sendKeys(modifiers: ModifierKeys, ...keys: (string | TestKey)[]): Promise<void>;

tools/public_api_guard/cdk/testing/testbed.d.ts

@@ -24,6 +24,7 @@ export declare class UnitTestElement implements TestElement {
     getProperty(name: string): Promise<any>;
     hasClass(name: string): Promise<boolean>;
     hover(): Promise<void>;
+    isFocused(): Promise<boolean>;
     matchesSelector(selector: string): Promise<boolean>;
     sendKeys(...keys: (string | TestKey)[]): Promise<void>;
     sendKeys(modifiers: ModifierKeys, ...keys: (string | TestKey)[]): Promise<void>;