diff --git a/src/components/provenance/ProvenanceMap.vue b/src/components/provenance/ProvenanceMap.vue index da16e3b..719047c 100644 --- a/src/components/provenance/ProvenanceMap.vue +++ b/src/components/provenance/ProvenanceMap.vue @@ -215,7 +215,10 @@ name.className = 'provenance-popup-name' name.textContent = item.product.name row.appendChild(name) - row.addEventListener('click', () => onItemClick(item)) + row.addEventListener('click', event => { + event.stopPropagation() + onItemClick(item) + }) container.appendChild(row) }) return container diff --git a/tests/unit/components/provenance/ProvenanceMap.spec.js b/tests/unit/components/provenance/ProvenanceMap.spec.js index c5378c7..b6e6d76 100644 --- a/tests/unit/components/provenance/ProvenanceMap.spec.js +++ b/tests/unit/components/provenance/ProvenanceMap.spec.js @@ -18,6 +18,7 @@ const leaflet = vi.hoisted(() => { bindPopup: vi.fn(function () { return this }), setPopupContent: vi.fn(), openPopup: vi.fn(), + closePopup: vi.fn(), remove: vi.fn(), getLatLng: vi.fn(function () { return this.pos }), setLatLng: vi.fn(), @@ -254,15 +255,19 @@ describe('ProvenanceMap', () => { expect(popupEl.textContent).toContain('Arroz') }) - it('al hacer clic en un producto del popup agrupado muestra su detalle en el marcador', async () => { + it('al hacer clic en un producto del popup agrupado muestra su detalle sin cerrar el popup ni propagar el clic al mapa', async () => { mountMap({ provenance: sameMuni }) await flushPromises() const groupMarker = leaflet.markers[1] const popupEl = groupMarker.bindPopup.mock.calls[0][0] + let bubbled = false + popupEl.addEventListener('click', () => { bubbled = true }) const item = popupEl.querySelector('[data-test="map-popup-item-1"]') - item.dispatchEvent(new Event('click')) + item.dispatchEvent(new MouseEvent('click', { bubbles: true })) + expect(bubbled).toBe(false) + expect(groupMarker.closePopup).not.toHaveBeenCalled() expect(groupMarker.setPopupContent).toHaveBeenCalledTimes(1) const detailEl = groupMarker.setPopupContent.mock.calls[0][0] expect(detailEl.textContent).toContain('Arroz')