@defra/interactive-map 0.0.25-alpha → 0.0.26-alpha

package/providers/beta/openlayers/src/appEvents.js

@@ -8,10 +8,10 @@ export function attachAppEvents ({ mapProvider, layer, layerType, transformReque
       const source = createTileSource(mapStyle.url, transformRequest)
       layer.setSource(source)
     } else if (mapStyle.type === 'ogc-vt') {
-      const { layer: newLayer } = await createOGCVectorTileLayer(mapStyle.url, transformRequest)
+      const { layer: newLayer } = await createOGCVectorTileLayer(mapStyle.url, transformRequest, mapStyle)
       map.getLayers().setAt(0, newLayer)
     } else {
-      const { layer: newLayer } = await createVectorTileLayer(mapStyle.url, transformRequest)
+      const { layer: newLayer } = await createVectorTileLayer(mapStyle.url, transformRequest, mapStyle)
       map.getLayers().setAt(0, newLayer)
     }
     eventBus.emit(events.MAP_STYLE_CHANGE, { mapStyleId: mapStyle.id })

package/providers/beta/openlayers/src/appEvents.test.js

@@ -79,8 +79,9 @@ describe('attachAppEvents', () => {
 
     it('on MAP_SET_STYLE: creates a vector tile layer and places it at index 0', async () => {
       const { setAt, handlerFor } = makeSetup()
-      await handlerFor(events.MAP_SET_STYLE)({ url: 'https://example.com/styles', id: 'newVts' })
-      expect(createVectorTileLayer).toHaveBeenCalledWith('https://example.com/styles', null)
+      const mapStyle = { url: 'https://example.com/styles', id: 'newVts' }
+      await handlerFor(events.MAP_SET_STYLE)(mapStyle)
+      expect(createVectorTileLayer).toHaveBeenCalledWith(mapStyle.url, null, mapStyle)
       expect(setAt).toHaveBeenCalledWith(0, mockVectorTileLayerInstance)
     })
 

package/providers/beta/openlayers/src/mapEvents.js

@@ -82,8 +82,6 @@ export function attachMapEvents ({
   const debouncers = []
 
   const view = map.getView()
-  const viewMinZoom = view.getMinZoom()
-  const viewMaxZoom = view.getMaxZoom()
 
   const getMapState = () => {
     if (destroyed) {
@@ -95,8 +93,8 @@ export function attachMapEvents ({
       bounds: getBounds(),
       resolution: getResolution(),
       zoom,
-      isAtMaxZoom: zoom + ZOOM_TOLERANCE >= viewMaxZoom,
-      isAtMinZoom: zoom - ZOOM_TOLERANCE <= viewMinZoom
+      isAtMaxZoom: zoom + ZOOM_TOLERANCE >= view.getMaxZoom(),
+      isAtMinZoom: zoom - ZOOM_TOLERANCE <= view.getMinZoom()
     }
   }
 

package/providers/beta/openlayers/src/mapEvents.test.js

@@ -173,6 +173,32 @@ describe('attachMapEvents — render and data events', () => {
   })
 })
 
+describe('attachMapEvents — dynamic zoom bounds', () => {
+  it('isAtMaxZoom is updated in emitted event when view max zoom changes', () => {
+    const { view, eventBus } = setup()
+    view.trigger('change')
+    mockDebounceFns[0].fn()
+    expect(eventBus.emit).toHaveBeenCalledWith(events.MAP_MOVE_END, expect.objectContaining({ isAtMaxZoom: false }))
+
+    eventBus.emit.mockClear()
+    view.getMaxZoom.mockReturnValue(7)
+    mockDebounceFns[0].fn()
+    expect(eventBus.emit).toHaveBeenCalledWith(events.MAP_MOVE_END, expect.objectContaining({ isAtMaxZoom: true }))
+  })
+
+  it('isAtMinZoom is updated in emitted event when view min zoom changes', () => {
+    const { view, eventBus } = setup()
+    view.trigger('change')
+    mockDebounceFns[0].fn()
+    expect(eventBus.emit).toHaveBeenCalledWith(events.MAP_MOVE_END, expect.objectContaining({ isAtMinZoom: false }))
+
+    eventBus.emit.mockClear()
+    view.getMinZoom.mockReturnValue(7)
+    mockDebounceFns[0].fn()
+    expect(eventBus.emit).toHaveBeenCalledWith(events.MAP_MOVE_END, expect.objectContaining({ isAtMinZoom: true }))
+  })
+})
+
 describe('attachMapEvents — remove', () => {
   it('calls cancel on all debouncers', () => {
     const { handles } = setup()

package/providers/beta/openlayers/src/openlayersProvider.js

@@ -47,11 +47,11 @@ export default class OpenLayersProvider {
       source = createTileSource(mapStyle.url, transformRequest)
       tileLayer = new TileLayer({ source })
     } else if (mapStyle.type === 'ogc-vt') {
-      const vectorTile = await createOGCVectorTileLayer(mapStyle.url, transformRequest)
+      const vectorTile = await createOGCVectorTileLayer(mapStyle.url, transformRequest, mapStyle)
       tileLayer = vectorTile.layer
       source = vectorTile.source
     } else {
-      const vectorTile = await createVectorTileLayer(mapStyle.url, transformRequest)
+      const vectorTile = await createVectorTileLayer(mapStyle.url, transformRequest, mapStyle)
       tileLayer = vectorTile.layer
       source = vectorTile.source
     }

package/providers/beta/openlayers/src/openlayersProvider.test.js

@@ -125,7 +125,7 @@ describe('OpenLayersProvider', () => {
     it('creates vector tile layer, OL objects, and emits MAP_READY by default', async () => {
       const { provider, eventBus } = makeProvider()
       await provider.initMap(defaultInitConfig)
-      expect(createVectorTileLayer).toHaveBeenCalledWith(defaultInitConfig.mapStyle.url, null)
+      expect(createVectorTileLayer).toHaveBeenCalledWith(defaultInitConfig.mapStyle.url, null, defaultInitConfig.mapStyle)
       expect(attachMapEvents).toHaveBeenCalled()
       expect(attachAppEvents).toHaveBeenCalled()
       expect(eventBus.emit).toHaveBeenCalledWith(events.MAP_READY, expect.objectContaining({

package/providers/beta/openlayers/src/utils/tileLayers.js

@@ -66,7 +66,7 @@ function fixIconOpacity (styleJson) {
   })
 }
 
-export async function createVectorTileLayer (url, transformRequest) {
+export async function createVectorTileLayer (url, transformRequest, { renderMode } = {}) {
   const styleJson = await fetchWithTransform(url, 'Style', transformRequest).then(r => r.json())
 
   const sourceId = Object.keys(styleJson.sources)[0]
@@ -93,14 +93,14 @@ export async function createVectorTileLayer (url, transformRequest) {
     projection: CRS,
     tileGrid
   })
-  const layer = new VectorTileLayer({ source, declutter: true, renderMode: 'vector' })
+  const layer = new VectorTileLayer({ source, declutter: true, ...(renderMode && { renderMode }) })
 
   stylefunction(layer, styleJson, sourceId, resolutions, spritesJson, sprite.pngUrl)
 
   return { layer, source }
 }
 
-export async function createOGCVectorTileLayer (url, transformRequest) {
+export async function createOGCVectorTileLayer (url, transformRequest, { renderMode } = {}) {
   const styleJson = await fetchWithTransform(url, 'Style', transformRequest).then(r => r.json())
 
   const sourceId = Object.keys(styleJson.sources)[0]
@@ -125,7 +125,7 @@ export async function createOGCVectorTileLayer (url, transformRequest) {
 
   const tileGrid = new TileGrid({ resolutions, origin, tileSize })
   const source = new OGCVectorTile({ url: tilesUrl, format, tileGrid, projection: CRS })
-  const layer = new VectorTileLayer({ source, declutter: true, renderMode: 'vector' })
+  const layer = new VectorTileLayer({ source, declutter: true, ...(renderMode && { renderMode }) })
 
   stylefunction(layer, styleJson, sourceId, resolutions, spritesJson, sprite.pngUrl)
 

package/providers/beta/openlayers/src/utils/tileLayers.test.js

@@ -201,9 +201,14 @@ describe('createVectorTileLayer', () => {
     expect(tileLoadFunction).toBeUndefined()
   })
 
-  it('creates VectorTileLayer with source, declutter true, and vector renderMode', async () => {
+  it('creates VectorTileLayer with source and declutter true', async () => {
     await createVectorTileLayer(styleUrl, null)
-    expect(VectorTileLayer).toHaveBeenCalledWith({ source: mockVectorTileSourceInstance, declutter: true, renderMode: 'vector' })
+    expect(VectorTileLayer).toHaveBeenCalledWith({ source: mockVectorTileSourceInstance, declutter: true })
+  })
+
+  it('passes renderMode to VectorTileLayer when provided', async () => {
+    await createVectorTileLayer(styleUrl, null, { renderMode: 'vector' })
+    expect(VectorTileLayer).toHaveBeenCalledWith(expect.objectContaining({ renderMode: 'vector' }))
   })
 
   it('applies stylefunction with layer, styleJson, sourceId, resolutions, spritesJson, spritesPngUrl', async () => {