@defra/interactive-map 0.0.40-alpha → 0.0.42-alpha

package/plugins/draw/src/adapters/openlayers/point/pointOps.js

@@ -0,0 +1,34 @@
+/**
+ * Coordinate mutation for edit_point. A Point has one coordinate, always selected — no
+ * ring/segment bookkeeping the way edit/undoOps.js and edit/vertexOps.js need for a
+ * Polygon/LineString. movePoint's (olFeature, _index, coord) signature matches
+ * edit/vertexOps.js's moveVertex exactly (the unused index is only there so nudge.js/
+ * touchHandler.js can call either interchangeably via the injected moveCoord parameter).
+ */
+
+/** Signature-compatible with edit/vertexOps.js's moveVertex — _index is unused, a Point has none. */
+export const movePoint = (olFeature, _index, coord) => {
+  olFeature.getGeometry().setCoordinates([...coord])
+}
+
+// Op type stays 'move_vertex' (not 'move_point') — deriveModifyOp (edit/modifyInteraction.js,
+// reused unchanged) always produces that type, and keeping it lets applyPointUndo below mirror
+// edit/undoOps.js's applyUndo dispatch pattern with the shared leaf handlers' onVertexMoved
+// callbacks (which push {type: 'move_vertex', ...}) working completely unmodified.
+export const undoMovePoint = (olFeature, op) => {
+  const { previousCoord } = op
+  olFeature.getGeometry().setCoordinates([...previousCoord])
+  return 0
+}
+
+/**
+ * Dispatch the correct undo handler based on operation type — mirrors edit/undoOps.js's
+ * applyUndo, but with the single op type a Point ever produces.
+ * @returns {number} vertex index to re-select after undo (always 0), or -1 for none
+ */
+export const applyPointUndo = (olFeature, op) => {
+  if (op.type === 'move_vertex') {
+    return undoMovePoint(olFeature, op)
+  }
+  return -1
+}

package/plugins/draw/src/adapters/openlayers/point/pointOps.test.js

@@ -0,0 +1,32 @@
+import { movePoint, undoMovePoint, applyPointUndo } from './pointOps.js'
+import { pointFeature } from '../__helpers__/harness.js'
+
+describe('movePoint', () => {
+  test('writes the coordinate directly, ignoring the unused index', () => {
+    const feature = pointFeature([0, 0])
+    movePoint(feature, 0, [5, 5])
+    expect(feature.getGeometry().getCoordinates()).toEqual([5, 5])
+  })
+})
+
+describe('undoMovePoint', () => {
+  test('restores the previous coordinate and returns vertex index 0', () => {
+    const feature = pointFeature([5, 5])
+    expect(undoMovePoint(feature, { previousCoord: [1, 2] })).toBe(0)
+    expect(feature.getGeometry().getCoordinates()).toEqual([1, 2])
+  })
+})
+
+describe('applyPointUndo', () => {
+  test('dispatches move_vertex to undoMovePoint', () => {
+    const feature = pointFeature([5, 5])
+    expect(applyPointUndo(feature, { type: 'move_vertex', previousCoord: [3, 4] })).toBe(0)
+    expect(feature.getGeometry().getCoordinates()).toEqual([3, 4])
+  })
+
+  test('returns -1 for an unknown operation type', () => {
+    const feature = pointFeature([5, 5])
+    expect(applyPointUndo(feature, { type: 'unknown' })).toBe(-1)
+    expect(feature.getGeometry().getCoordinates()).toEqual([5, 5])
+  })
+})

package/plugins/draw/src/adapters/openlayers/point/pointSelectionState.js

