Dispatcher: Handle nested pointerenter/leave

Fixes gh-197
Closes gh-274

Author: bethge

src/dispatcher.js

@@ -197,15 +197,11 @@ var dispatcher = {
   },
   leaveOut: function(event) {
     this.out(event);
-    if (!this.contains(event.target, event.relatedTarget)) {
-      this.leave(event);
-    }
+    this.propagate(event, this.leave, false);
   },
   enterOver: function(event) {
     this.over(event);
-    if (!this.contains(event.target, event.relatedTarget)) {
-      this.enter(event);
-    }
+    this.propagate(event, this.enter, true);
   },
 
   // LISTENER LOGIC
@@ -314,6 +310,21 @@ var dispatcher = {
       return capture;
     }
   },
+  propagate: function(event, fn, propagateDown) {
+    var target = event.target;
+    var targets = [];
+    while (!target.contains(event.relatedTarget) && target !== document) {
+      targets.push(target);
+      target = target.parentNode;
+    }
+    if (propagateDown) {
+      targets.reverse();
+    }
+    targets.forEach(function(target) {
+      event.target = target;
+      fn.call(this, event);
+    }, this);
+  },
   setCapture: function(inPointerId, inTarget) {
     if (this.captureInfo[inPointerId]) {
       this.releaseCapture(inPointerId);

src/touch.js

@@ -265,8 +265,7 @@ var touchEvents = {
       out: inPointer,
       outTarget: inPointer.target
     });
-    dispatcher.over(inPointer);
-    dispatcher.enter(inPointer);
+    dispatcher.enterOver(inPointer);
     dispatcher.down(inPointer);
   },
   touchmove: function(inEvent) {
@@ -318,8 +317,7 @@ var touchEvents = {
   upOut: function(inPointer) {
     if (!this.scrolling) {
       dispatcher.up(inPointer);
-      dispatcher.out(inPointer);
-      dispatcher.leave(inPointer);
+      dispatcher.leaveOut(inPointer);
     }
     this.cleanUpPointer(inPointer);
   },
@@ -328,8 +326,7 @@ var touchEvents = {
   },
   cancelOut: function(inPointer) {
     dispatcher.cancel(inPointer);
-    dispatcher.out(inPointer);
-    dispatcher.leave(inPointer);
+    dispatcher.leaveOut(inPointer);
     this.cleanUpPointer(inPointer);
   },
   cleanUpPointer: function(inPointer) {

tests/functional/pointerevent_pointerleave_descendants-manual.js

@@ -9,10 +9,11 @@ define(function(require) {
 		main: function() {
 			return w3cTest(this.remote, name + '.html')
 				.findById('target0')
-					.moveMouseTo(50, 8)
+					.moveMouseTo(200, 10)
 					.end()
-				.findByTagName('body')
-					.moveMouseTo(50, 30)
+				.findByCssSelector('#target0 div')
+					.moveMouseTo(200, 10)
+					.moveMouseTo(200, 150)
 					.end()
 				.checkResults();
 		}