VladPolskiy/leaflet
1
0
Fork 0
mirror of https://github.com/Leaflet/Leaflet.git synced 2025-07-25 15:38:54 +00:00
Code Issues Packages Projects Releases 1 Wiki Activity

Remove focus listeners with unbinding tooltip (#9232)

Browse Source 
Co-authored-by: Adauji <5890802@ez.edeka.net>
Co-authored-by: Florian Bischof <design.falke@gmail.com>
This commit is contained in:
Mihai Adauji
2025-03-01 12:03:39 +02:00
committed by GitHub
parent ecdb13df2e
commit 7d6bb49a43
2 changed files with 60 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
spec/suites/layer/TooltipSpec.js
View File

@ -580,4 +580,36 @@ describe('Tooltip', () => {
layer2.openTooltip(); layer2.openTooltip();
expect(spy2.called).to.be.true; expect(spy2.called).to.be.true;
}); });
it('removes focus listeners after unbinding tooltip from Layer', () => {
const marker = new Marker([51.515, -0.09]).addTo(map);
marker
.bindTooltip('Tooltip that will be unbinded')
.openTooltip();
expect(marker.getElement()._leaflet_focus_handler).to.be.not.undefined;
marker.unbindTooltip();
expect(() => UIEventSimulator.fire('focus', marker.getElement())).to.not.throw();
expect(marker.getElement()._leaflet_focus_handler).to.be.undefined;
});
it('removes focus listeners after unbinding tooltip from FeatureGroup', () => {
const marker = new Marker([51.515, -0.09]);
const layergroup = new FeatureGroup([marker]).addTo(map);
layergroup
.bindTooltip('Tooltip that will be unbinded in two seconds')
.openTooltip();
expect(marker.getElement()._leaflet_focus_handler).to.be.not.undefined;
layergroup.unbindTooltip();
expect(() => UIEventSimulator.fire('focus', marker.getElement())).to.not.throw();
expect(marker.getElement()._leaflet_focus_handler).to.be.undefined;
});
}); });

41
src/layer/Tooltip.js
View File

@ -303,18 +303,18 @@ Layer.include({
_initTooltipInteractions(remove) { _initTooltipInteractions(remove) {
if (!remove && this._tooltipHandlersAdded) { return; } if (!remove && this._tooltipHandlersAdded) { return; }
const onOff = remove ? 'off' : 'on', const onOff = remove ? 'off' : 'on',
events = { events = {
remove: this.closeTooltip, remove: this.closeTooltip,
move: this._moveTooltip move: this._moveTooltip
}; };
if (!this._tooltip.options.permanent) { if (!this._tooltip.options.permanent) {
events.mouseover = this._openTooltip; events.mouseover = this._openTooltip;
events.mouseout = this.closeTooltip; events.mouseout = this.closeTooltip;
events.click = this._openTooltip; events.click = this._openTooltip;
if (this._map) { if (this._map) {
this._addFocusListeners(); this._addFocusListeners(remove);
} else { } else {
events.add = this._addFocusListeners; events.add = () => this._addFocusListeners(remove);
} }
} else { } else {
events.add = this._openTooltip; events.add = this._openTooltip;
@ -385,22 +385,37 @@ Layer.include({
return this._tooltip; return this._tooltip;
}, },
_addFocusListeners() { _addFocusListeners(remove) {
if (this.getElement) { if (this.getElement) {
this._addFocusListenersOnLayer(this); this._addFocusListenersOnLayer(this, remove);
} else if (this.eachLayer) { } else if (this.eachLayer) {
this.eachLayer(this._addFocusListenersOnLayer, this); this.eachLayer(layer => this._addFocusListenersOnLayer(layer, remove), this);
} }
}, },
_addFocusListenersOnLayer(layer) { _addFocusListenersOnLayer(layer, remove) {
const el = typeof layer.getElement === 'function' && layer.getElement(); const el = typeof layer.getElement === 'function' && layer.getElement();
if (el) { if (el) {
DomEvent.on(el, 'focus', function () { const onOff = remove ? 'off' : 'on';
this._tooltip._source = layer; if (!remove) {
this.openTooltip(); // Remove focus listener, if already existing
}, this); el._leaflet_focus_handler && DomEvent.off(el, 'focus', el._leaflet_focus_handler, this);
DomEvent.on(el, 'blur', this.closeTooltip, this);
// eslint-disable-next-line camelcase
el._leaflet_focus_handler = () => {
if (this._tooltip) {
this._tooltip._source = layer;
this.openTooltip();
}
};
}
el._leaflet_focus_handler && DomEvent[onOff](el, 'focus', el._leaflet_focus_handler, this);
DomEvent[onOff](el, 'blur', this.closeTooltip, this);
if (remove) {
delete el._leaflet_focus_handler;
}
} }
}, },