@@ -0,0 +1,82 @@
+import { ADAPTER_EVENTS } from '../../../adapterEvents.js'
+
+// Deferred commit-level geometrychange emitter (feature + change phase + vertex index)
+// consumed by the validation layer — copied from edit/selectionState.js's own (identical
+// shape, no ring dependency to strip).
+const createGeometryValidationEmitter = (manager, store, olFeature) => (phase, vertexIndex) => {
+  if (!phase) { return }
+  setTimeout(() => {
+    manager.emit(ADAPTER_EVENTS.GEOMETRY_CHANGE, { feature: store.toGeoJSON(olFeature), phase, vertexIndex })
+  }, 0)
+}
+
+/**
+ * Mutable edit_point state, matching edit/selectionState.js's public surface
+ * ({state, getState, setState, syncGeom, emitGeometryValidation, setHooks, destroy}) closely
+ * enough that edit/modifyInteraction.js, edit/touchHandler.js and edit/keyboardHandler.js all
+ * run over it unmodified (beyond the moveCoord injection) — but a point has one coordinate,
+ * always selected, and no ring/midpoint list to navigate, so this is a standalone
+ * implementation rather than a wrapper around the ring-shaped one. No handle layer to keep in
+ * step either — the point's own symbol icon is the only visual, styled by the draw layer.
+ *
+ * @param {{ manager, store, olFeature, interfaceType }} options
+ * @returns {{ state, getState, setState, syncGeom, emitGeometryValidation, setHooks, destroy }}
+ */
+export const createPointSelectionState = ({ manager, store, olFeature, interfaceType }) => {
+  const state = {
+    olFeature,
+    selectedVertexIndex: 0,
+    selectedVertexType: 'vertex',
+    vertices: [],
+    midpoints: [],
+    interfaceType: interfaceType ?? 'mouse'
+  }
+
+  const hooks = { onUpdate: null }
+  const setHooks = ({ onUpdate }) => { hooks.onUpdate = onUpdate }
+
+  const refreshCoord = () => {
+    state.vertices = [olFeature.getGeometry().getCoordinates()]
+  }
+
+  // The point is always selected — a selectedVertexIndex/Type write (e.g. Escape or
+  // Alt+Arrow in the reused edit/keyboardHandler.js, which try to deselect/navigate) is
+  // silently dropped rather than stranding the point with no selection. Every other update
+  // (interfaceType, vertices) still applies normally.
+  const setState = (updates) => {
+    const { selectedVertexIndex, selectedVertexType, ...rest } = updates
+    Object.assign(state, rest)
+    if (updates.vertices !== undefined) {
+      hooks.onUpdate?.()
+    }
+  }
+
+  // Never emits VERTEX_CHANGE — that event unconditionally releases
+  // mapProvider.activeMoveTarget (events.js's onVertexChange). The D-pad claim is made once
+  // below (VERTEX_SELECTION) and held for the whole edit session.
+  const syncGeom = () => {
+    refreshCoord()
+    manager.emit(ADAPTER_EVENTS.UPDATE, store.toGeoJSON(olFeature))
+  }
+
+  const emitGeometryValidation = createGeometryValidationEmitter(manager, store, olFeature)
+
+  // Keeps the cached coordinate in sync on every geometry change (e.g. during a Modify drag)
+  const onGeometryChange = () => refreshCoord()
+  olFeature.getGeometry().on('change', onGeometryChange)
+
+  refreshCoord()
+  manager.emit(ADAPTER_EVENTS.VERTEX_SELECTION, { index: 0, numVertices: 1 })
+
+  return {
+    state,
+    getState: () => state,
+    setState,
+    syncGeom,
+    emitGeometryValidation,
+    setHooks,
+    destroy () {
+      olFeature.getGeometry().un('change', onGeometryChange)
+    }
+  }
+}

package/plugins/draw/src/adapters/openlayers/point/pointSelectionState.test.js

