fix: active links consider query params and respect existing aria-current (#3474)

- matchesUrl() now accepts an optional currentSearch parameter; when a
  link's href contains query params that don't match the current page,
  it returns Ancestor instead of Current
- setActiveUrl() skips links that already have a user-set aria-current
  attribute, allowing frameworks like daisyUI to manage tabs
- Client-side updateLinks() also respects user-set aria-current

Closes #3474

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: bartlomieju

packages/fresh/src/runtime/client/partials.ts

@@ -304,7 +304,15 @@ document.addEventListener("submit", async (e) => {
 
 function updateLinks(url: URL) {
   document.querySelectorAll("a").forEach((link) => {
-    const match = matchesUrl(url.pathname, link.href);
+    // Don't override aria-current if it was explicitly set by the user
+    // (detected by absence of data-current/data-ancestor attributes which
+    // Fresh always sets alongside aria-current)
+    const hasFreshAria = link.hasAttribute(DATA_CURRENT) ||
+      link.hasAttribute(DATA_ANCESTOR);
+    const hasUserAria = !hasFreshAria && link.hasAttribute("aria-current");
+    if (hasUserAria) return;
+
+    const match = matchesUrl(url.pathname, link.href, url.search);
 
     if (match === UrlMatchKind.Current) {
       link.setAttribute(DATA_CURRENT, "true");

packages/fresh/src/runtime/server/preact_hooks.ts

@@ -132,7 +132,7 @@ options[OptionsType.VNODE] = (vnode) => {
   if (RENDER_STATE !== null) {
     RENDER_STATE.owners.set(vnode, RENDER_STATE!.ownerStack.at(-1)!);
     if (vnode.type === "a") {
-      setActiveUrl(vnode, RENDER_STATE.ctx.url.pathname);
+      setActiveUrl(vnode, RENDER_STATE.ctx.url.pathname, RENDER_STATE.ctx.url.search);
     }
   }
   assetHashingHook(vnode, BUILD_ID);

packages/fresh/src/runtime/shared_internal.ts

@@ -42,8 +42,15 @@ export const enum UrlMatchKind {
   Current,
 }
 
-export function matchesUrl(current: string, needle: string): UrlMatchKind {
-  let href = new URL(needle, "http://localhost").pathname;
+export function matchesUrl(
+  current: string,
+  needle: string,
+  currentSearch?: string,
+): UrlMatchKind {
+  const needleUrl = new URL(needle, "http://localhost");
+  let href = needleUrl.pathname;
+  const needleSearch = needleUrl.search;
+
   if (href !== "/" && href.endsWith("/")) {
     href = href.slice(0, -1);
   }
@@ -53,6 +60,10 @@ export function matchesUrl(current: string, needle: string): UrlMatchKind {
   }
 
   if (current === href) {
+    // If the link has query params, only mark as current if they match
+    if (needleSearch && currentSearch !== undefined && needleSearch !== currentSearch) {
+      return UrlMatchKind.Ancestor;
+    }
     return UrlMatchKind.Current;
   } else if (current.startsWith(href + "/") || href === "/") {
     return UrlMatchKind.Ancestor;
@@ -65,11 +76,18 @@ export function matchesUrl(current: string, needle: string): UrlMatchKind {
  * Mark active or ancestor link
  * Note: This function is used both on the server and the client
  */
-export function setActiveUrl(vnode: VNode, pathname: string): void {
+export function setActiveUrl(
+  vnode: VNode,
+  pathname: string,
+  search?: string,
+): void {
   const props = vnode.props as Record<string, unknown>;
   const hrefProp = props.href;
   if (typeof hrefProp === "string" && hrefProp.startsWith("/")) {
-    const match = matchesUrl(pathname, hrefProp);
+    // Don't override aria-current if it's already set by the user
+    if (props["aria-current"] !== undefined) return;
+
+    const match = matchesUrl(pathname, hrefProp, search);
     if (match === UrlMatchKind.Current) {
       props[DATA_CURRENT] = "true";
       props["aria-current"] = "page";