From: Vladimir <Rukipomoi@gmail.com>
Date: Wed, 8 Oct 2025 14:18:50 +0000 (+0400)
Subject: fix(routerlink): allow event handlers under strictTemplates (fix #2484) (#2548)
X-Git-Tag: v4.6.0~27
X-Git-Url: http://git.ipfire.org/gitweb.cgi?a=commitdiff_plain;h=8f35c6db0b6bd49c6f947331d5d4c249febb483c;p=thirdparty%2Fvuejs%2Frouter.git

fix(routerlink): allow event handlers under strictTemplates (fix #2484) (#2548)

Co-authored-by: Eduardo San Martin Morote <posva13@gmail.com>
---

diff --git a/packages/router/src/RouterLink.ts b/packages/router/src/RouterLink.ts
index e5b5d9d6..b76d4790 100644
--- a/packages/router/src/RouterLink.ts
+++ b/packages/router/src/RouterLink.ts
@@ -26,6 +26,7 @@ import {
   // @ts-ignore
   ComponentOptionsMixin,
   MaybeRef,
+  AnchorHTMLAttributes,
 } from 'vue'
 import { isSameRouteLocationParams, isSameRouteRecord } from './location'
 import { routerKey, routeLocationKey } from './injectionSymbols'
@@ -359,6 +360,25 @@ export const RouterLinkImpl = /*#__PURE__*/ defineComponent({
  */
 export const RouterLink: _RouterLinkI = RouterLinkImpl as any
 
+/**
+ * @internal
+ */
+type _RouterLinkPropsTypedBase = AllowedComponentProps &
+  ComponentCustomProps &
+  VNodeProps &
+  RouterLinkProps
+
+/**
+ * @internal
+ */
+type RouterLinkPropsTyped<Custom extends boolean | undefined> =
+  Custom extends true
+    ? _RouterLinkPropsTypedBase & { custom: true }
+    : _RouterLinkPropsTypedBase & { custom?: false | undefined } & Omit<
+          AnchorHTMLAttributes,
+          'href'
+        >
+
 /**
  * Typed version of the `RouterLink` component. Its generic defaults to the typed router, so it can be inferred
  * automatically for JSX.
@@ -366,11 +386,8 @@ export const RouterLink: _RouterLinkI = RouterLinkImpl as any
  * @internal
  */
 export interface _RouterLinkI {
-  new (): {
-    $props: AllowedComponentProps &
-      ComponentCustomProps &
-      VNodeProps &
-      RouterLinkProps
+  new <Custom extends boolean | undefined = boolean | undefined>(): {
+    $props: RouterLinkPropsTyped<Custom>
 
     $slots: {
       default?: ({
diff --git a/packages/router/test-dts/components.test-d.tsx b/packages/router/test-dts/components.test-d.tsx
index 07c27052..ac96ec08 100644
--- a/packages/router/test-dts/components.test-d.tsx
+++ b/packages/router/test-dts/components.test-d.tsx
@@ -27,6 +27,17 @@ describe('Components', () => {
     expectTypeOf<JSX.Element>(<RouterLink class="link" to="/foo" />)
     expectTypeOf<JSX.Element>(<RouterLink to={{ path: '/foo' }} />)
     expectTypeOf<JSX.Element>(<RouterLink to={{ path: '/foo' }} custom />)
+    // event handlers and anchor attrs are allowed when not custom
+    expectTypeOf<JSX.Element>(
+      <RouterLink to="/" onFocus={() => {}} onClick={() => {}} />
+    )
+    expectTypeOf<JSX.Element>(
+      <RouterLink to="/" target="_blank" rel="noopener" />
+    )
+    // @ts-expect-error: href is intentionally omitted
+    expectError(<RouterLink to="/" href="/bar" />)
+    // @ts-expect-error: onFocus should not be allowed with custom
+    expectError(<RouterLink to="/" custom onFocus={() => {}} />)
 
     // RouterView
     expectTypeOf<JSX.Element>(<RouterView class="view" />)