@@ -0,0 +1,107 @@
+import { createPointSelectionState } from './pointSelectionState.js'
+import { createFakeManager, pointFeature } from '../__helpers__/harness.js'
+import { ADAPTER_EVENTS } from '../../../adapterEvents.js'
+
+const setup = (interfaceType) => {
+  const manager = createFakeManager()
+  const olFeature = pointFeature([5, 5])
+  const store = { toGeoJSON: jest.fn(() => ({ id: 'f1' })) }
+  const selection = createPointSelectionState({ manager, store, olFeature, interfaceType })
+  return { manager, olFeature, store, selection }
+}
+
+test('getState returns the live state object', () => {
+  const { selection } = setup()
+  expect(selection.getState()).toBe(selection.state)
+})
+
+test('defaults to mouse interface when none is given, and is always selected at index 0', () => {
+  const { selection } = setup()
+  expect(selection.state.interfaceType).toBe('mouse')
+  expect(selection.state.selectedVertexIndex).toBe(0)
+  expect(selection.state.selectedVertexType).toBe('vertex')
+  expect(setup('touch').selection.state.interfaceType).toBe('touch')
+})
+
+test('claims the D-pad exactly once at construction, never VERTEX_CHANGE', () => {
+  const { manager } = setup()
+  expect(manager.emit).toHaveBeenCalledWith(ADAPTER_EVENTS.VERTEX_SELECTION, { index: 0, numVertices: 1 })
+  expect(manager.emit).not.toHaveBeenCalledWith(ADAPTER_EVENTS.VERTEX_CHANGE, expect.anything())
+})
+
+test('populates the initial coordinate at construction', () => {
+  const { selection } = setup()
+  expect(selection.state.vertices).toEqual([[5, 5]])
+})
+
+test('a selectedVertexIndex/Type write is silently dropped — the point stays always-selected', () => {
+  const { selection, manager } = setup()
+  manager.emit.mockClear()
+  selection.setState({ selectedVertexIndex: -1, selectedVertexType: null })
+  expect(selection.state.selectedVertexIndex).toBe(0)
+  expect(selection.state.selectedVertexType).toBe('vertex')
+  expect(manager.emit).not.toHaveBeenCalledWith(ADAPTER_EVENTS.VERTEX_SELECTION, expect.anything())
+})
+
+test('other setState updates apply normally, without firing onUpdate unless vertices changes', () => {
+  const { selection } = setup()
+  const onUpdate = jest.fn()
+  selection.setHooks({ onUpdate })
+  selection.setState({ interfaceType: 'keyboard' })
+  expect(selection.state.interfaceType).toBe('keyboard')
+  expect(onUpdate).not.toHaveBeenCalled()
+})
+
+test('a vertices update fires the onUpdate hook', () => {
+  const { selection } = setup()
+  const onUpdate = jest.fn()
+  selection.setHooks({ onUpdate })
+  selection.setState({ vertices: [[9, 9]] })
+  expect(onUpdate).toHaveBeenCalled()
+})
+
+test('syncGeom derives the coordinate from the geometry and emits UPDATE only (never VERTEX_CHANGE)', () => {
+  const { selection, manager, store, olFeature } = setup()
+  manager.emit.mockClear()
+  olFeature.getGeometry().setCoordinates([7, 8])
+  selection.syncGeom()
+  expect(selection.state.vertices).toEqual([[7, 8]])
+  expect(manager.emit).toHaveBeenCalledWith(ADAPTER_EVENTS.UPDATE, store.toGeoJSON())
+  expect(manager.emit).not.toHaveBeenCalledWith(ADAPTER_EVENTS.VERTEX_CHANGE, expect.anything())
+})
+
+test('emitGeometryValidation emits a deferred commit-level geometrychange with the change phase', () => {
+  jest.useFakeTimers()
+  const { selection, manager, store } = setup()
+  manager.emit.mockClear()
+
+  selection.emitGeometryValidation('commit-move', 0)
+  expect(manager.emit).not.toHaveBeenCalledWith(ADAPTER_EVENTS.GEOMETRY_CHANGE, expect.anything())
+
+  jest.runAllTimers()
+  expect(manager.emit).toHaveBeenCalledWith(ADAPTER_EVENTS.GEOMETRY_CHANGE, {
+    feature: store.toGeoJSON(),
+    phase: 'commit-move',
+    vertexIndex: 0
+  })
+  jest.useRealTimers()
+})
+
+test('emitGeometryValidation is a no-op without a change phase', () => {
+  jest.useFakeTimers()
+  const { selection, manager } = setup()
+  manager.emit.mockClear()
+  selection.emitGeometryValidation(undefined, 0)
+  jest.runAllTimers()
+  expect(manager.emit).not.toHaveBeenCalledWith(ADAPTER_EVENTS.GEOMETRY_CHANGE, expect.anything())
+  jest.useRealTimers()
+})
+
+test('geometry changes refresh the cached coordinate until destroy unbinds the listener', () => {
+  const { selection, olFeature } = setup()
+  olFeature.getGeometry().setCoordinates([20, 20])
+  expect(selection.state.vertices).toEqual([[20, 20]])
+  selection.destroy()
+  olFeature.getGeometry().setCoordinates([30, 30])
+  expect(selection.state.vertices).toEqual([[20, 20]])
+})

