feat: expand TOC on common URL rewrite rules (dotnet#9408)

Co-authored-by: Yufei Huang <[email protected]>

Author: yufeih

templates/modern/src/helper.test.ts

@@ -1,11 +1,24 @@
 // Licensed to the .NET Foundation under one or more agreements.
 // The .NET Foundation licenses this file to you under the MIT license.
 
-import { breakWord } from './helper'
+import { breakWord, isSameURL } from './helper'
 
-test('break-text', () => {
+test('break text', () => {
   expect(breakWord('Other APIs')).toEqual(['Other APIs'])
   expect(breakWord('System.CodeDom')).toEqual(['System.', 'Code', 'Dom'])
   expect(breakWord('System.Collections.Dictionary<string, object>')).toEqual(['System.', 'Collections.', 'Dictionary<', 'string,', ' object>'])
   expect(breakWord('https://github.com/dotnet/docfx')).toEqual(['https://github.', 'com/', 'dotnet/', 'docfx'])
 })
+
+test('is same URL', () => {
+  expect(isSameURL({ pathname: '/' }, { pathname: '/' })).toBeTruthy()
+  expect(isSameURL({ pathname: '/index.html' }, { pathname: '/' })).toBeTruthy()
+  expect(isSameURL({ pathname: '/a/index.html' }, { pathname: '/a' })).toBeTruthy()
+  expect(isSameURL({ pathname: '/a/index.html' }, { pathname: '/a/' })).toBeTruthy()
+  expect(isSameURL({ pathname: '/a' }, { pathname: '/a/' })).toBeTruthy()
+  expect(isSameURL({ pathname: '/a/foo.html' }, { pathname: '/a/foo' })).toBeTruthy()
+  expect(isSameURL({ pathname: '/a/foo/' }, { pathname: '/a/foo' })).toBeTruthy()
+  expect(isSameURL({ pathname: '/a/foo/index.html' }, { pathname: '/a/foo' })).toBeTruthy()
+
+  expect(isSameURL({ pathname: '/a/foo/index.html' }, { pathname: '/a/bar' })).toBeFalsy()
+})

templates/modern/src/helper.ts

@@ -74,3 +74,17 @@ export function breakWordLit(text: string): TemplateResult {
 export function isExternalHref(url: URL): boolean {
   return url.hostname !== window.location.hostname || url.protocol !== window.location.protocol
 }
+
+/**
+ * Determines if two URLs should be considered the same.
+ */
+export function isSameURL(a: { pathname: string }, b: { pathname: string }): boolean {
+  return normalizeUrlPath(a) === normalizeUrlPath(b)
+
+  function normalizeUrlPath(url: { pathname: string }): string {
+    return url.pathname
+      .replace(/\/index\.html$/gi, '/')
+      .replace(/\.html$/gi, '')
+      .replace(/\/$/gi, '')
+  }
+}

templates/modern/src/toc.ts

@@ -3,7 +3,7 @@
 
 import { TemplateResult, html, render } from 'lit-html'
 import { classMap } from 'lit-html/directives/class-map.js'
-import { breakWordLit, meta, isExternalHref, loc } from './helper'
+import { breakWordLit, meta, isExternalHref, loc, isSameURL } from './helper'
 
 export type TocNode = {
   name: string
@@ -66,7 +66,7 @@ export async function renderToc(): Promise<TocNode[]> {
     if (node.href) {
       const url = new URL(node.href, tocUrl)
       node.href = url.href
-      active = isExternalHref(url) ? false : normalizeUrlPath(url) === normalizeUrlPath(window.location)
+      active = isExternalHref(url) ? false : isSameURL(url, window.location)
       if (active) {
         if (node.items) {
           node.expanded = true
@@ -156,10 +156,6 @@ export async function renderToc(): Promise<TocNode[]> {
   function renderDownloadPdf(): TemplateResult {
     return pdf ? html`<div class="py-2 mb-md-4"><a class="pdf-link" href="${new URL(pdfFileName || 'toc.pdf', tocUrl)}">${loc('downloadPdf')}</a></div>` : null
   }
-
-  function normalizeUrlPath(url: { pathname: string }): string {
-    return url.pathname.replace(/\/index\.html$/gi, '/')
-  }
 }
 
 function renderNextArticle(items: TocNode[], node: TocNode) {