Ignore query/fragment in ShouldMatch of NavLink by default but allow overriding ShouldMatch

src/Components/Web/src/PublicAPI.Unshipped.txt

@@ -1 +1,2 @@
 #nullable enable
+virtual Microsoft.AspNetCore.Components.Routing.NavLink.ShouldMatch(string! currentUriAbsolute) -> bool

src/Components/Web/src/Routing/NavLink.cs

@@ -106,7 +106,12 @@ private void OnLocationChanged(object? sender, LocationChangedEventArgs args)
         }
     }
 
-    private bool ShouldMatch(string currentUriAbsolute)
+    /// <summary>
+    /// Determines whether the current URI should match the link.
+    /// </summary>
+    /// <param name="currentUriAbsolute">The absolute URI of the current location.</param>
+    /// <returns>True if the link should be highlighted as active; otherwise, false.</returns>
+    protected virtual bool ShouldMatch(string currentUriAbsolute)
     {
         if (_hrefAbsolute == null)
         {
@@ -199,7 +204,7 @@ private static bool IsStrictlyPrefixWithSeparator(string value, string prefix)
 
     private static bool IsUnreservedCharacter(char c)
     {
-        // Checks whether it is an unreserved character according to 
+        // Checks whether it is an unreserved character according to
         // https://datatracker.ietf.org/doc/html/rfc3986#section-2.3
         // Those are characters that are allowed in a URI but do not have a reserved
         // purpose (e.g. they do not separate the components of the URI)

src/Components/test/E2ETest/Tests/RoutingTest.cs

@@ -383,6 +383,34 @@ public void CanFollowLinkDefinedInOpenShadowRoot()
         AssertHighlightedLinks("Other", "Other with base-relative URL (matches all)");
     }
 
+    [Fact]
+    public void CanOverrideNavLinkToIgnoreFragment()
+    {
+        SetUrlViaPushState("/layout-overridden/for-hash");
+
+        var app = Browser.MountTestComponent<TestRouter>();
+        app.FindElement(By.LinkText("Override layout with hash, no trailing slash")).Click();
+        Browser.Equal("This is the page with overridden layout.", () => app.FindElement(By.Id("test-info")).Text);
+        AssertHighlightedLinks(
+            "Override layout (matches all)",
+            "Override layout, no trailing slash (matches all)",
+            "Override layout with hash, no trailing slash");
+    }
+
+    [Fact]
+    public void CanOverrideNavLinkToIgnoreQuery()
+    {
+        SetUrlViaPushState("/layout-overridden");
+
+        var app = Browser.MountTestComponent<TestRouter>();
+        app.FindElement(By.LinkText("Override layout with query, no trailing slash")).Click();
+        Browser.Equal("This is the page with overridden layout.", () => app.FindElement(By.Id("test-info")).Text);
+        AssertHighlightedLinks(
+            "Override layout (matches all)",
+            "Override layout, no trailing slash (matches all)",
+            "Override layout with query, no trailing slash");
+    }
+
     [Fact]
     public void CanGoBackFromNotAComponent()
     {

src/Components/test/testassets/BasicTestApp/RouterTest/LayoutOverridden.razor

@@ -0,0 +1,4 @@
+@page "/layout-overridden"
+@page "/layout-overridden/for-hash"
+@layout RouterTestLayoutNavLinksOverridden
+<div id="test-info">This is the page with overridden layout.</div>

src/Components/test/testassets/BasicTestApp/RouterTest/LinksOverridden.razor

@@ -0,0 +1,18 @@
+@using Microsoft.AspNetCore.Components.Routing
+<style type="text/css">
+    a.active {
+        background-color: yellow;
+        font-weight: bold;
+    }
+</style>
+<ul>
+    <li><NavLinkIgnoreQueryAndFragmentString href="/subdir/layout-overridden/" Match=NavLinkMatch.All>Override layout (matches all)</NavLinkIgnoreQueryAndFragmentString></li>
+    <li><NavLinkIgnoreQueryAndFragmentString href="/subdir/layout-overridden" Match=NavLinkMatch.All>Override layout, no trailing slash (matches all)</NavLinkIgnoreQueryAndFragmentString></li>
+    <li><NavLinkIgnoreQueryAndFragmentString href="/subdir/layout-overridden/?abc=123">Override layout with query</NavLinkIgnoreQueryAndFragmentString></li>
+    <li><NavLinkIgnoreQueryAndFragmentString href="/subdir/layout-overridden?abc=123">Override layout with query, no trailing slash</NavLinkIgnoreQueryAndFragmentString></li>
+    <li><NavLinkIgnoreQueryAndFragmentString href="/subdir/layout-overridden/#blah">Override layout with hash</NavLinkIgnoreQueryAndFragmentString></li>
+    <li><NavLinkIgnoreQueryAndFragmentString href="/subdir/layout-overridden#blah">Override layout with hash, no trailing slash</NavLinkIgnoreQueryAndFragmentString></li>
+    <li><NavLinkIgnoreQueryAndFragmentString href="/subdir/layout-overridden/Default.html">Override layout with extension</NavLinkIgnoreQueryAndFragmentString></li>
+    <li><NavLinkIgnoreQueryAndFragmentString href="/subdir/layout-overridden/Other">Override Other</NavLinkIgnoreQueryAndFragmentString></li>
+    <li><NavLinkIgnoreQueryAndFragmentString href="/subdir/Other" Match=NavLinkMatch.All>Override Other with base-relative URL (matches all)</NavLinkIgnoreQueryAndFragmentString></li>
+</ul>

src/Components/test/testassets/BasicTestApp/RouterTest/NavLinkIgnoreQueryAndFragmentString.razor

@@ -0,0 +1,27 @@
+@using Microsoft.AspNetCore.Components.Routing;
+@inherits NavLink
+
+@{
+    base.BuildRenderTree(__builder);
+}
+
+@code{
+
+    protected override bool ShouldMatch(string currentUriAbsolute)
+    {
+        if (base.ShouldMatch(currentUriAbsolute))
+        {
+            return true;
+        }
+
+        var originalMatch = base.Match;
+        base.Match = NavLinkMatch.All;
+        string uriWithoutQueryAndFragment = GetUriIgnoreQueryAndFragment(currentUriAbsolute);
+        var shouldMatch = base.ShouldMatch(uriWithoutQueryAndFragment);
+        base.Match = originalMatch;
+        return shouldMatch;
+    }
+
+    private string GetUriIgnoreQueryAndFragment(string uri) =>
+        new Uri(uri).GetLeftPart(UriPartial.Path);
+}

src/Components/test/testassets/BasicTestApp/RouterTestLayoutNavLinksOverridden.razor

@@ -0,0 +1,6 @@
+@using Microsoft.AspNetCore.Components
+@inherits LayoutComponentBase
+
+@Body
+
+<BasicTestApp.RouterTest.LinksOverridden />