package/plugins/draw/src/adapters/openlayers/point/pointSymbolImages.js

@@ -0,0 +1,83 @@
+import { symbolRegistry } from '../../../../../../src/services/symbolRegistry.js'
+import { getOrCreateSymbolImage } from '../../../../../../providers/beta/openlayers/src/utils/symbolImages.js'
+
+/**
+ * Resolves a drawn point's symbol-config icon and writes the resolved image id back onto the
+ * OL feature, so core/styles.js's createFeatureStyle() can render it via an ol/style/Icon.
+ * Also resolves and caches the 'active'/'selected' variants as symbolActiveImageId/
+ * symbolSelectedImageId, read directly by highlightFeatures.js's selection overlay.
+ */
+
+const VARIANTS = ['normal', 'active', 'selected']
+const PROPERTY_FOR_VARIANT = { normal: 'symbolImageId', active: 'symbolActiveImageId', selected: 'symbolSelectedImageId' }
+
+export const hasSymbolStyle = (properties) => !!(properties?.symbol || properties?.symbolSvgContent)
+
+// Combines the browser's native devicePixelRatio with this app's own map-size scale factor
+// (mapProvider.drawScale), matching MapController.jsx's construction-time formula.
+export const getPixelRatio = (mapProvider) => (globalThis.devicePixelRatio || 1) * (mapProvider?.drawScale ?? 1)
+
+/**
+ * Resolve one point feature's symbol image and write it back onto the feature.
+ * A no-op for points with no symbol config (nothing to render as an icon).
+ *
+ * @param {Object} params
+ * @param {Object} params.manager - OLDrawManager (needs store.source, mapStyle)
+ * @param {Object} params.mapProvider
+ * @param {import('ol/Feature.js').default} params.olFeature
+ * @returns {Promise<void>}
+ */
+export const resolvePointSymbol = async ({ manager, mapProvider, olFeature }) => {
+  const properties = olFeature.getProperties()
+  if (!hasSymbolStyle(properties)) {
+    return
+  }
+
+  const pixelRatio = getPixelRatio(mapProvider)
+
+  try {
+    const results = await Promise.all(
+      VARIANTS.map((variant) => symbolRegistry.rasteriseSymbolImage(properties, manager.mapStyle, variant, pixelRatio))
+    )
+    // All three variants resolve from the same symbol config, so either all succeed or (an
+    // unresolvable symbol id) all fail together — gating on 'normal' alone is enough.
+    if (!results[0]) {
+      return
+    }
+
+    // The feature may have been deleted/cancelled while rasterising was in flight.
+    if (!manager.store.source.hasFeature(olFeature)) {
+      return
+    }
+    VARIANTS.forEach((variant, i) => {
+      const result = results[i]
+      if (!result) { return }
+      getOrCreateSymbolImage(result.imageId, result.imageData)
+      olFeature.set(PROPERTY_FOR_VARIANT[variant], result.imageId)
+    })
+    // ol/style/Icon draws its source canvas at native pixel size — core/styles.js reads this
+    // back to apply `scale: 1 / symbolPixelRatio`, correcting for the canvas being rasterised
+    // at pixelRatio device pixels for crispness.
+    olFeature.set('symbolPixelRatio', pixelRatio)
+  } catch (err) {
+    // A silent failure here means a point simply never gets/keeps an icon, with nothing in
+    // the UI to explain why — surface it instead of letting the rejection vanish.
+    console.error('[draw] failed to resolve point symbol', olFeature.getId(), err) // NOSONAR
+  }
+}
+
+/**
+ * Re-resolve every existing drawn point's symbol — called on map style/size change, since
+ * the rasterised image (colours, and pixel-ratio-scaled dimensions) depends on both.
+ *
+ * @param {Object} params
+ * @param {Object} params.manager
+ * @param {Object} params.mapProvider
+ * @returns {Promise<void>}
+ */
+export const refreshAllPointSymbols = ({ manager, mapProvider }) => {
+  const points = manager.store.source.getFeatures().filter(
+    (f) => f.getGeometry()?.getType() === 'Point' && hasSymbolStyle(f.getProperties())
+  )
+  return Promise.all(points.map((olFeature) => resolvePointSymbol({ manager, mapProvider, olFeature })))
+}

