MouseEnter/MouseLeave events fired on touch/tap

By design Issue #10511224

Details

Author
Mike D.
Created
Jan 12, 2017
Privacy
This issue is public.
Found in
  • Microsoft Edge
Standard affected
Touch Events

Found in build #
13.10586
Reports
Reported by 6 people

Sign in to watch or report this issue.

Steps to reproduce

Duplicate of https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/8342983/, which was closed as "Not Reproducable". I would reopen that ticket, but it isn’t mine so I can’t (note that I did comment on that ticket, though.)

The issue is that the MouseLeave event is fired when an element is touched/tapped.

It can be reproduced in Edge 25.10586.672.0, on Windows 10, on a Surface Pro 4 (at the very least), using the codepen link from the other ticket: http://codepen.io/suzannedecreme/pen/rLAXqX

Note that the div’s text changes to “Mouse Leave” on Edge, but not on either Chrome or Firefox on the same machine. Also, the W3 spec for the interaction of mouse events with touch events does not specify that the MouseLeave event should be fired: https://www.w3.org/TR/touch-events/#mouse-events

Instead, note that the MouseLeave event is fired in Chrome and Firefox when tapping outside of the div’s text.

Attachments

0 attachments

    Comments and activity

    • To be clear, I am using Edge 25.10586.672.0, and EdgeHTML 13.10586.

    • Also, I forgot to edit the title before submitting, but it turns out that MouseEnter firing is common among browsers, but MouseLeave still is not.

    • Microsoft Edge Team

      Changed Assigned To to “Ibrahim O.”

      Changed Assigned To to “Travis L.”

      Changed Assigned To to “Rick J.”

      Changed Assigned To to “Sermet I.”

      Changed Assigned To from “Sermet I.” to “Bruce L.”

      Changed Status to “Confirmed”

    • This is because of Pointer Events spec. http://www.w3.org/TR/pointerevents/#the-pointerleave-event

      A user agent MUST fire a pointer event named pointerleave when a pointing device is moved out of the hit test boundaries of an element and all of its descendants, including as a result of a pointerup and pointercancel events from a device that does not support hover (see pointerup and pointercancel).

    • http://www.w3.org/TR/pointerevents/#mapping-for-devices-that-support-hover

      If the pointer event dispatched was:
      pointerover, then fire a mouseover event.
      pointerout, then fire a mouseout event.
      pointerenter, then fire a mouseenter event.
      pointerleave, then fire a mouseleave event.

    • Microsoft Edge Team

      Changed Assigned To from “Bruce L.” to “Alexander W.”

      Changed Status from “Confirmed” to “By design”

    • Hello,

      Thank you for providing this information about the issue. Edge on desktop fires mouse events synchronously with touch (a mouseenter before pointerdown and a mouseleave after pointerup). This is because mouse events are 1:1 with pointer events for this design. On mobile, we’ve matched other platforms such as Chrome, where they have simulated mouse events on click. This fires all mouse events after a tap has occurred and won’t fire the mouseleave until tapping on another element. We may bring this behavior and touch events to touch on desktop in the future but haven’t made the decision to do that yet. For now this behavior is by design.

      Best Wishes,
      The MS Edge Team

    You need to sign in to your Microsoft account to add a comment.

    Sign in