Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix mouseout bubbling while initial target was not listening (fix #3648) #3650

Merged
merged 1 commit into from
Jul 20, 2015

Conversation

yohanboniface
Copy link
Member

This simple change should fix #3648.
Sadly, I can't add a unittest because happen doesn't seem to allow configuration of relatedTarget when firing an event (not sure why, cc @tmcw), so while in unittests this check is always true.

mourner added a commit that referenced this pull request Jul 20, 2015
Fix mouseout bubbling while initial target was not listening (fix #3648)
@mourner mourner merged commit 30df381 into master Jul 20, 2015
@mourner mourner deleted the mouseout-not-listened branch July 20, 2015 14:03
@mourner
Copy link
Member

mourner commented Jul 20, 2015

Awesome!

@janpaul123
Copy link

I think this fix has regressed. (Too bad a unit test wasn't possible…) If a target doesn't listen in _findEventTargets it will skip it but continue to the parent, thus implicitly bubbling, even if the event is in nonBubblingEvents. I can write up an example to reproduce, if you want.

@yohanboniface
Copy link
Member Author

I can write up an example to reproduce, if you want.

Would be very nice, thanks! You can use http://playground-leaflet.rhcloud.com/ for that :)

@yohanboniface
Copy link
Member Author

For the record, it's now possible to set relatedTarget in happen, since tmcw/happen#17

@IvanSanchez
Copy link
Member

Related: Leaflet/prosthetic-hand#9

@janpaul123
Copy link

Here you go: http://playground-leaflet.rhcloud.com/damu/1/edit?html,output

There is a click event bound to the map which prints to the console. Clicking on either marker should not trigger that event, because the default options of Marker include nonBubblingEvents to include click (among other events). However, if you click on the top marker (which does not have a popup bound), it still fires. This is exactly the bug that this PR originally fixed.

@yohanboniface
Copy link
Member Author

Thanks!

I'm not sure this is a bug actually. Some details:

  • this PR was about preventing mouseout and mouseover to be targeted on parent elements of the original target
  • nonBubblingEvents means not firing events on parents of an element if this element actually caught the event
  • in your example, topMarker is not listening for click, thus the event is sent to the map
  • if you don't want the map to received the event, you need to catch it on the marker and stop it: topMarker.on('click', L.DomEvent.stop);

Hope this makes sense! :)

@janpaul123
Copy link

Ah, if this is intentional then that's fine, but it still doesn't seem great to me that just setting an event handler has the side effect of preventing bubbling.

I would expect people to be confused by this, especially because the browser's bubbling does not work like this. For example, you don't have to call topMarker.on('click', L.DomEvent.stop);, it also prevents bubbling when you do topMarker.on('click', function() {});. I did not expect that.

If you do want to keep this behaviour, I'd suggest adding some comments in the code to clarify that this is how it's supposed to work (right now this is the only comment as far as I can tell). And perhaps something about this in the documentation, too.

@yohanboniface
Copy link
Member Author

For example, you don't have to call topMarker.on('click', L.DomEvent.stop);, it also prevents bubbling when you do topMarker.on('click', function() {});. I did not expect that.

See #3605 (comment) for more context about this design decision. I agree that this needs to be somewhere in the doc.

@janpaul123
Copy link

Yeah, that makes sense, this would be a significant breaking change. I suppose both solutions have some element of surprise in them. Perhaps it would also help if we wouldn't call this stuff "bubbling", since that implies things work similar to DOM bubbling. I don't have good alternatives though.

Anyway, thanks for your quick responses and providing context!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Map mouseout event fired by TileLayer change of DOM element (in master branch)
4 participants