From ca894ab61e2df0c043d7a95a889fb2597184c7f4 Mon Sep 17 00:00:00 2001 From: Derrick Reimer Date: Thu, 12 Dec 2024 13:21:31 -0600 Subject: [PATCH] Restore command + click behavior on Inertia links in React In #1910 (d53b2b3), we switched to passing `event.nativeEvent` to `shouldIntercept` in an attempt to consistently always pass native browser events to this framework-agnostic helper. This actually introduced a bug though, because `currentTarget` is _different_ on React's synthetic event vs. the underlying native event. The correct value for `currentTarget` lives on the synthetic event. Since we are no longer relying on `event.which` (and this is the only property we used to be concerned with that was not included on the React synthetic event), we'll simply move back to passing the React synthetic event to `shouldIntercept`. --- packages/core/src/shouldIntercept.ts | 11 ++++++++++- packages/react/src/Link.ts | 2 +- 2 files changed, 11 insertions(+), 2 deletions(-) diff --git a/packages/core/src/shouldIntercept.ts b/packages/core/src/shouldIntercept.ts index 42c61fb40..43d1dddba 100644 --- a/packages/core/src/shouldIntercept.ts +++ b/packages/core/src/shouldIntercept.ts @@ -1,4 +1,13 @@ -export default function shouldIntercept(event: MouseEvent | KeyboardEvent): boolean { +// The actual event passed to this function could be a native JavaScript event +// or a React synthetic event, so we are picking just the keys needed here (that +// are present in both types). + +export default function shouldIntercept( + event: Pick< + MouseEvent, + 'altKey' | 'ctrlKey' | 'defaultPrevented' | 'target' | 'currentTarget' | 'metaKey' | 'shiftKey' | 'button' + >, +): boolean { const isLink = (event.currentTarget as HTMLElement).tagName.toLowerCase() === 'a' return !( (event.target && (event?.target as HTMLElement).isContentEditable) || diff --git a/packages/react/src/Link.ts b/packages/react/src/Link.ts index 5d29b01f8..8180e5fbb 100755 --- a/packages/react/src/Link.ts +++ b/packages/react/src/Link.ts @@ -70,7 +70,7 @@ const Link = forwardRef( (event: React.MouseEvent) => { onClick(event) - if (shouldIntercept(event.nativeEvent)) { + if (shouldIntercept(event)) { event.preventDefault() router.visit(href, {