Update the mouse events on tapping of gesture across frames

LayoutTests/fast/events/touch/gesture/gesture-tap-mouse-events-between-frames-expected.txt

+
+Verifies that mouse events are fired on tapping of gesture across frames in the correct order.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+--- Tap tests ---
+-- sending gestureTap to darkgreen --
+PASS fired event is (yellow, mouseover).
+PASS fired event is (yellow, mouseenter).
+PASS fired event is (greenyellow, mouseover).
+PASS fired event is (greenyellow, mouseenter).
+PASS fired event is (limegreen, mouseover).
+PASS fired event is (limegreen, mouseenter).
+PASS fired event is (darkgreen, mouseover).
+PASS fired event is (green, mouseover).
+PASS fired event is (green, mouseenter).
+PASS fired event is (darkgreen, mouseenter).
+-- sending gestureTap to darkgreen --
+There should not be any mouse event.
+-- sending gestureTap to deeppink --
+PASS fired event is (darkgreen, mouseout).
+PASS fired event is (green, mouseout).
+PASS fired event is (darkgreen, mouseleave).
+PASS fired event is (green, mouseleave).
+PASS fired event is (limegreen, mouseout).
+PASS fired event is (limegreen, mouseleave).
+PASS fired event is (greenyellow, mouseout).

[mustaq, 2015/07/02 20:37:29]

There shouldn't be any mouseout/mouseover on greenyellow. Am I missing something
here?

[Miyoung Shin(c), 2015/07/05 12:39:33]

As I tested the mouse case at http://output.jsbin.com/cenoje/quiet,
it shows the mouseout/mouseover events on parent element(lightyellow) when
moving the pointer between the child elements.

So, I checked the spec and it describe like below.
http://www.w3.org/TR/DOM-Level-3-Events/#event-type-mouseout
"it must be dispatched when the pointer device moves from an element onto the
boundaries of one of its descendent elements."

I think that the gesture event also keeps compatibility with mouse case. 

[mustaq, 2015/07/06 17:14:50]

There are two tiny but important distinctions here: the events received by
lightyellow in this case are bubbled events only, and there is no frame
boundary. Bubbled events shouldn't cross frame boundaries.

Thanks for bringing this up, just realized that the spec seems unclear even
about non-bubbling mouseenter and mouseleve events across frame boundaries.
Compatibility with other browsers is our only guide here I think. Could you
please check what Firefox and IE do in the deep frame nesting example you made
(i.e. for A{B{C} D{E}} where X{Y} means frame X contains frame Y)? I see the
following possibilities:

#1. FF & IE are like your current solution: follow the frame-tree structure for
mouseenter/mouseleave as well as mouseover/mouseout.

#2. They follow the frame-tree structure for mouseenter/mouseleave only, and
mouseover/mouseout never come out of the deepest affected frame.

#3. Perhaps the simplest solution: update the mouse state (for all of
mouseenter, mouseleave, mouseover and mouseout) in the deepest affected frame
only without worrying about the frame tree structure. In your case, if the mouse
moves from C to E, none of A, B, and D should be notified.

If you have a jsbin demo for your deep frame nesting example, please update the
bug so that we can manually check corner cases.

+PASS fired event is (greenyellow, mouseover).
+PASS fired event is (pink, mouseover).
+PASS fired event is (pink, mouseenter).
+PASS fired event is (deeppink, mouseover).
+PASS fired event is (hotpink, mouseover).
+PASS fired event is (hotpink, mouseenter).
+PASS fired event is (deeppink, mouseenter).
+-- sending gestureTap to deeppink --
+There should not be any mouse event.
+-- sending gestureTap to darkgreen --
+PASS fired event is (deeppink, mouseout).
+PASS fired event is (hotpink, mouseout).
+PASS fired event is (deeppink, mouseleave).
+PASS fired event is (hotpink, mouseleave).
+PASS fired event is (pink, mouseout).
+PASS fired event is (pink, mouseleave).
+PASS fired event is (greenyellow, mouseout).
+PASS fired event is (greenyellow, mouseover).
+PASS fired event is (limegreen, mouseover).
+PASS fired event is (limegreen, mouseenter).
+PASS fired event is (darkgreen, mouseover).
+PASS fired event is (green, mouseover).
+PASS fired event is (green, mouseenter).
+PASS fired event is (darkgreen, mouseenter).
+PASS successfullyParsed is true
+
+TEST COMPLETE
+