fix(aio): switch from innerText to textContent to support older browsers

`innerText` is not supported in Firefox prior to v45. In most cases (at least
the ones we are interested in), `innerText` and `textContent` work equally well,
but `textContent` is more performant (as it doesn't require a reflow).

From [MDN][1] on the differences of `innerText` vs `textContent`:

> - [...]
> - `innerText` is aware of style and will not return the text of hidden
>   elements, whereas `textContent` will.
> - As `innerText` is aware of CSS styling, it will trigger a reflow, whereas
>   `textContent` will not.
> - [...]

[1]: https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent#Differences_from_innerText

Fixes #17585
This commit is contained in:
Georgios Kalpakas
2017-06-19 10:32:36 -07:00
committed by Hans
parent 3093c55e9e
commit 4f37f86433
13 changed files with 32 additions and 29 deletions
@@ -116,7 +116,7 @@ describe('CodeComponent', () => {
hostComponent.linenums = false;
hostComponent.code = ' abc\n let x = text.split(\'\\n\');\n ghi\n\n jkl\n';
fixture.detectChanges();
const codeContent = codeComponentDe.nativeElement.querySelector('code').innerText;
const codeContent = codeComponentDe.nativeElement.querySelector('code').textContent;
expect(codeContent).toEqual('abc\n let x = text.split(\'\\n\');\nghi\n\njkl');
});
@@ -124,7 +124,7 @@ describe('CodeComponent', () => {
hostComponent.linenums = false;
hostComponent.code = '\n\n\n' + smallMultiLineCode + '\n\n\n';
fixture.detectChanges();
const codeContent = codeComponentDe.nativeElement.querySelector('code').innerText;
const codeContent = codeComponentDe.nativeElement.querySelector('code').textContent;
expect(codeContent).toEqual(codeContent.trim());
});
@@ -141,7 +141,7 @@ describe('CodeComponent', () => {
function getErrorMessage() {
const missing: HTMLElement = codeComponentDe.nativeElement.querySelector('.code-missing');
return missing ? missing.innerText : null;
return missing ? missing.textContent : null;
}
it('should not display "code-missing" class when there is some code', () => {