iSharkFly-Docs
/
angular-docs-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(docs-infra): do not include GitHub links in Table of Content (#32418) 

The docs template for cli commands ([cli-command.template.html][1])
includes an `h2` element with GitHub links for [long description][2].
Since the content of `h2` elements is replicated in the auto-generated
Table of Contents, the GitHub links were replicated as well (which is
undesirable).

This commit fixes it by explicitly excluding `.github-links` elements,
when extracting the content for the ToC (in
[TocService#extractHeadingSafeHtml()][3]). This is similar to what we do
for the auto-generated `.header-link` anchors.

[1]: https://github.com/angular/angular/blob/1537791f0/aio/tools/transforms/templates/cli/cli-command.template.html
[2]: https://github.com/angular/angular/blob/1537791f0/aio/tools/transforms/templates/cli/cli-command.template.html#L18
[3]: https://github.com/angular/angular/blob/1537791f0/aio/src/app/shared/toc.service.ts#L56

PR Close #32418
This commit is contained in:
George Kalpakas 2019-08-30 22:18:26 +03:00 committed by Matias Niemelä
parent 007282d2bb
commit d4003452c7
2 changed files with 8 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
aio/src/app/shared/toc.service.spec.ts
View File

@ -305,6 +305,10 @@ describe('TocService', () => {
<a class="header-link" href="tutorial/toh-pt1#setup-to-develop-locally" aria-hidden="true"> <a class="header-link" href="tutorial/toh-pt1#setup-to-develop-locally" aria-hidden="true">
<span class="icon">icon-link</span> <span class="icon">icon-link</span>
</a> </a>
<div class="github-links">
<a>GitHub</a>
<a>links</a>
</div>
</h2> </h2>
`, docId); `, docId);
@ -319,7 +323,7 @@ describe('TocService', () => {
expect(tocItem.title).toEqual('Setup to develop locally.'); expect(tocItem.title).toEqual('Setup to develop locally.');
}); });
it('should have removed anchor link from tocItem html content', () => { it('should have removed anchor link and GitHub links from tocItem html content', () => {
expect((tocItem.content as TestSafeHtml) expect((tocItem.content as TestSafeHtml)
.changingThisBreaksApplicationSecurity) .changingThisBreaksApplicationSecurity)
.toEqual('Setup to develop <i>locally</i>.'); .toEqual('Setup to develop <i>locally</i>.');

6
aio/src/app/shared/toc.service.ts
View File

@ -57,15 +57,15 @@ export class TocService {
} }
// Transform the HTML content to be safe to use in the ToC: // Transform the HTML content to be safe to use in the ToC:
// - Strip off the auto-generated heading anchor links). // - Strip off certain auto-generated elements (such as GitHub links and heading anchor links).
// - Strip off any anchor links (but keep their content) // - Strip off any anchor links (but keep their content)
// - Mark the HTML as trusted to be used with `[innerHTML]`. // - Mark the HTML as trusted to be used with `[innerHTML]`.
private extractHeadingSafeHtml(heading: HTMLHeadingElement) { private extractHeadingSafeHtml(heading: HTMLHeadingElement) {
const div: HTMLDivElement = this.document.createElement('div'); const div: HTMLDivElement = this.document.createElement('div');
div.innerHTML = heading.innerHTML; div.innerHTML = heading.innerHTML;
// Remove any `.header-link` elements (along with their content). // Remove any `.github-links` or `.header-link` elements (along with their content).
div.querySelectorAll('.header-link').forEach(removeNode); div.querySelectorAll('.github-links, .header-link').forEach(removeNode);
// Remove any remaining `a` elements (but keep their content). // Remove any remaining `a` elements (but keep their content).
div.querySelectorAll('a').forEach(anchorLink => { div.querySelectorAll('a').forEach(anchorLink => {