package/plugins/draw/src/adapters/openlayers/point/pointSymbolImages.test.js

@@ -0,0 +1,214 @@
+import { hasSymbolStyle, getPixelRatio, resolvePointSymbol, refreshAllPointSymbols } from './pointSymbolImages.js'
+import { symbolRegistry } from '../../../../../../src/services/symbolRegistry.js'
+import { getCachedSymbolImage, clearSymbolImageCache } from '../../../../../../providers/beta/openlayers/src/utils/symbolImages.js'
+
+const mapStyle = { id: 'outdoor', mapColorScheme: 'light' }
+
+const createMapProvider = ({ drawScale = 1 } = {}) => ({ drawScale })
+
+// A minimal ol.Feature stand-in — resolvePointSymbol only ever calls
+// getProperties()/set() on it, and manager.store.source.hasFeature() to check liveness.
+const createOlFeature = (properties) => {
+  const props = { ...properties }
+  return {
+    getProperties: () => props,
+    set: jest.fn((key, value) => { props[key] = value })
+  }
+}
+
+const createManager = ({ features = [] } = {}) => ({
+  mapStyle,
+  store: {
+    source: {
+      hasFeature: jest.fn((f) => features.includes(f)),
+      getFeatures: jest.fn(() => features)
+    }
+  }
+})
+
+// symbolRegistry.rasteriseSymbolImage() draws an SVG through a real `new Image()`/onload
+// round-trip that jsdom never resolves — every other test file touching it (e.g. the
+// MapLibre adapter's pointSymbolImages.test.js) instead lets a mocked provider call
+// (addSymbolsToMap) stand in for it. This adapter calls rasteriseSymbolImage directly (it
+// *is* the last-mile pipeline, with no provider-level call to mock instead), so it's stubbed
+// here with a fake resolved ImageData keyed to the properties/pixelRatio, matching
+// getSymbolImageId's own id shape closely enough for assertions to key off it.
+const stubRasterise = () => jest.spyOn(symbolRegistry, 'rasteriseSymbolImage')
+  .mockImplementation(async (style, ms, variant, pixelRatio) => ({
+    // variant folded into the id (mirroring the real act-/sel- prefixing) so normal/active/
+    // selected resolve to distinct ids, the way real symbol configs do.
+    imageId: `${variant}-${symbolRegistry.getSymbolImageId(style, ms, false, pixelRatio)}`,
+    imageData: { width: 10, height: 10 }
+  }))
+
+beforeEach(() => {
+  clearSymbolImageCache()
+  HTMLCanvasElement.prototype.getContext = jest.fn(function () {
+    this._ctx ??= { putImageData: jest.fn() }
+    return this._ctx
+  })
+  stubRasterise()
+})
+
+afterEach(() => jest.restoreAllMocks())
+
+describe('hasSymbolStyle', () => {
+  it('is true when symbol is set', () => {
+    expect(hasSymbolStyle({ symbol: 'pin' })).toBe(true)
+  })
+
+  it('is true when symbolSvgContent is set', () => {
+    expect(hasSymbolStyle({ symbolSvgContent: '<path/>' })).toBe(true)
+  })
+
+  it('is false with neither, or no properties at all', () => {
+    expect(hasSymbolStyle({})).toBe(false)
+    expect(hasSymbolStyle(undefined)).toBe(false)
+  })
+})
+
+describe('getPixelRatio', () => {
+  it('combines devicePixelRatio and mapProvider.drawScale', () => {
+    const restore = globalThis.devicePixelRatio
+    globalThis.devicePixelRatio = 2
+    expect(getPixelRatio(createMapProvider({ drawScale: 1.5 }))).toBe(3)
+    globalThis.devicePixelRatio = restore
+  })
+
+  it('falls back to 1 for either factor when unset', () => {
+    const restore = globalThis.devicePixelRatio
+    delete globalThis.devicePixelRatio
+    expect(getPixelRatio(createMapProvider({ drawScale: undefined }))).toBe(1)
+    expect(getPixelRatio(undefined)).toBe(1)
+    globalThis.devicePixelRatio = restore
+  })
+})
+
+describe('resolvePointSymbol', () => {
+  it('does nothing for a feature with no symbol config', async () => {
+    const olFeature = createOlFeature({})
+    const manager = createManager()
+    await resolvePointSymbol({ manager, mapProvider: createMapProvider(), olFeature })
+    expect(olFeature.set).not.toHaveBeenCalled()
+  })
+
+  it('rasterises, caches the canvas and writes symbolImageId/symbolPixelRatio back onto the feature', async () => {
+    const properties = { symbol: 'pin' }
+    const olFeature = createOlFeature(properties)
+    const manager = createManager({ features: [olFeature] })
+    const mapProvider = createMapProvider({ drawScale: 2 })
+
+    await resolvePointSymbol({ manager, mapProvider, olFeature })
+
+    const pixelRatio = getPixelRatio(mapProvider)
+    const baseId = symbolRegistry.getSymbolImageId(properties, mapStyle, false, pixelRatio)
+    expect(olFeature.set).toHaveBeenCalledWith('symbolImageId', `normal-${baseId}`)
+    // symbolPixelRatio is what core/styles.js later uses to scale the (pixelRatio×-oversized)
+    // cached canvas back down to its intended CSS display size.
+    expect(olFeature.set).toHaveBeenCalledWith('symbolPixelRatio', pixelRatio)
+    expect(getCachedSymbolImage(`normal-${baseId}`)).toBeInstanceOf(HTMLCanvasElement)
+  })
+
+  it('also rasterises, caches and writes the active/selected variants — one image id each, keyed to the same symbol config', async () => {
+    const properties = { symbol: 'pin' }
+    const olFeature = createOlFeature(properties)
+    const manager = createManager({ features: [olFeature] })
+    const mapProvider = createMapProvider()
+
+    await resolvePointSymbol({ manager, mapProvider, olFeature })
+
+    const pixelRatio = getPixelRatio(mapProvider)
+    const baseId = symbolRegistry.getSymbolImageId(properties, mapStyle, false, pixelRatio)
+    expect(olFeature.set).toHaveBeenCalledWith('symbolActiveImageId', `active-${baseId}`)
+    expect(olFeature.set).toHaveBeenCalledWith('symbolSelectedImageId', `selected-${baseId}`)
+    expect(getCachedSymbolImage(`active-${baseId}`)).toBeInstanceOf(HTMLCanvasElement)
+    expect(getCachedSymbolImage(`selected-${baseId}`)).toBeInstanceOf(HTMLCanvasElement)
+    // objectContaining, not the exact `properties` object — resolvePointSymbol's own
+    // property-write calls mutate that same (by-reference) object in place afterwards, and
+    // jest's mock.calls records the reference, not a snapshot at call time.
+    const symbolMatch = expect.objectContaining({ symbol: 'pin' })
+    expect(symbolRegistry.rasteriseSymbolImage).toHaveBeenCalledWith(symbolMatch, mapStyle, 'normal', pixelRatio)
+    expect(symbolRegistry.rasteriseSymbolImage).toHaveBeenCalledWith(symbolMatch, mapStyle, 'active', pixelRatio)
+    expect(symbolRegistry.rasteriseSymbolImage).toHaveBeenCalledWith(symbolMatch, mapStyle, 'selected', pixelRatio)
+  })
+
+  it('skips just the active/selected properties if only those variants resolve null (normal still succeeds)', async () => {
+    const properties = { symbol: 'pin' }
+    const olFeature = createOlFeature(properties)
+    const manager = createManager({ features: [olFeature] })
+    symbolRegistry.rasteriseSymbolImage
+      .mockImplementationOnce(async (style, ms, variant, pixelRatio) => // normal — real stub behaviour
+        ({ imageId: `${variant}-${symbolRegistry.getSymbolImageId(style, ms, false, pixelRatio)}`, imageData: { width: 10, height: 10 } }))
+      .mockResolvedValueOnce(null) // active
+      .mockResolvedValueOnce(null) // selected
+
+    await resolvePointSymbol({ manager, mapProvider: createMapProvider(), olFeature })
+
+    expect(olFeature.set).toHaveBeenCalledWith('symbolImageId', expect.any(String))
+    expect(olFeature.set).not.toHaveBeenCalledWith('symbolActiveImageId', expect.anything())
+    expect(olFeature.set).not.toHaveBeenCalledWith('symbolSelectedImageId', expect.anything())
+  })
+
+  it('does nothing when rasterisation resolves null (e.g. an unresolvable symbol id)', async () => {
+    const properties = { symbol: 'not-a-real-symbol' }
+    const olFeature = createOlFeature(properties)
+    const manager = createManager({ features: [olFeature] })
+    symbolRegistry.rasteriseSymbolImage.mockResolvedValueOnce(null)
+
+    await resolvePointSymbol({ manager, mapProvider: createMapProvider(), olFeature })
+
+    expect(olFeature.set).not.toHaveBeenCalled()
+  })
+
+  it('does not write back if the feature was removed from the source while rasterising was in flight', async () => {
+    const properties = { symbol: 'pin' }
+    const olFeature = createOlFeature(properties)
+    const manager = createManager({ features: [] }) // not present in the source
+
+    await resolvePointSymbol({ manager, mapProvider: createMapProvider(), olFeature })
+
+    expect(olFeature.set).not.toHaveBeenCalled()
+  })
+
+  it('surfaces (rather than swallows) a rasterisation failure', async () => {
+    const properties = { symbol: 'pin' }
+    const olFeature = createOlFeature(properties)
+    olFeature.getId = () => 'p1'
+    const manager = createManager({ features: [olFeature] })
+    const error = new Error('rasterise failed')
+    symbolRegistry.rasteriseSymbolImage.mockRejectedValueOnce(error)
+    const consoleError = jest.spyOn(console, 'error').mockImplementation(() => {})
+
+    await resolvePointSymbol({ manager, mapProvider: createMapProvider(), olFeature })
+
+    expect(olFeature.set).not.toHaveBeenCalled()
+    expect(consoleError).toHaveBeenCalledWith('[draw] failed to resolve point symbol', 'p1', error)
+  })
+})
+
+describe('refreshAllPointSymbols', () => {
+  const feature = (getType, properties) => {
+    const f = createOlFeature(properties)
+    f.getGeometry = () => ({ getType: () => getType })
+    return f
+  }
+
+  it('re-resolves every point feature with a symbol config, ignoring non-point and unstyled features', async () => {
+    const pointWithSymbol = feature('Point', { symbol: 'pin' })
+    const pointWithoutSymbol = feature('Point', {})
+    const polygon = feature('Polygon', { symbol: 'pin' })
+    const manager = createManager({ features: [pointWithSymbol, pointWithoutSymbol, polygon] })
+    manager.store.source.hasFeature = jest.fn(() => true)
+
+    await refreshAllPointSymbols({ manager, mapProvider: createMapProvider() })
+
+    expect(pointWithSymbol.set).toHaveBeenCalledWith('symbolImageId', expect.any(String))
+    expect(pointWithoutSymbol.set).not.toHaveBeenCalled()
+    expect(polygon.set).not.toHaveBeenCalled()
+  })
+
+  it('does nothing when there are no drawn points', async () => {
+    const manager = createManager({ features: [] })
+    await expect(refreshAllPointSymbols({ manager, mapProvider: createMapProvider() })).resolves.toEqual([])
+  })
+})

