Leaflet - bug with twice event handling - leaflet 1.0 beta 2

by Leo

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/leaflet/1.3.4/leaflet.js"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/leaflet/1.3.4/leaflet.css">
<body>
<div id="map" ></div>
</body>

CSS

html, body, #map {
        margin: 0;
        width: 100%;
        height: 100%;
}

JavaScript

var map = new L.Map('map', {
                center: new L.LatLng(45.5 + 0.003,-73.5 + 0.003),
                zoom: 16
            });

L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'}).addTo(map);

var polygon1 = L.polygon(
            [
              [45.5        , -73.5        ],
			        [45.5 + 0.005, -73.5        ],
              [45.5 + 0.005, -73.5 + 0.005],
              [45.5        , -73.5 + 0.005]
            ], 
            {
                fillColor: 'red', 
                fillOpacity: 1,
                "nonBubblingEvents": []
            });
var polygon2 = L.polygon(
            [
              [45.5 + 0.0025, -73.5 + 0.0025],
			        [45.5 + 0.0075 , -73.5 + 0.0025],
              [45.5 + 0.0075 , -73.5 + 0.0075],
              [45.5 + 0.0025, -73.5 + 0.0075]
            ], 
            {
                fillColor: 'blue', 
                fillOpacity: 1,
                "nonBubblingEvents": []
            });
            
            
var marker = L.marker(
    new L.LatLng(45.5 + 0.003,-73.5 + 0.003),
    {
      "nonBubblingEvents": []
    }
);
map.addLayer(polygon1);
map.addLayer(polygon2);
map.addLayer(marker);

map.addEventListener('click', function(e){ console.log("map " + e.target); })
marker.addEventListener('click', function(e){ console.log("marker "+ e.target); })
polygon1.addEventListener('click', function(e){ console.log("red polygon " + e.target); })
polygon2.addEventListener('click', function(e){ console.log("blue polygon " + e.target); })