@defra/interactive-map 0.0.50-alpha → 0.0.51-apha

package/plugins/datasets/src/adapters/openlayers/registry/openLayersDataset.test.js

@@ -0,0 +1,262 @@
+import { OpenLayersDataset } from './openLayersDataset.js'
+import { datasetRegistry } from '../../../registry/datasetRegistry.js'
+import { symbolRegistry } from '../../../../../../src/services/symbolRegistry.js'
+import { registerSymbol, clearSymbolImageCache, SYMBOL_RASTER_PIXEL_RATIO } from '../../../../../../providers/beta/openlayers/src/utils/symbolImages.js'
+// Use the mock datasetRegistry with the demo datasets attached before each test
+// so we can test Dataset methods that depend on parent/sublayer relationships and styles
+jest.mock('../../../registry/datasetRegistry.js')
+
+beforeAll(() => {
+  globalThis.Image = class {
+    constructor (w, h) { this.width = w; this.height = h; this._src = '' }
+    get src () { return this._src }
+    set src (val) { this._src = val; this.onload?.() }
+  }
+  HTMLCanvasElement.prototype.getContext = jest.fn(() => ({
+    drawImage: jest.fn(),
+    getImageData: jest.fn((_x, _y, w, h) => ({ width: w, height: h })),
+    putImageData: jest.fn()
+  }))
+  HTMLCanvasElement.prototype.toDataURL = jest.fn(() => 'data:image/png;base64,mock')
+})
+
+describe('OpenLayersDataset', () => {
+  beforeEach(() => {
+    datasetRegistry.attachCreateDataset(def => new OpenLayersDataset(def))
+    datasetRegistry.mockExtend({
+      'ds-fill-only': { id: 'ds-fill-only', style: { fill: 'blue' } },
+      'ds-stroke-only': { id: 'ds-stroke-only', style: { stroke: 'red', strokeWidth: 2 } },
+      'ds-dashed-stroke': { id: 'ds-dashed-stroke', style: { stroke: 'red', strokeDashArray: [4, 2] } },
+      'ds-transparent-fill': { id: 'ds-transparent-fill', style: { fill: 'transparent' } },
+      'ds-bare': { id: 'ds-bare' },
+      'ds-tiles': { id: 'ds-tiles', tiles: ['https://example.com/{z}/{x}/{y}'], minZoom: 5, maxZoom: 15 },
+      'ds-tiles-no-zoom': { id: 'ds-tiles-no-zoom', tiles: ['https://example.com/{z}/{x}/{y}'] },
+      'ds-static-geojson': { id: 'ds-static-geojson', geojson: { type: 'FeatureCollection', features: [] }, style: { fill: 'green' } },
+      'ds-id-prop': { id: 'ds-id-prop', idProperty: 'ref', geojson: { type: 'FeatureCollection', features: [] } },
+      'ds-hf': { id: 'ds-hf', style: { fill: 'blue' }, hiddenFeatures: [1, 2] },
+      'ds-pattern': { id: 'ds-pattern', style: { fillPattern: 'dot', fillPatternForegroundColor: 'red' } },
+      'ds-symbol': { id: 'ds-symbol', style: { symbol: 'pin' } },
+      'ds-symbol-unknown': { id: 'ds-symbol-unknown', style: { symbol: 'not-a-real-symbol' } },
+      'ds-symbol-anchor': { id: 'ds-symbol-anchor', style: { symbol: 'pin', symbolAnchor: [0.5, 1] } },
+      'ds-symbol-filter': { id: 'ds-symbol-filter', style: { symbol: 'pin' }, filter: ['==', ['get', 'type'], 'a'] }
+    })
+    clearSymbolImageCache()
+  })
+
+  describe('leafLayerIds', () => {
+    it('returns [id] for a dataset with a fill', () => {
+      expect(datasetRegistry.getDataset('ds-fill-only').leafLayerIds).toEqual(['ds-fill-only'])
+    })
+
+    it('returns [id] for a dataset with only a stroke', () => {
+      expect(datasetRegistry.getDataset('ds-stroke-only').leafLayerIds).toEqual(['ds-stroke-only'])
+    })
+
+    it('returns [] when fill is transparent and there is no stroke or symbol', () => {
+      expect(datasetRegistry.getDataset('ds-transparent-fill').leafLayerIds).toEqual([])
+    })
+
+    it('returns [] for a dataset with no fill, stroke, or symbol', () => {
+      expect(datasetRegistry.getDataset('ds-bare').leafLayerIds).toEqual([])
+    })
+
+    it('returns [] for a dataset with sublayers', () => {
+      const parentDef = { id: 'parent', sublayerIds: ['child'] }
+      const childDef = { id: 'child', parentId: 'parent', style: { fill: 'blue' } }
+      datasetRegistry.attach({ parent: parentDef, child: childDef })
+      expect(datasetRegistry.getDataset('parent').leafLayerIds).toEqual([])
+    })
+
+    it('returns [id] for a dataset with a symbol', () => {
+      expect(datasetRegistry.getDataset('ds-symbol').leafLayerIds).toEqual(['ds-symbol'])
+    })
+  })
+
+  describe('source', () => {
+    it('returns a vector source descriptor for a tile dataset', () => {
+      expect(datasetRegistry.getDataset('ds-tiles').source).toEqual({
+        type: 'vector',
+        tiles: ['https://example.com/{z}/{x}/{y}'],
+        minzoom: 5,
+        maxzoom: 15
+      })
+    })
+
+    it('falls back to 0/22 for minzoom/maxzoom when zoom is not set', () => {
+      expect(datasetRegistry.getDataset('ds-tiles-no-zoom').source).toEqual({
+        type: 'vector',
+        tiles: ['https://example.com/{z}/{x}/{y}'],
+        minzoom: 0,
+        maxzoom: 22
+      })
+    })
+
+    it('returns a geojson source for a static geojson dataset', () => {
+      const dataset = datasetRegistry.getDataset('ds-static-geojson')
+      expect(dataset.source).toEqual({ type: 'geojson', data: dataset.geojson })
+    })
+
+    it('returns null when there are no tiles and no geojson', () => {
+      expect(datasetRegistry.getDataset('ds-bare').source).toBeNull()
+    })
+  })
+
+  describe('idStrategy', () => {
+    it('returns the idProperty when set', () => {
+      expect(datasetRegistry.getDataset('ds-id-prop').idStrategy).toBe('ref')
+    })
+
+    it('returns null when idProperty is not set', () => {
+      expect(datasetRegistry.getDataset('ds-bare').idStrategy).toBeNull()
+    })
+
+    it('reads idProperty off dynamicGeoJSON, not the dataset itself, for a dynamic dataset', () => {
+      datasetRegistry.mockExtend({
+        'ds-dynamic-id-prop': { id: 'ds-dynamic-id-prop', dynamicGeoJSON: { url: 'https://example.com', idProperty: 'ref' } }
+      })
+      expect(datasetRegistry.getDataset('ds-dynamic-id-prop').idStrategy).toBe('ref')
+    })
+
+    it('returns null for a dynamic dataset with no idProperty on its dynamicGeoJSON config', () => {
+      datasetRegistry.mockExtend({
+        'ds-dynamic-no-id-prop': { id: 'ds-dynamic-no-id-prop', dynamicGeoJSON: { url: 'https://example.com' } }
+      })
+      expect(datasetRegistry.getDataset('ds-dynamic-no-id-prop').idStrategy).toBeNull()
+    })
+  })
+
+  describe('filter (sourceLayer)', () => {
+    // mockExtend rebuilds the whole registry from the demo dataset baseline + whatever's given
+    // here, so this file's own top-level fixtures (e.g. ds-hf) aren't present in this nested
+    // block unless re-declared alongside these — hence ds-geojson-hidden below, rather than
+    // reusing ds-hf, to cover the "no sourceLayer" case.
+    beforeEach(() => {
+      datasetRegistry.mockExtend({
+        'ds-tiles-sourcelayer': { id: 'ds-tiles-sourcelayer', tiles: ['https://example.com/{z}/{x}/{y}'], sourceLayer: 'field_parcels_osgb36', style: { fill: 'blue' } },
+        'ds-tiles-sourcelayer-and-filter': { id: 'ds-tiles-sourcelayer-and-filter', tiles: ['https://example.com/{z}/{x}/{y}'], sourceLayer: 'field_parcels_osgb36', filter: ['==', ['get', 'sbi'], '123'], style: { fill: 'blue' } },
+        'ds-tiles-sourcelayer-hidden': { id: 'ds-tiles-sourcelayer-hidden', tiles: ['https://example.com/{z}/{x}/{y}'], sourceLayer: 'field_parcels_osgb36', hiddenFeatures: [1, 2], style: { fill: 'blue' } },
+        'ds-geojson-hidden': { id: 'ds-geojson-hidden', style: { fill: 'blue' }, hiddenFeatures: [1, 2] }
+      })
+    })
+
+    it('is just the sourceLayer check when there is no own filter or hidden features', () => {
+      expect(datasetRegistry.getDataset('ds-tiles-sourcelayer').filter).toEqual(['==', ['get', 'layer'], 'field_parcels_osgb36'])
+    })
+
+    it('folds the sourceLayer check into an "all" alongside an own filter', () => {
+      expect(datasetRegistry.getDataset('ds-tiles-sourcelayer-and-filter').filter).toEqual([
+        'all',
+        ['==', ['get', 'sbi'], '123'],
+        ['==', ['get', 'layer'], 'field_parcels_osgb36']
+      ])
+    })
+
+    it('folds the sourceLayer check into an "all" alongside a hidden-features filter', () => {
+      expect(datasetRegistry.getDataset('ds-tiles-sourcelayer-hidden').filter).toEqual([
+        'all',
+        ['!', ['in', ['to-string', ['id']], ['literal', ['1', '2']]]],
+        ['==', ['get', 'layer'], 'field_parcels_osgb36']
+      ])
+    })
+
+    it('is unaffected for a dataset with no sourceLayer (geojson)', () => {
+      expect(datasetRegistry.getDataset('ds-geojson-hidden').filter).toEqual(['!', ['in', ['to-string', ['id']], ['literal', ['1', '2']]]])
+    })
+  })
+
+  describe('symbolMeta', () => {
+    it('returns null for a dataset with no symbol', () => {
+      expect(datasetRegistry.getDataset('ds-fill-only').symbolMeta).toBeNull()
+    })
+
+    it('returns null when the style\'s symbol name has no known symbol definition', () => {
+      expect(datasetRegistry.getDataset('ds-symbol-unknown').symbolMeta).toBeNull()
+    })
+
+    it('returns the resolved imageId and anchor for a known symbol, with no registration needed', () => {
+      expect(datasetRegistry.getDataset('ds-symbol').symbolMeta).toEqual({
+        imageId: expect.any(String),
+        anchor: [0.5, 0.9] // pin's own default anchor
+      })
+    })
+
+    it('uses the dataset\'s own symbolAnchor over the symbol definition\'s default', () => {
+      expect(datasetRegistry.getDataset('ds-symbol-anchor').symbolMeta.anchor).toEqual([0.5, 1])
+    })
+  })
+
+  describe('flatStyle', () => {
+    it('returns fill-color for a fill-only dataset', () => {
+      expect(datasetRegistry.getDataset('ds-fill-only').flatStyle).toEqual({ 'fill-color': 'blue' })
+    })
+
+    it('returns stroke-color and stroke-width, defaulting stroke-width to 1', () => {
+      expect(datasetRegistry.getDataset('ds-stroke-only').flatStyle).toEqual({ 'stroke-color': 'red', 'stroke-width': 2 })
+    })
+
+    it('includes stroke-line-dash when strokeDashArray is set', () => {
+      expect(datasetRegistry.getDataset('ds-dashed-stroke').flatStyle).toEqual({
+        'stroke-color': 'red',
+        'stroke-width': 1,
+        'stroke-line-dash': [4, 2]
+      })
+    })
+
+    it('returns an empty style object for a bare dataset', () => {
+      expect(datasetRegistry.getDataset('ds-bare').flatStyle).toEqual({})
+    })
+
+    it('wraps the style in a filter rule when the dataset has hidden features', () => {
+      expect(datasetRegistry.getDataset('ds-hf').flatStyle).toEqual([{
+        filter: ['!', ['in', ['to-string', ['id']], ['literal', ['1', '2']]]],
+        style: { 'fill-color': 'blue' }
+      }])
+    })
+
+    describe('pattern fills', () => {
+      // A pattern fill is built by canvasPatternStyle.js's crisp CanvasPattern-based style
+      // instead (see layerBuilders.js's resolveLayerStyle) — flatStyle never resolves one, and
+      // must not fall back to a meaningless fill-color either (see base Dataset.hasFill, which
+      // is also true for a pattern dataset).
+      it('never sets fill-color or fill-pattern-src for a pattern dataset', () => {
+        expect(datasetRegistry.getDataset('ds-pattern').flatStyle).toEqual({})
+      })
+    })
+
+    describe('symbols', () => {
+      it('has no icon-src before the symbol is registered', () => {
+        // registerSymbol is async and hasn't run yet — flatStyle must never block on it.
+        expect(datasetRegistry.getDataset('ds-symbol').flatStyle).toEqual({})
+      })
+
+      it('uses icon-src, icon-anchor and icon-scale once the symbol is registered', async () => {
+        const dataset = datasetRegistry.getDataset('ds-symbol')
+        await registerSymbol(dataset.style, undefined, symbolRegistry, SYMBOL_RASTER_PIXEL_RATIO)
+        expect(dataset.flatStyle).toEqual({
+          'icon-src': 'data:image/png;base64,mock',
+          'icon-anchor': [0.5, 0.9], // pin's own default anchor
+          'icon-scale': 1 / SYMBOL_RASTER_PIXEL_RATIO
+        })
+      })
+
+      it('uses the dataset\'s own symbolAnchor over the symbol definition\'s default', async () => {
+        const dataset = datasetRegistry.getDataset('ds-symbol-anchor')
+        await registerSymbol(dataset.style, undefined, symbolRegistry, SYMBOL_RASTER_PIXEL_RATIO)
+        expect(dataset.flatStyle['icon-anchor']).toEqual([0.5, 1])
+      })
+
+      it('wraps icon style in a filter rule when the dataset has one', async () => {
+        const dataset = datasetRegistry.getDataset('ds-symbol-filter')
+        await registerSymbol(dataset.style, undefined, symbolRegistry, SYMBOL_RASTER_PIXEL_RATIO)
+        expect(dataset.flatStyle).toEqual([{
+          filter: ['==', ['get', 'type'], 'a'],
+          style: {
+            'icon-src': 'data:image/png;base64,mock',
+            'icon-anchor': [0.5, 0.9],
+            'icon-scale': 1 / SYMBOL_RASTER_PIXEL_RATIO
+          }
+        }])
+      })
+    })
+  })
+})

