primitives icon indicating copy to clipboard operation
primitives copied to clipboard

fix(hover-card): avoid preventDefault in passive event listener

Open priyanshuKumar56 opened this issue 2 months ago • 1 comments

🐛 Bug Description

While investigating shadcn-ui/ui#8777 (Hover Card Touch Error), I found that the root cause originates from @radix-ui/react-hover-card rather than shadcn/ui.

The issue occurs when touching a HoverCardTrigger on mobile or in Chrome’s mobile emulator. Console shows:

Unable to preventDefault inside passive event listener

🔍 Root Cause

@radix-ui/react-hover-card currently calls event.preventDefault() unconditionally inside the trigger’s onTouchStart handler.

In React 19, touch event listeners are now passive by default, so calling preventDefault() throws this warning.

File: packages/react/hover-card/src/HoverCard.tsx Lines: ~93–95

onTouchStart={composeEventHandlers(
  props.onTouchStart,
  (event) => event.preventDefault()
)}

💡 Fix

Guard the call to only execute when the event is cancelable:

- onTouchStart={composeEventHandlers(props.onTouchStart, (event) => event.preventDefault())}
+ onTouchStart={composeEventHandlers(props.onTouchStart, (event) => {
+   if (event.cancelable) {
+     event.preventDefault();
+   }
+ })}

✅ Impact

Removes noisy console warnings in React 19 + Chrome mobile emulation

Maintains existing behavior for React 18 and older

No behavior change for desktop or mouse interactions

🧪 Verification

Tested locally in:

React: 19.2.0

Next.js: 16.0.1

Chrome: 142.0.7444.60 (mobile emulation)

System: macOS (Apple M4)

Result: ✅ No warning message ✅ HoverCard still opens correctly on touch interaction

🔗 Related Issue

Upstream Report: shadcn-ui/ui#8777

Root cause: Radix UI HoverCard

🧱 Summary

Fixes Unable to preventDefault inside passive event listener by checking event.cancelable before calling preventDefault() in HoverCardTrigger

priyanshuKumar56 avatar Nov 12 '25 15:11 priyanshuKumar56

⚠️ No Changeset found

Latest commit: 6a9fc6c7cec7704912cc17c13d1f25f9d3d7ab81

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

changeset-bot[bot] avatar Nov 12 '25 15:11 changeset-bot[bot]