Skip to content

Conversation

@priyanshuKumar56
Copy link

🐛 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

@changeset-bot
Copy link

changeset-bot bot commented Nov 12, 2025

⚠️ No Changeset found

Latest commit: 6a9fc6c

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant