fix(aio): do not include hidden content in window title
The window title is derived based on the current document's `<h1>` heading. Such headings may contain hidden/non-visible content (e.g. textual name of font ligatures: `<i class="material-icons">link</i>`) that should not be included in the title. This commit fixes this by using `innerText` (instead of `textContent`) to extract the visible text from the `<h1>` heading. It will still fall back to `textContent` on browsers that do not support `innerText` (e.g. Firefox 44). Fixes #17732
This commit is contained in:
parent
40921bb927
commit
b052ef5f1e
|
@ -342,6 +342,28 @@ describe('DocViewerComponent', () => {
|
|||
fixture.detectChanges();
|
||||
expect(titleService.setTitle).toHaveBeenCalledWith('Angular - Features');
|
||||
});
|
||||
|
||||
it('should not include hidden content of the <h1> in the title', () => {
|
||||
setCurrentDoc('<h1><i style="visibility: hidden">link</i>Features</h1>Some content');
|
||||
fixture.detectChanges();
|
||||
expect(titleService.setTitle).toHaveBeenCalledWith('Angular - Features');
|
||||
});
|
||||
|
||||
it('should fall back to `textContent` if `innerText` is not available', () => {
|
||||
const querySelector_ = docViewerEl.querySelector;
|
||||
spyOn(docViewerEl, 'querySelector').and.callFake((selector: string) => {
|
||||
const elem = querySelector_.call(docViewerEl, selector);
|
||||
Object.defineProperties(elem, {
|
||||
innerText: { value: undefined },
|
||||
textContent: { value: 'Text Content' }
|
||||
});
|
||||
return elem;
|
||||
});
|
||||
|
||||
setCurrentDoc('<h1><i style="visibility: hidden">link</i>Features</h1>Some content');
|
||||
fixture.detectChanges();
|
||||
expect(titleService.setTitle).toHaveBeenCalledWith('Angular - Text Content');
|
||||
});
|
||||
});
|
||||
|
||||
describe('TOC', () => {
|
||||
|
|
|
@ -97,7 +97,7 @@ export class DocViewerComponent implements DoCheck, OnDestroy {
|
|||
// Only create TOC for docs with an <h1> title
|
||||
// If you don't want a TOC, add "no-toc" class to <h1>
|
||||
if (titleEl) {
|
||||
title = titleEl.textContent.trim();
|
||||
title = (titleEl.innerText || titleEl.textContent).trim();
|
||||
if (!/(no-toc|notoc)/i.test(titleEl.className)) {
|
||||
this.tocService.genToc(this.hostElement, docId);
|
||||
titleEl.insertAdjacentHTML('afterend', '<aio-toc class="embedded"></aio-toc>');
|
||||
|
|
Loading…
Reference in New Issue