fix(cdk/testing): protractor element not extracting hidden text

We use Protractor's `getText` method to extract text, but the problem is that it's likely based
on `HTMLElement.innerText` which excludes text from hidden elements.

These changes switch to using `textContent` to bring the behavior in-line with the `UnitTestElement`.

Author: crisbeto

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

@@ -139,7 +139,8 @@ export class ProtractorElement implements TestElement {
     if (options?.exclude) {
       return browser.executeScript(_getTextWithExcludedElements, this.element, options.exclude);
     }
-    return this.element.getText();
+    // We don't go through Protractor's `getText`, because it excludes text from hidden elements.
+    return browser.executeScript(`return (arguments[0].textContent || '')`, this.element);
   }
 
   async getAttribute(name: string): Promise<string|null> {

src/cdk/testing/tests/cross-environment.spec.ts

@@ -597,6 +597,12 @@ export function crossEnvironmentSpecs(
       await button.blur();
       expect(await button.isFocused()).toBe(false);
     });
+
+    it('should be able to get the text of a hidden element', async () => {
+      const hiddenElement = await harness.hidden();
+      expect(await hiddenElement.text()).toBe('Hello');
+    });
+
   });
 }
 

src/cdk/testing/tests/harnesses/main-component-harness.ts

@@ -95,6 +95,7 @@ export class MainComponentHarness extends ComponentHarness {
   readonly hoverTest = this.locatorFor('#hover-box');
   readonly customEventBasic = this.locatorFor('#custom-event-basic');
   readonly customEventObject = this.locatorFor('#custom-event-object');
+  readonly hidden = this.locatorFor('.hidden-element');
 
   private _testTools = this.locatorFor(SubComponentHarness);
 

src/cdk/testing/tests/test-main-component.html

@@ -69,3 +69,4 @@ <h1 style="height: 100px; width: 200px;">Main Component</h1>
   (mouseenter)="isHovering = true"
   (mouseleave)="isHovering = false"
   style="width: 50px; height: 50px; background: hotpink;"></div>
+<div class="hidden-element" style="display: none;">Hello</div>