Fixes #2367, closes #2467 - Use the check when using delegation for m…

…ouseenter.

Since 1.4.2 the native mouseenter/mouseleave events are used, when available
(Firefox, IE). For delegation however, it should has to use mouseover/mouseout
because it should still fire each time an element is entered or left so it can
check if it matches the selector.

thanks @luisateixeira for the research/fix

Source/Element/Element.Delegation.js

@@ -29,10 +29,12 @@ var bubbleUp = function(self, match, fn, event, target){
 
 var map = {
 	mouseenter: {
-		base: 'mouseover'
+		base: 'mouseover',
+		condition: Element.MouseenterCheck
 	},
 	mouseleave: {
-		base: 'mouseout'
+		base: 'mouseout',
+		condition: Element.MouseenterCheck
 	},
 	focus: {
 		base: 'focus' + (eventListenerSupport ? '' : 'in'),
@@ -139,8 +141,8 @@ var delegation = {
 		};
 
 		var elementEvent = Element.Events[_type];
-		if (elementEvent && elementEvent.condition){
-			var __match = match, condition = elementEvent.condition;
+		if (_map.condition || elementEvent && elementEvent.condition){
+			var __match = match, condition = _map.condition || elementEvent.condition;
 			match = function(target, event){
 				return __match(target, event) && condition.call(target, event, type);
 			};

Source/Element/Element.Event.js

@@ -146,16 +146,17 @@ Element.Events = {mousewheel: {
 	base: (Browser.firefox) ? 'DOMMouseScroll' : 'mousewheel'
 }};
 
+var check = function(event){
+	var related = event.relatedTarget;
+	if (related == null) return true;
+	if (!related) return false;
+	return (related != this && related.prefix != 'xul' && typeOf(this) != 'document' && !this.contains(related));
+};
+
 if ('onmouseenter' in document.documentElement){
 	Element.NativeEvents.mouseenter = Element.NativeEvents.mouseleave = 2;
+	Element.MouseenterCheck = check;
 } else {
-	var check = function(event){
-		var related = event.relatedTarget;
-		if (related == null) return true;
-		if (!related) return false;
-		return (related != this && related.prefix != 'xul' && typeOf(this) != 'document' && !this.contains(related));
-	};
-
 	Element.Events.mouseenter = {
 		base: 'mouseover',
 		condition: check

Specs/1.4client/Element/Element.Delegation.html

@@ -71,6 +71,20 @@
 				width: 300px;
 			}
 
+			#mouseenter_table {
+				border-collapse: collapse;
+			}
+
+			#mouseenter_table tr {
+				background-color: cyan;
+				color: blue;
+			}
+
+			#mouseenter_table td {
+				border: 1px solid white;
+				padding: 10px;
+			}
+
 		</style>
 
 	</head>
@@ -133,6 +147,17 @@ <h1>Mouseenter / Mouseleave</h1>
 				</div>
 			</div>
 
+			<h1>Mouseenter / Mouseleave with tr</h1>
+
+			<table id="mouseenter_table">
+				<tbody>
+					<tr class="box">
+						<td>COLUMN 1</td>
+						<td>COLUMN 2</td>
+					</tr>
+				</tbody>
+			</table>
+
 			<script>
 				$('mouseenter_leave').addEvents({
 					'mouseenter:relay(.mouse)': log.pass(['enter', true]),
@@ -141,6 +166,13 @@ <h1>Mouseenter / Mouseleave</h1>
 						log('---');
 					}
 				});
+				$('mouseenter_table').addEvents({
+					'mouseenter:relay(tr)': log.pass(['entered tr', true]),
+					'mouseleave:relay(tr)': function(){
+						log('left tr', true);
+						log('---');
+					}
+				})
 			</script>
 
 			<h1>Focus / Blur</h1>