[Bug] Modern template always sets the first navbar element as active about docfx

[filzrev]

Reported issue seems to be caused by following functions.

• findActiveItem
• commonUrlPrefix

docfx/templates/modern/src/nav.ts

Lines 136 to 161 in 81790ce

	function findActiveItem(items: (NavItem | NavItemContainer)[]): NavItem {
	const url = new URL(window.location.href)
	let activeItem: NavItem
	let maxPrefix = 0
	for (const item of items.map(i => 'items' in i ? i.items : i).flat()) {
	if (isExternalHref(item.href)) {
	continue
	}
	const prefix = commonUrlPrefix(url, item.href)
	if (prefix > maxPrefix) {
	maxPrefix = prefix
	activeItem = item
	}
	}
	return activeItem
	}
	function commonUrlPrefix(url: URL, base: URL): number {
	const urlSegments = url.pathname.split('/')
	const baseSegments = base.pathname.split('/')
	let i = 0
	while (i < urlSegments.length && i < baseSegments.length && urlSegments[i] === baseSegments[i]) {
	i++
	}
	return i
	}

pathname.split('/') generate string array with heading element is empty string.
So currently commonUrlPrefix always return value >=1.
And first element is selected as active item.

To resolve this issue. It need to exclude empty string from comparison.
And It might need following additional logics.

• Support root (/) navigation item.
• Support default active item to maintain compatibility with current behavior.
  (e.g. https://dotnet.github.io/docfx display Docs as active item when opening /index.html)