fix: detect router-link attribute in ancestor elements during click navigation (#23786) (#23800) (#23804)

When a nested element (e.g., Button) inside a RouterLink is clicked,
the navigation trigger was incorrectly reported as CLIENT_SIDE because
only the direct click target was checked for the router-link attribute.
Traverse the composed path instead so any ancestor with router-link
is correctly identified as a ROUTER_LINK trigger.

Co-authored-by: caalador <mikael.grankvist@vaadin.com>
Co-authored-by: Artur Signell <artur@vaadin.com>

Author: 3 people

flow-client/src/main/frontend/Flow.ts

@@ -175,13 +175,9 @@ export class Flow {
       'click',
       (_e) => {
         if (_e.target) {
-          // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-          // @ts-ignore
-          if (_e.target.hasAttribute('router-link')) {
+          if (_e.composedPath().some((node) => node instanceof HTMLElement && node.hasAttribute('router-link'))) {
             this.navigation = 'link';
-            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-            // @ts-ignore
-          } else if (_e.composedPath().some((node) => node.nodeName === 'A')) {
+          } else if (_e.composedPath().some((node) => (node as Element).nodeName === 'A')) {
             this.navigation = 'client';
           }
         }

flow-tests/test-root-context/src/main/java/com/vaadin/flow/uitest/ui/NavigationTriggerView.java

@@ -39,6 +39,14 @@ public NavigationTriggerView() {
                 .createRouterLink(CLASS_NAME + "/routerlink/", "Router link");
         routerLink.setAttribute("id", "routerlink");
 
+        Element routerLinkWithButton = ElementFactory
+                .createRouterLink(CLASS_NAME + "/routerlink-button/", null);
+        routerLinkWithButton.setAttribute("id", "routerlink-with-button");
+        Element nestedButton = ElementFactory
+                .createButton("Router link button");
+        nestedButton.setAttribute("id", "routerlink-button");
+        routerLinkWithButton.appendChild(nestedButton);
+
         Element navigateButton = ElementFactory.createButton("UI.navigate");
         navigateButton.addEventListener("click",
                 e -> getUI().get().navigate(CLASS_NAME + "/navigate"));
@@ -54,8 +62,8 @@ public NavigationTriggerView() {
                 .navigate(NavigationTriggerView.class, "reroute"));
         rerouteButton.setAttribute("id", "rerouteButton");
 
-        getElement().appendChild(routerLink, navigateButton, forwardButton,
-                rerouteButton);
+        getElement().appendChild(routerLink, routerLinkWithButton,
+                navigateButton, forwardButton, rerouteButton);
     }
 
     public static String buildMessage(String path, NavigationTrigger trigger,

flow-tests/test-root-context/src/test/java/com/vaadin/flow/uitest/ui/NavigationTriggerIT.java

@@ -45,27 +45,32 @@ public void testNavigationTriggers() {
         assertLastMessage("/routerlink", NavigationTrigger.ROUTER_LINK,
                 "routerlink");
 
-        findElement(By.id("navigate")).click();
+        findElement(By.id("routerlink-button")).click();
         assertMessageCount(3);
+        assertLastMessage("/routerlink-button", NavigationTrigger.ROUTER_LINK,
+                "routerlink-button");
+
+        findElement(By.id("navigate")).click();
+        assertMessageCount(4);
         assertLastMessage("/navigate", NavigationTrigger.UI_NAVIGATE,
                 "navigate");
 
         getDriver().navigate().back();
-        assertMessageCount(4);
-        assertLastMessage("/routerlink", NavigationTrigger.HISTORY,
-                "routerlink");
+        assertMessageCount(5);
+        assertLastMessage("/routerlink-button", NavigationTrigger.HISTORY,
+                "routerlink-button");
 
         getDriver().navigate().forward();
-        assertMessageCount(5);
+        assertMessageCount(6);
         assertLastMessage("/navigate", NavigationTrigger.HISTORY, "navigate");
 
         findElement(By.id("forwardButton")).click();
-        assertMessageCount(6);
+        assertMessageCount(7);
         assertLastMessage("/forwarded", NavigationTrigger.PROGRAMMATIC,
                 "forwarded");
 
         findElement(By.id("rerouteButton")).click();
-        assertMessageCount(7);
+        assertMessageCount(8);
         assertLastMessage("/rerouted", NavigationTrigger.PROGRAMMATIC,
                 "rerouted");
     }