Skip to content

Add a page search to the top of the left menu#1029

Closed
MDA2AV wants to merge 1 commit into
mainfrom
nav-page-search
Closed

Add a page search to the top of the left menu#1029
MDA2AV wants to merge 1 commit into
mainfrom
nav-page-search

Conversation

@MDA2AV

@MDA2AV MDA2AV commented Jul 24, 2026

Copy link
Copy Markdown
Owner

Closes #970.

The Hextra theme's search went away with Hugo, and with it the only way to find a test specification by name. The board's existing search box filters framework rows, so a query like prior-knowledge or MTU matched nothing anywhere on the site — and 124 Knowledge Base pages were reachable only by walking the tree.

What it searches

  • The Knowledge Base — page titles and full body text, so MTU finds the setup page and prior-knowledge finds the H/2 validation docs.
  • Every leaderboard destination — 28 profile views and the 6 composite scopes. h2c reaches both the JSON (h2c) board and its implementation page.

Results are ranked (title hit > body hit, exact title match wins outright, views float slightly above docs since they're the cheaper landing). Multi-word queries are AND. Each docs hit carries a breadcrumb and a snippet with the match highlighted. Capped at 25.

No dependency, no index file

docs.js already ships every page's rendered HTML, so the index is built from what's already in memory — 158 entries over 0.24 MB of text in ~5 ms, on the first keystroke rather than at load. Tags are stripped with a regex rather than by assigning to a detached innerHTML, which would fetch any <img> the docs grow later.

Two structural details

  • buildNav() now clears #navTree, not #nav. The search box is static markup above it, so it survives the nav rebuild that every navigation triggers — otherwise typing would lose focus the moment results changed.
  • On mobile, the tree is still hidden in favour of the existing <select>, but .nav is no longer display:none, so the search bar stays reachable.

Keyboard: arrows move the selection, Enter opens, Escape clears. Opening a result clears the query first, so you land on a normal menu showing where you now are. Colours come from the existing theme variables — light and dark both work.

Verified end-to-end in headless Chrome against the real data files

check result
tree builds into its new container 3 sections ✓
fortunes → hits, tree hidden, first selected 6 hits ✓
ArrowDown moves selection
click docs hit → page renders "Fortunes (Templates)" ✓
URL stays deep-linkable #doc=test-profiles/h1/isolated/fortunes
input clears, tree returns
nonsense query → empty state
Escape restores
1400px and 400px layouts ✓ (mobile keeps search, hides tree)

Possible follow-up, deliberately left out to keep this scoped: a / or Ctrl-K shortcut to focus the box.

🤖 Generated with Claude Code

Closes #970. The Hextra theme's search went away with Hugo, and with it the
only way to find a test specification by name: the board's existing search
box filters framework rows, so a query like "prior-knowledge" or "MTU"
matched nothing anywhere on the site. 124 Knowledge Base pages were
reachable only by walking the tree.

Search covers the Knowledge Base by title AND full body text, plus every
leaderboard destination (28 profile views and the 6 composite scopes), so
"h2c" reaches both the JSON (h2c) board and its implementation page.

Results are ranked: a title hit outranks a body hit, an exact title match
wins outright, and views float slightly above docs since they are the
cheaper landing. Multi-word queries are AND (every term must appear
somewhere), each doc hit carries a breadcrumb and a snippet with the match
highlighted, and the list caps at 25.

No dependency and no index file. docs.js already ships every page's
rendered HTML, so the index is built from what is already in memory, on
the first keystroke rather than at load -- 158 entries over 0.24 MB of
text in ~5 ms. Tags are stripped with a regex rather than by assigning to
a detached innerHTML, because that would fetch any <img> the docs grow
later.

Two structural details:

buildNav() now clears #navTree instead of #nav. The search box is static
markup above it, so it survives the nav rebuild that every navigation
triggers -- otherwise typing would lose focus as soon as results changed.

On mobile the tree is still hidden in favour of the existing select, but
.nav is no longer display:none, so the search bar itself stays reachable.

Keyboard: arrows move the selection, Enter opens, Escape clears. Opening a
result clears the query first, so the user lands on a normal menu showing
where they now are. Colours come from the existing theme variables, so
light and dark both work.

Verified end-to-end in headless Chrome against the real data files: the
tree builds into its new container, typing "fortunes" yields 6 hits with
the tree hidden and the first hit selected, ArrowDown moves the selection,
clicking a docs hit renders the page and rewrites the URL to
#doc=test-profiles/h1/isolated/fortunes (so results stay deep-linkable),
the input clears and the tree comes back, a nonsense query shows the empty
state, and Escape restores everything. Checked at 1400px and 400px.
@MDA2AV

MDA2AV commented Jul 24, 2026

Copy link
Copy Markdown
Owner Author

Closing as a duplicate — this is already in main via #1024 (squash-merged as cfbd513d). Same cause as #1028: I re-created it from the branch after the API outage cleared, without seeing that you'd already merged it.

@MDA2AV MDA2AV closed this Jul 24, 2026
@MDA2AV
MDA2AV deleted the nav-page-search branch July 24, 2026 21:55
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Re-add search functionality for pages

1 participant