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:
parent
007282d2bb
commit
d4003452c7
|
@ -305,6 +305,10 @@ describe('TocService', () => {
|
|||
<a class="header-link" href="tutorial/toh-pt1#setup-to-develop-locally" aria-hidden="true">
|
||||
<span class="icon">icon-link</span>
|
||||
</a>
|
||||
<div class="github-links">
|
||||
<a>GitHub</a>
|
||||
<a>links</a>
|
||||
</div>
|
||||
</h2>
|
||||
`, docId);
|
||||
|
||||
|
@ -319,7 +323,7 @@ describe('TocService', () => {
|
|||
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)
|
||||
.changingThisBreaksApplicationSecurity)
|
||||
.toEqual('Setup to develop <i>locally</i>.');
|
||||
|
|
|
@ -57,15 +57,15 @@ export class TocService {
|
|||
}
|
||||
|
||||
// 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)
|
||||
// - Mark the HTML as trusted to be used with `[innerHTML]`.
|
||||
private extractHeadingSafeHtml(heading: HTMLHeadingElement) {
|
||||
const div: HTMLDivElement = this.document.createElement('div');
|
||||
div.innerHTML = heading.innerHTML;
|
||||
|
||||
// Remove any `.header-link` elements (along with their content).
|
||||
div.querySelectorAll('.header-link').forEach(removeNode);
|
||||
// Remove any `.github-links` or `.header-link` elements (along with their content).
|
||||
div.querySelectorAll('.github-links, .header-link').forEach(removeNode);
|
||||
|
||||
// Remove any remaining `a` elements (but keep their content).
|
||||
div.querySelectorAll('a').forEach(anchorLink => {
|
||||
|
|
Loading…
Reference in New Issue