diff --git a/packages/react-native-gesture-handler/src/web/tools/GestureHandlerWebDelegate.ts b/packages/react-native-gesture-handler/src/web/tools/GestureHandlerWebDelegate.ts index 8e46b32c9b..6efe45ba36 100644 --- a/packages/react-native-gesture-handler/src/web/tools/GestureHandlerWebDelegate.ts +++ b/packages/react-native-gesture-handler/src/web/tools/GestureHandlerWebDelegate.ts @@ -12,6 +12,7 @@ import { MouseButton } from '../../handlers/gestureHandlerCommon'; import KeyboardEventManager from './KeyboardEventManager'; import WheelEventManager from './WheelEventManager'; import { tagMessage } from '../../utils'; +import HoverGestureHandler from '../handlers/HoverGestureHandler'; interface DefaultViewStyles { userSelect: string; @@ -52,7 +53,11 @@ export class GestureHandlerWebDelegate this.setTouchAction(); this.setContextMenu(); - this.eventManagers.push(new PointerEventManager(this.view)); + const shouldSendHoverEvents = handler instanceof HoverGestureHandler; + + this.eventManagers.push( + new PointerEventManager(this.view, shouldSendHoverEvents) + ); this.eventManagers.push(new KeyboardEventManager(this.view)); this.eventManagers.push(new WheelEventManager(this.view)); diff --git a/packages/react-native-gesture-handler/src/web/tools/PointerEventManager.ts b/packages/react-native-gesture-handler/src/web/tools/PointerEventManager.ts index 685d39a27b..703e346f3b 100644 --- a/packages/react-native-gesture-handler/src/web/tools/PointerEventManager.ts +++ b/packages/react-native-gesture-handler/src/web/tools/PointerEventManager.ts @@ -13,14 +13,17 @@ const POINTER_CAPTURE_EXCLUDE_LIST = new Set(['SELECT', 'INPUT']); export default class PointerEventManager extends EventManager { private trackedPointers = new Set(); private lastPosition: Point; + private shouldSendHoverEvents: boolean; - constructor(view: HTMLElement) { + constructor(view: HTMLElement, shouldSendHoverEvents: boolean) { super(view); this.lastPosition = { x: -Infinity, y: -Infinity, }; + + this.shouldSendHoverEvents = shouldSendHoverEvents; } private pointerDownCallback = (event: PointerEvent) => { @@ -74,6 +77,10 @@ export default class PointerEventManager extends EventManager { }; private pointerMoveCallback = (event: PointerEvent) => { + if (!this.shouldSendHoverEvents && this.activePointersCounter === 0) { + return; + } + const adaptedEvent: AdaptedEvent = this.mapEvent(event, EventTypes.MOVE); const target = event.target as HTMLElement;