Add e2e test for react-router Link in SVG

Author: dsdeur

e2e/react-router/basic/src/main.tsx

@@ -69,7 +69,23 @@ function RootComponent() {
           }}
         >
           This Route Does Not Exist
-        </Link>
+        </Link>{' '}
+        <div className="flex items-center">
+          <svg width="20" height="20" viewBox="0 0 20 20" role="img">
+            <title id="rectTitle">Link in SVG</title>
+            <Link to="/posts" aria-label="Open posts from SVG">
+              <rect
+                x="0"
+                y="0"
+                width="20"
+                height="20"
+                rx="4"
+                fill="blue"
+                strokeWidth="2"
+              />
+            </Link>
+          </svg>
+        </div>
       </div>
       <Outlet />
       <TanStackRouterDevtools position="bottom-right" />

e2e/react-router/basic/tests/app.spec.ts

@@ -1,4 +1,8 @@
 import { expect, test } from '@playwright/test'
+import { getTestServerPort } from '@tanstack/router-e2e-utils'
+import packageJson from '../package.json' with { type: 'json' }
+
+const PORT = await getTestServerPort(packageJson.name)
 
 test.beforeEach(async ({ page }) => {
   await page.goto('/')
@@ -45,3 +49,16 @@ test('Navigating to a post page with viewTransition types', async ({
   await page.getByRole('link', { name: 'sunt aut facere repe' }).click()
   await expect(page.getByRole('heading')).toContainText('sunt aut facere')
 })
+
+test('Link in SVG does not trigger a full page reload', async ({ page }) => {
+  let fullPageLoad = false
+  page.on('domcontentloaded', () => {
+    fullPageLoad = true
+  })
+
+  await page.getByRole('link', { name: 'Open posts from SVG' }).click()
+  const url = `http://localhost:${PORT}/posts`
+  await page.waitForURL(url)
+
+  expect(fullPageLoad).toBeFalsy()
+})