package/plugins/datasets/src/fetch/createDynamicSource.js

@@ -93,15 +93,15 @@ const mergeFetchedFeatures = (features, data, idProperty) => {
  * Fetch data for the current viewport and merge it into the feature cache.
  * Mutates state.fetchedBbox / state.currentController as a side effect.
  */
-const fetchViewportData = async (state, { map, dynamicGeoJSON, onUpdate }) => {
+const fetchViewportData = async (state, { mapProvider, dynamicGeoJSON, onUpdate }) => {
   const { url: baseUrl, idProperty, transformRequest, maxFeatures, minZoom = 0 } = dynamicGeoJSON
 
-  const zoom = map.getZoom()
+  const zoom = mapProvider.getZoom()
   if (zoom < minZoom) {
     return
   }
 
-  const currentBbox = getBboxArray(map)
+  const currentBbox = getBboxArray(mapProvider)
 
   // Skip if current viewport is already covered
   if (state.fetchedBbox && bboxContains(state.fetchedBbox, currentBbox)) {
@@ -141,15 +141,19 @@ const fetchViewportData = async (state, { map, dynamicGeoJSON, onUpdate }) => {
   }
 }
 
+// mapbox-gl has on()/off(), but OL's Observable only has on()/once()/un() — duck-type the
+// removal call rather than adding a map-provider abstraction just for this one method.
+const offMoveEnd = (map, handler) => (map.off || map.un).call(map, 'moveend', handler)
+
 /**
  * Create a dynamic GeoJSON source that fetches data based on viewport
  * @param {Object} options
  * @param {Object} options.dynamicGeoJSON - dynamicGeoJSON config from the registry dataset
- * @param {Object} options.map - Map instance
+ * @param {Object} options.mapProvider - Map provider instance (e.g. MapLibreProvider/OpenLayersProvider)
  * @param {Function} options.onUpdate - Callback when source data should be updated
  * @returns {Object} { destroy, clear, refresh, getFeatureCount, reapply }
  */
-export const createDynamicSource = ({ dynamicGeoJSON, map, onUpdate }) => {
+export const createDynamicSource = ({ dynamicGeoJSON, mapProvider, onUpdate }) => {
   // state.features: id → { feature, bbox, lastSeenAt }
   const state = {
     features: new Map(),
@@ -157,7 +161,7 @@ export const createDynamicSource = ({ dynamicGeoJSON, map, onUpdate }) => {
     currentController: null
   }
 
-  const fetchData = () => fetchViewportData(state, { map, dynamicGeoJSON, onUpdate })
+  const fetchData = () => fetchViewportData(state, { mapProvider, dynamicGeoJSON, onUpdate })
 
   // Debounced fetch handler
   const debouncedFetch = debounce(fetchData, DEBOUNCE_DELAY)
@@ -167,7 +171,7 @@ export const createDynamicSource = ({ dynamicGeoJSON, map, onUpdate }) => {
     debouncedFetch()
   }
 
-  map.on('moveend', handleMoveEnd)
+  mapProvider.map.on('moveend', handleMoveEnd)
 
   // Initial fetch
   fetchData()
@@ -177,7 +181,7 @@ export const createDynamicSource = ({ dynamicGeoJSON, map, onUpdate }) => {
      * Clean up event listeners and cancel any in-flight request
      */
     destroy () {
-      map.off('moveend', handleMoveEnd)
+      offMoveEnd(mapProvider.map, handleMoveEnd)
       debouncedFetch.cancel()
       if (state.currentController) {
         state.currentController.abort()

package/plugins/datasets/src/fetch/createDynamicSource.test.js

@@ -9,22 +9,19 @@ jest.mock('./fetchGeoJSON.js', () => ({
 
 const DEBOUNCE_DELAY = 200
 
-const makeBounds = ([west, south, east, north]) => ({
-  getWest: () => west,
-  getSouth: () => south,
-  getEast: () => east,
-  getNorth: () => north
-})
-
-// Minimal map stub: tracks a mutable bbox/zoom and the registered moveend handler
-const makeMap = ({ bbox = [-1, -1, 1, 1], zoom = 10 } = {}) => {
+// Minimal mapProvider stub: getBounds()/getZoom() live on the provider (as they do on both
+// MapLibreProvider and OpenLayersProvider), while 'moveend' is subscribed on the raw map —
+// tracks a mutable bbox/zoom and the registered moveend handler.
+const makeMapProvider = ({ bbox = [-1, -1, 1, 1], zoom = 10 } = {}) => {
   const state = { bbox, zoom }
   const handlers = {}
   return {
     getZoom: jest.fn(() => state.zoom),
-    getBounds: jest.fn(() => makeBounds(state.bbox)),
-    on: jest.fn((event, handler) => { handlers[event] = handler }),
-    off: jest.fn(),
+    getBounds: jest.fn(() => state.bbox),
+    map: {
+      on: jest.fn((event, handler) => { handlers[event] = handler }),
+      off: jest.fn()
+    },
     pan (bbox) { state.bbox = bbox },
     fireMoveEnd () { handlers.moveend?.() }
   }
@@ -74,7 +71,7 @@ afterEach(() => {
 
 describe('createDynamicSource', () => {
   it('fetches the initial viewport on creation and pushes features to onUpdate', async () => {
-    const map = makeMap({ bbox: [-1, -1, 1, 1], zoom: 10 })
+    const mapProvider = makeMapProvider({ bbox: [-1, -1, 1, 1], zoom: 10 })
     const onUpdate = jest.fn()
     const dynamicGeoJSON = makeDynamicGeoJSON({ idProperty: 'featureId' })
     const feature = makePointFeature('ignored', [0, 0], { featureId: 'abc' })
@@ -82,7 +79,7 @@ describe('createDynamicSource', () => {
     const featureWithoutIdProperty = makePointFeature('fallback-id', [0, 0])
     fetchGeoJSON.mockResolvedValueOnce(featureCollection([feature, featureWithoutIdProperty]))
 
-    const instance = createDynamicSource({ dynamicGeoJSON, map, onUpdate })
+    const instance = createDynamicSource({ dynamicGeoJSON, mapProvider, onUpdate })
     await flushMicrotasks()
 
     expect(fetchGeoJSON).toHaveBeenCalledWith(
@@ -96,14 +93,14 @@ describe('createDynamicSource', () => {
   })
 
   it('falls back to feature.id when no idProperty is configured, and skips features with no resolvable id', async () => {
-    const map = makeMap()
+    const mapProvider = makeMapProvider()
     const onUpdate = jest.fn()
     const dynamicGeoJSON = makeDynamicGeoJSON()
     const withId = makePointFeature('has-id', [0, 0])
     const withoutId = { type: 'Feature', properties: {}, geometry: { type: 'Point', coordinates: [0, 0] } }
     fetchGeoJSON.mockResolvedValueOnce(featureCollection([withId, withoutId]))
 
-    const instance = createDynamicSource({ dynamicGeoJSON, map, onUpdate })
+    const instance = createDynamicSource({ dynamicGeoJSON, mapProvider, onUpdate })
     await flushMicrotasks()
 
     expect(instance.getFeatureCount()).toBe(1)
@@ -111,46 +108,46 @@ describe('createDynamicSource', () => {
   })
 
   it('skips fetching below minZoom, and destroy() is a no-op with no in-flight request', async () => {
-    const map = makeMap({ zoom: 2 })
+    const mapProvider = makeMapProvider({ zoom: 2 })
     const dynamicGeoJSON = makeDynamicGeoJSON({ minZoom: 5 })
 
-    const instance = createDynamicSource({ dynamicGeoJSON, map, onUpdate: jest.fn() })
+    const instance = createDynamicSource({ dynamicGeoJSON, mapProvider, onUpdate: jest.fn() })
     await flushMicrotasks()
 
     expect(fetchGeoJSON).not.toHaveBeenCalled()
     expect(() => instance.destroy()).not.toThrow()
-    expect(map.off).toHaveBeenCalledWith('moveend', expect.any(Function))
+    expect(mapProvider.map.off).toHaveBeenCalledWith('moveend', expect.any(Function))
   })
 
   it('skips re-fetching when the new viewport is already covered by the last fetch', async () => {
-    const map = makeMap({ bbox: [-1, -1, 1, 1] })
+    const mapProvider = makeMapProvider({ bbox: [-1, -1, 1, 1] })
     const dynamicGeoJSON = makeDynamicGeoJSON()
     fetchGeoJSON.mockResolvedValueOnce(featureCollection([]))
 
-    createDynamicSource({ dynamicGeoJSON, map, onUpdate: jest.fn() })
+    createDynamicSource({ dynamicGeoJSON, mapProvider, onUpdate: jest.fn() })
     await flushMicrotasks()
 
-    map.pan([-0.5, -0.5, 0.5, 0.5]) // fully inside the fetched bbox
-    map.fireMoveEnd()
+    mapProvider.pan([-0.5, -0.5, 0.5, 0.5]) // fully inside the fetched bbox
+    mapProvider.fireMoveEnd()
     await advanceDebounce()
 
     expect(fetchGeoJSON).toHaveBeenCalledTimes(1)
   })
 
   it('debounces rapid map movement into a single re-fetch', async () => {
-    const map = makeMap({ bbox: [-1, -1, 1, 1] })
+    const mapProvider = makeMapProvider({ bbox: [-1, -1, 1, 1] })
     const dynamicGeoJSON = makeDynamicGeoJSON()
     fetchGeoJSON.mockResolvedValue(featureCollection([]))
 
-    createDynamicSource({ dynamicGeoJSON, map, onUpdate: jest.fn() })
+    createDynamicSource({ dynamicGeoJSON, mapProvider, onUpdate: jest.fn() })
     await flushMicrotasks()
 
-    map.pan([10, 10, 12, 12])
-    map.fireMoveEnd()
+    mapProvider.pan([10, 10, 12, 12])
+    mapProvider.fireMoveEnd()
     jest.advanceTimersByTime(50)
-    map.fireMoveEnd()
+    mapProvider.fireMoveEnd()
     jest.advanceTimersByTime(50)
-    map.fireMoveEnd()
+    mapProvider.fireMoveEnd()
     await advanceDebounce()
 
     expect(fetchGeoJSON).toHaveBeenCalledTimes(2) // initial + one debounced re-fetch
@@ -159,16 +156,16 @@ describe('createDynamicSource', () => {
   it('aborts the previous in-flight request when a new viewport is fetched before it resolves', async () => {
     let resolveFirst
     fetchGeoJSON.mockImplementationOnce(() => new Promise((resolve) => { resolveFirst = resolve }))
-    const map = makeMap({ bbox: [-1, -1, 1, 1] })
+    const mapProvider = makeMapProvider({ bbox: [-1, -1, 1, 1] })
 
-    createDynamicSource({ dynamicGeoJSON: makeDynamicGeoJSON(), map, onUpdate: jest.fn() })
+    createDynamicSource({ dynamicGeoJSON: makeDynamicGeoJSON(), mapProvider, onUpdate: jest.fn() })
     await flushMicrotasks()
     const firstSignal = fetchGeoJSON.mock.calls[0][3]
     expect(firstSignal.aborted).toBe(false)
 
     fetchGeoJSON.mockResolvedValueOnce(featureCollection([]))
-    map.pan([10, 10, 12, 12])
-    map.fireMoveEnd()
+    mapProvider.pan([10, 10, 12, 12])
+    mapProvider.fireMoveEnd()
     await advanceDebounce()
 
     expect(firstSignal.aborted).toBe(true)
@@ -176,11 +173,11 @@ describe('createDynamicSource', () => {
   })
 
   it('evicts least-recently-seen features once over the maxFeatures threshold, out-of-view first then in-view', async () => {
-    const map = makeMap({ bbox: [-1, -1, 1, 1] })
+    const mapProvider = makeMapProvider({ bbox: [-1, -1, 1, 1] })
     const dynamicGeoJSON = makeDynamicGeoJSON({ maxFeatures: 1 })
     fetchGeoJSON.mockResolvedValueOnce(featureCollection([makePointFeature('a', [0, 0])]))
 
-    const instance = createDynamicSource({ dynamicGeoJSON, map, onUpdate: jest.fn() })
+    const instance = createDynamicSource({ dynamicGeoJSON, mapProvider, onUpdate: jest.fn() })
     await flushMicrotasks()
     expect(instance.getFeatureCount()).toBe(1) // under threshold (1 <= 1 * 1.2), no eviction yet
 
@@ -188,8 +185,8 @@ describe('createDynamicSource', () => {
     // Evicting the single out-of-view feature ('a') alone reaches the target, so the
     // in-view eviction pass is skipped.
     fetchGeoJSON.mockResolvedValueOnce(featureCollection([makePointFeature('b', [10, 10])]))
-    map.pan([10, 10, 12, 12])
-    map.fireMoveEnd()
+    mapProvider.pan([10, 10, 12, 12])
+    mapProvider.fireMoveEnd()
     await advanceDebounce()
     expect(instance.getFeatureCount()).toBe(1)
 
@@ -200,29 +197,29 @@ describe('createDynamicSource', () => {
       makePointFeature('c', [20, 20]),
       makePointFeature('d', [21, 21])
     ]))
-    map.pan([20, 20, 22, 22])
-    map.fireMoveEnd()
+    mapProvider.pan([20, 20, 22, 22])
+    mapProvider.fireMoveEnd()
     await advanceDebounce()
     expect(instance.getFeatureCount()).toBe(1)
   })
 
   it('sorts multiple out-of-view features by lastSeenAt when evicting', async () => {
-    const map = makeMap({ bbox: [-1, -1, 1, 1] })
+    const mapProvider = makeMapProvider({ bbox: [-1, -1, 1, 1] })
     const dynamicGeoJSON = makeDynamicGeoJSON({ maxFeatures: 2 })
     fetchGeoJSON.mockResolvedValueOnce(featureCollection([
       makePointFeature('a', [0, 0]),
       makePointFeature('b', [0.5, 0.5])
     ]))
 
-    const instance = createDynamicSource({ dynamicGeoJSON, map, onUpdate: jest.fn() })
+    const instance = createDynamicSource({ dynamicGeoJSON, mapProvider, onUpdate: jest.fn() })
     await flushMicrotasks()
     expect(instance.getFeatureCount()).toBe(2) // under threshold (2 <= 2 * 1.2), no eviction yet
 
     // New viewport, far from 'a' and 'b': both become out-of-view at once, exercising the
     // out-of-view sort-by-lastSeenAt comparator (a no-op array has nothing to compare)
     fetchGeoJSON.mockResolvedValueOnce(featureCollection([makePointFeature('c', [10, 10])]))
-    map.pan([10, 10, 12, 12])
-    map.fireMoveEnd()
+    mapProvider.pan([10, 10, 12, 12])
+    mapProvider.fireMoveEnd()
     await advanceDebounce()
 
     expect(instance.getFeatureCount()).toBe(2) // one of a/b evicted, 'c' kept
@@ -233,7 +230,7 @@ describe('createDynamicSource', () => {
     fetchGeoJSON.mockRejectedValueOnce(error)
     const onUpdate = jest.fn()
 
-    createDynamicSource({ dynamicGeoJSON: makeDynamicGeoJSON(), map: makeMap(), onUpdate })
+    createDynamicSource({ dynamicGeoJSON: makeDynamicGeoJSON(), mapProvider: makeMapProvider(), onUpdate })
     await flushMicrotasks()
 
     expect(console.error).not.toHaveBeenCalled()
@@ -244,7 +241,7 @@ describe('createDynamicSource', () => {
     const error = new Error('network down')
     fetchGeoJSON.mockRejectedValueOnce(error)
 
-    createDynamicSource({ dynamicGeoJSON: makeDynamicGeoJSON(), map: makeMap(), onUpdate: jest.fn() })
+    createDynamicSource({ dynamicGeoJSON: makeDynamicGeoJSON(), mapProvider: makeMapProvider(), onUpdate: jest.fn() })
     await flushMicrotasks()
 
     expect(console.error).toHaveBeenCalledWith(
@@ -255,27 +252,39 @@ describe('createDynamicSource', () => {
 
   it('destroy() unregisters moveend, cancels the pending debounce, and aborts the in-flight request', async () => {
     fetchGeoJSON.mockImplementationOnce(() => new Promise(() => {})) // never resolves
-    const map = makeMap()
+    const mapProvider = makeMapProvider()
 
-    const instance = createDynamicSource({ dynamicGeoJSON: makeDynamicGeoJSON(), map, onUpdate: jest.fn() })
+    const instance = createDynamicSource({ dynamicGeoJSON: makeDynamicGeoJSON(), mapProvider, onUpdate: jest.fn() })
     await flushMicrotasks()
     const signal = fetchGeoJSON.mock.calls[0][3]
 
-    map.fireMoveEnd() // schedule a debounced re-fetch
+    mapProvider.fireMoveEnd() // schedule a debounced re-fetch
     instance.destroy()
 
-    expect(map.off).toHaveBeenCalledWith('moveend', expect.any(Function))
+    expect(mapProvider.map.off).toHaveBeenCalledWith('moveend', expect.any(Function))
     expect(signal.aborted).toBe(true)
 
     await advanceDebounce()
     expect(fetchGeoJSON).toHaveBeenCalledTimes(1) // debounced call never fired
   })
 
+  it('unregisters moveend via un() when the raw map has no off() (OpenLayers)', async () => {
+    const mapProvider = makeMapProvider()
+    mapProvider.map.un = jest.fn()
+    delete mapProvider.map.off
+
+    const instance = createDynamicSource({ dynamicGeoJSON: makeDynamicGeoJSON(), mapProvider, onUpdate: jest.fn() })
+    await flushMicrotasks()
+    instance.destroy()
+
+    expect(mapProvider.map.un).toHaveBeenCalledWith('moveend', expect.any(Function))
+  })
+
   it('clear() empties the cache and pushes an empty FeatureCollection', async () => {
     const onUpdate = jest.fn()
     fetchGeoJSON.mockResolvedValueOnce(featureCollection([makePointFeature('a', [0, 0])]))
 
-    const instance = createDynamicSource({ dynamicGeoJSON: makeDynamicGeoJSON(), map: makeMap(), onUpdate })
+    const instance = createDynamicSource({ dynamicGeoJSON: makeDynamicGeoJSON(), mapProvider: makeMapProvider(), onUpdate })
     await flushMicrotasks()
 
     instance.clear()
@@ -286,7 +295,7 @@ describe('createDynamicSource', () => {
 
   it('refresh() clears the cache and re-fetches the current viewport', async () => {
     fetchGeoJSON.mockResolvedValueOnce(featureCollection([makePointFeature('a', [0, 0])]))
-    const instance = createDynamicSource({ dynamicGeoJSON: makeDynamicGeoJSON(), map: makeMap(), onUpdate: jest.fn() })
+    const instance = createDynamicSource({ dynamicGeoJSON: makeDynamicGeoJSON(), mapProvider: makeMapProvider(), onUpdate: jest.fn() })
     await flushMicrotasks()
 
     fetchGeoJSON.mockResolvedValueOnce(featureCollection([makePointFeature('b', [0, 0])]))
@@ -302,7 +311,7 @@ describe('createDynamicSource', () => {
     const feature = makePointFeature('a', [0, 0])
     fetchGeoJSON.mockResolvedValueOnce(featureCollection([feature]))
 
-    const instance = createDynamicSource({ dynamicGeoJSON: makeDynamicGeoJSON(), map: makeMap(), onUpdate })
+    const instance = createDynamicSource({ dynamicGeoJSON: makeDynamicGeoJSON(), mapProvider: makeMapProvider(), onUpdate })
     await flushMicrotasks()
     onUpdate.mockClear()
 

package/plugins/datasets/src/initialise/DatasetsInit.jsx

@@ -71,7 +71,19 @@ export function DatasetsInit ({ pluginConfig, pluginState, appState, mapState, m
   useEffect(() => {
     datasetRegistry.attachMapStyle(mapState.mapStyle)
     if (layerAdapter?.onMapStyleChange) {
-      layerAdapter.onMapStyleChange()
+      // MapLibre's own map.addImage()/setPaintProperty() calls (made while re-registering
+      // symbols/patterns below) naturally re-trigger MAP_DATA_CHANGE via the GL engine's own
+      // styledata event — nothing extra needed there. OL has no such generic signal (its
+      // MAP_DATA_CHANGE is tied only to the basemap tile source's own tileloadend — see
+      // providers/beta/openlayers/src/appEvents.js's comment), so re-registering a symbol on a
+      // plain ol/layer/Vector never fires it. Emitting it explicitly once re-registration
+      // genuinely finishes lets the interact plugin's settle-window re-apply (armed by
+      // MAP_STYLE_CHANGE, see useHighlightSync.js) pick up the new theme's selected/active
+      // symbol images, instead of a highlight staying stuck on whatever was cached moments
+      // before the switch.
+      Promise.resolve(layerAdapter.onMapStyleChange()).then(() => {
+        eventBus.emit(EVENTS.MAP_DATA_CHANGE)
+      })
     }
   },
   [mapState.mapStyle])