package/plugins/draw/src/adapters/openlayers/snap/snapIndicator.js

@@ -37,7 +37,9 @@ export const createSnapIndicator = (map, colors) => {
   const layer = new VectorLayer({
     source,
     style: (f) => styles[f.get('snapType')] ?? null,
-    zIndex: 200,
+    // Below the draw layer (zIndex 100) and its vertex/midpoint handles (101-103), matching
+    // the ML adapter — the indicator sits behind the symbols/vertices it's snapping to.
+    zIndex: 99,
     updateWhileAnimating: true,
     updateWhileInteracting: true
   })

package/plugins/draw/src/adapters/openlayers/snap/snapInteraction.js

@@ -3,9 +3,9 @@
  * mapBrowserEvent.coordinate to the nearest snap candidate before any draw
  * or modify interaction sees it.
  *
- * Coordinate snapping applies to all pointer events (pointermove, pointerdown,
- * pointerup, singleclick) so that both rubberbanding and vertex placement are snapped.
- * The visual indicator is only updated on pointermove.
+ * The visual indicator updates on both pointermove (hover preview) and pointerdrag (an active
+ * OL Modify drag), staying visible through to release — nothing hides it on release; it only
+ * clears on a fresh query, a mode change, or snapping being switched off.
  *
  * Must be added to the map AFTER the Draw/Modify interaction so it is processed
  * first (OL iterates interactions in reverse-add order).
@@ -15,6 +15,7 @@
 import Interaction from 'ol/interaction/Interaction.js'
 
 const SNAP_EVENTS = new Set(['pointermove', 'pointerdrag', 'pointerdown', 'pointerup', 'singleclick', 'click'])
+const INDICATOR_EVENTS = new Set(['pointermove', 'pointerdrag'])
 
 const processSnapEvent = (mapBrowserEvent, engine, indicator, snapRadius, isIndicatorActive) => {
   const { type } = mapBrowserEvent
@@ -33,13 +34,9 @@ const processSnapEvent = (mapBrowserEvent, engine, indicator, snapRadius, isIndi
     mapBrowserEvent.coordinate = result.coord.slice()
   }
 
-  // Only update indicator during free mouse movement — hide during drag, no-op for clicks
-  if (type === 'pointermove' && isIndicatorActive()) {
+  // Hover preview and active drag both keep the indicator live; no update for click/down/up.
+  if (INDICATOR_EVENTS.has(type) && isIndicatorActive()) {
     result ? indicator.show(result.coord, result.type) : indicator.hide()
-  } else if (type === 'pointerdrag') {
-    indicator.hide()
-  } else {
-    // no indicator update for click/down/up events
   }
 }
 

package/plugins/draw/src/adapters/openlayers/snap/snapInteraction.test.js

@@ -35,7 +35,7 @@ test('rewrites the event coordinate to a copy of the snap candidate for all poin
   }
 })
 
