#49 fix: popup de detalle de producto en el mapa abre correctamente al clicar en el popup agrupado
This commit is contained in:
@@ -215,7 +215,10 @@
|
|||||||
name.className = 'provenance-popup-name'
|
name.className = 'provenance-popup-name'
|
||||||
name.textContent = item.product.name
|
name.textContent = item.product.name
|
||||||
row.appendChild(name)
|
row.appendChild(name)
|
||||||
row.addEventListener('click', () => onItemClick(item))
|
row.addEventListener('click', event => {
|
||||||
|
event.stopPropagation()
|
||||||
|
onItemClick(item)
|
||||||
|
})
|
||||||
container.appendChild(row)
|
container.appendChild(row)
|
||||||
})
|
})
|
||||||
return container
|
return container
|
||||||
|
|||||||
@@ -18,6 +18,7 @@ const leaflet = vi.hoisted(() => {
|
|||||||
bindPopup: vi.fn(function () { return this }),
|
bindPopup: vi.fn(function () { return this }),
|
||||||
setPopupContent: vi.fn(),
|
setPopupContent: vi.fn(),
|
||||||
openPopup: vi.fn(),
|
openPopup: vi.fn(),
|
||||||
|
closePopup: vi.fn(),
|
||||||
remove: vi.fn(),
|
remove: vi.fn(),
|
||||||
getLatLng: vi.fn(function () { return this.pos }),
|
getLatLng: vi.fn(function () { return this.pos }),
|
||||||
setLatLng: vi.fn(),
|
setLatLng: vi.fn(),
|
||||||
@@ -254,15 +255,19 @@ describe('ProvenanceMap', () => {
|
|||||||
expect(popupEl.textContent).toContain('Arroz')
|
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 })
|
mountMap({ provenance: sameMuni })
|
||||||
await flushPromises()
|
await flushPromises()
|
||||||
|
|
||||||
const groupMarker = leaflet.markers[1]
|
const groupMarker = leaflet.markers[1]
|
||||||
const popupEl = groupMarker.bindPopup.mock.calls[0][0]
|
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"]')
|
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)
|
expect(groupMarker.setPopupContent).toHaveBeenCalledTimes(1)
|
||||||
const detailEl = groupMarker.setPopupContent.mock.calls[0][0]
|
const detailEl = groupMarker.setPopupContent.mock.calls[0][0]
|
||||||
expect(detailEl.textContent).toContain('Arroz')
|
expect(detailEl.textContent).toContain('Arroz')
|
||||||
|
|||||||
Reference in New Issue
Block a user