Issue
When using the default geocoder from leaflet-routing-machine, clicking the close/delete button (with class .leaflet-routing-remove-waypoint) propagates the click event to the map layer. This causes unintended waypoint creation at the cursor position rather than cleanly deleting the waypoint entry.
Expected Behavior
Clicking the close button should only delete the waypoint entry without triggering any map interactions.
Actual Behavior
- Click the close button on a geocoder entry
- The waypoint is deleted
- A new waypoint is immediately created at the cursor position on the map
Root Cause
The close button's click event bubbles up to the map layer because the default geocoder markup doesn't prevent event propagation on the geocoder container or close button elements.
Workaround
Until this is fixed upstream, projects can apply a runtime monkey patch to stop click propagation on the geocoder container:
// Patch leaflet-routing-machine geocoder to stop click propagation
if (document.querySelector('.leaflet-routing-geocoders')) {
const container = document.querySelector('.leaflet-routing-geocoders');
if (container) {
container.addEventListener('click', (e) => {
e.stopPropagation();
});
}
}
Reference
This issue was encountered and worked around in the OSRM Frontend project: Project-OSRM/osrm-frontend#409
The fix prevents propagation at the container level while preserving the close button's deletion functionality.
Environment
- leaflet-routing-machine: 3.2.12
- leaflet-control-geocoder: ^3.3.1
Issue
When using the default geocoder from leaflet-routing-machine, clicking the close/delete button (with class
.leaflet-routing-remove-waypoint) propagates the click event to the map layer. This causes unintended waypoint creation at the cursor position rather than cleanly deleting the waypoint entry.Expected Behavior
Clicking the close button should only delete the waypoint entry without triggering any map interactions.
Actual Behavior
Root Cause
The close button's click event bubbles up to the map layer because the default geocoder markup doesn't prevent event propagation on the geocoder container or close button elements.
Workaround
Until this is fixed upstream, projects can apply a runtime monkey patch to stop click propagation on the geocoder container:
Reference
This issue was encountered and worked around in the OSRM Frontend project: Project-OSRM/osrm-frontend#409
The fix prevents propagation at the container level while preserving the close button's deletion functionality.
Environment