-test('the indicator follows free mouse movement only', () => {
+test('the indicator follows both free mouse movement and an active drag', () => {
   const { engine, indicator, fire } = setup()
   fire('pointermove')
   expect(indicator.show).toHaveBeenCalledWith([9, 9], 'vertex')
@@ -44,17 +44,28 @@ test('the indicator follows free mouse movement only', () => {
   fire('pointermove')
   expect(indicator.hide).toHaveBeenCalledTimes(1)
 
+  // A drag (e.g. edit_vertex's mouse-drag path, edit/modifyInteraction.js) keeps it live too —
+  // it must stay visible for as long as the dragged vertex sits on a candidate, not just on a
+  // free hover. See snapInteraction.js's own comment for why: this used to force-hide it on
+  // every pointerdrag, so the indicator could never actually be seen mid-drag.
   engine.query.mockReturnValue({ type: 'edge', coord: [5, 5] })
   fire('pointerdrag')
-  expect(indicator.hide).toHaveBeenCalledTimes(2) // hidden during drags
+  expect(indicator.show).toHaveBeenCalledWith([5, 5], 'edge')
+
+  engine.query.mockReturnValue(null)
+  fire('pointerdrag')
+  expect(indicator.hide).toHaveBeenCalledTimes(2)
+
   fire('singleclick')
-  expect(indicator.show).toHaveBeenCalledTimes(1) // clicks never touch the indicator
+  expect(indicator.show).toHaveBeenCalledTimes(2) // clicks never touch the indicator
+  expect(indicator.hide).toHaveBeenCalledTimes(2)
 })
 
-test('the indicator stays untouched during pointermove when the indicator is gated off', () => {
+test('the indicator stays untouched during pointermove or a drag when the indicator is gated off', () => {
   const { indicator, fire } = setup({ indicatorActive: false })
   const { event } = fire('pointermove')
   expect(event.coordinate).toEqual([9, 9]) // snapping still applies
+  fire('pointerdrag')
   expect(indicator.show).not.toHaveBeenCalled()
   expect(indicator.hide).not.toHaveBeenCalled()
 })

package/plugins/draw/src/adapters/openlayers/utils/olCoords.js

@@ -16,7 +16,7 @@ export const pixelToCoord = (map, pixel) => {
 }
 
 /** Pixel distance between two { x, y } points */
-export const pixelDist = (a, b) => Math.sqrt((a.x - b.x) ** 2 + (a.y - b.y) ** 2)
+export const pixelDist = (a, b) => Math.hypot(a.x - b.x, a.y - b.y)
 
 /** OL pixel array [x, y] → { x, y } */
 export const arrayToPixel = ([x, y]) => ({ x, y })