@geospatial-sdk/openlayers 0.0.5-dev.54 → 0.0.5-dev.56

package/lib/map/create-map.test.ts

@@ -1,17 +1,15 @@
-import { FeatureCollection } from "geojson";
-import TileLayer from "ol/layer/Tile.js";
-import VectorLayer from "ol/layer/Vector.js";
-import Map from "ol/Map.js";
-import TileWMS from "ol/source/TileWMS.js";
-import VectorSource from "ol/source/Vector.js";
-import XYZ from "ol/source/XYZ.js";
-import View from "ol/View.js";
-import GeoJSON from "ol/format/GeoJSON.js";
+import {
+  MapContext,
+  MapContextLayer,
+  MapContextLayerGeojson,
+  MapContextLayerWms,
+} from "@geospatial-sdk/core";
 import {
   MAP_CTX_EXTENT_FIXTURE,
   MAP_CTX_FIXTURE,
   MAP_CTX_LAYER_GEOJSON_FIXTURE,
   MAP_CTX_LAYER_GEOJSON_REMOTE_FIXTURE,
+  MAP_CTX_LAYER_GEOTIFF_FIXTURE,
   MAP_CTX_LAYER_MAPBLIBRE_STYLE_FIXTURE,
   MAP_CTX_LAYER_MVT_FIXTURE,
   MAP_CTX_LAYER_OGCAPI_FIXTURE,
@@ -20,31 +18,34 @@ import {
   MAP_CTX_LAYER_WMTS_FIXTURE,
   MAP_CTX_LAYER_XYZ_FIXTURE,
 } from "@geospatial-sdk/core/fixtures/map-context.fixtures.js";
-import {
-  MapContext,
-  MapContextLayer,
-  MapContextLayerGeojson,
-  MapContextLayerWms,
-} from "@geospatial-sdk/core";
+import { FeatureCollection } from "geojson";
+import { MapboxVectorLayer } from "ol-mapbox-style";
+import { FeatureUrlFunction } from "ol/featureloader.js";
+import GeoJSON from "ol/format/GeoJSON.js";
+import ImageTile from "ol/ImageTile.js";
 import Layer from "ol/layer/Layer.js";
+import TileLayer from "ol/layer/Tile.js";
+import VectorLayer from "ol/layer/Vector.js";
+import VectorTileLayer from "ol/layer/VectorTile.js";
+import WebGLTileLayer from "ol/layer/WebGLTile.js";
+import Map from "ol/Map.js";
+import { VectorTile } from "ol/source.js";
+import GeoTIFF from "ol/source/GeoTIFF.js";
+import TileWMS from "ol/source/TileWMS.js";
+import VectorSource from "ol/source/Vector.js";
+import WMTS from "ol/source/WMTS.js";
+import XYZ from "ol/source/XYZ.js";
+import TileState from "ol/TileState.js";
+import View from "ol/View.js";
+import { beforeEach } from "vitest";
 import {
   createLayer,
   createMapFromContext,
   createView,
   resetMapFromContext,
 } from "./create-map.js";
-import WMTS from "ol/source/WMTS.js";
-import { VectorTile } from "ol/source.js";
-import { MapboxVectorLayer } from "ol-mapbox-style";
-import {
-  handleEndpointError,
-  tileLoadErrorCatchFunction,
-} from "./handle-errors.js";
-import ImageTile from "ol/ImageTile.js";
-import TileState from "ol/TileState.js";
-import VectorTileLayer from "ol/layer/VectorTile.js";
-import { FeatureUrlFunction } from "ol/featureloader.js";
-import { beforeEach } from "vitest";
+import { tileLoadErrorCatchFunction } from "./handle-errors.js";
+import { GEOSPATIAL_SDK_PREFIX } from "./constants.js";
 
 vi.mock("./handle-errors", async (importOriginal) => {
   const actual =
@@ -56,18 +57,22 @@ vi.mock("./handle-errors", async (importOriginal) => {
   };
 });
 
-afterEach(() => {
+beforeEach(() => {
+  vi.useFakeTimers();
   vi.clearAllMocks();
 });
 
 describe("MapContextService", () => {
   describe("#createLayer", () => {
     let layerModel: MapContextLayer, layer: Layer;
+    const eventCallback = vi.fn();
 
     describe("XYZ", () => {
       beforeEach(async () => {
         layerModel = MAP_CTX_LAYER_XYZ_FIXTURE;
         layer = await createLayer(layerModel);
+        layer.on(`${GEOSPATIAL_SDK_PREFIX}layer-loading-status`, eventCallback);
+        layer.on(`${GEOSPATIAL_SDK_PREFIX}layer-data-info`, eventCallback);
       });
       it("create a tile layer", () => {
         expect(layer).toBeTruthy();
@@ -105,13 +110,25 @@ describe("MapContextService", () => {
         tileLoadFunction(tile, "http://example.com/tile");
         expect(tileLoadErrorCatchFunction).toHaveBeenCalled();
       });
+      it("emits a loaded event initially", async () => {
+        await vi.runAllTimersAsync();
+        expect(eventCallback).toHaveBeenCalledWith({
+          layerState: {
+            loaded: true,
+          },
+          target: layer,
+          type: `${GEOSPATIAL_SDK_PREFIX}layer-loading-status`,
+        });
+      });
     });
-    describe("OGCAPI", () => {
+    describe("OGCAPI (as geojson items)", () => {
       beforeEach(async () => {
         layerModel = MAP_CTX_LAYER_OGCAPI_FIXTURE;
         layer = await createLayer(layerModel);
+        layer.on(`${GEOSPATIAL_SDK_PREFIX}layer-loading-status`, eventCallback);
+        layer.on(`${GEOSPATIAL_SDK_PREFIX}layer-data-info`, eventCallback);
       });
-      it("create a vector tile layer", () => {
+      it("create a vector layer", () => {
         expect(layer).toBeTruthy();
         expect(layer).toBeInstanceOf(VectorLayer);
       });
@@ -121,7 +138,7 @@ describe("MapContextService", () => {
         expect(layer.get("label")).toBeUndefined();
         expect(layer.getSource()?.getAttributions()).toBeNull();
       });
-      it("create a OGCVectorTile source", () => {
+      it("create a vector source", () => {
         const source = layer.getSource();
         expect(source).toBeInstanceOf(VectorSource);
       });
@@ -132,11 +149,23 @@ describe("MapContextService", () => {
           "https://demo.ldproxy.net/zoomstack/collections/airports/items?f=json",
         );
       });
+      it("emits a loaded event initially", async () => {
+        await vi.runAllTimersAsync();
+        expect(eventCallback).toHaveBeenCalledWith({
+          layerState: {
+            loaded: true,
+          },
+          target: layer,
+          type: `${GEOSPATIAL_SDK_PREFIX}layer-loading-status`,
+        });
+      });
     });
     describe("WMS", () => {
       beforeEach(async () => {
-        (layerModel = MAP_CTX_LAYER_WMS_FIXTURE),
-          (layer = await createLayer(layerModel));
+        layerModel = MAP_CTX_LAYER_WMS_FIXTURE;
+        layer = await createLayer(layerModel);
+        layer.on(`${GEOSPATIAL_SDK_PREFIX}layer-loading-status`, eventCallback);
+        layer.on(`${GEOSPATIAL_SDK_PREFIX}layer-data-info`, eventCallback);
       });
       it("create a tile layer", () => {
         expect(layer).toBeTruthy();
@@ -186,12 +215,24 @@ describe("MapContextService", () => {
         tileLoadFunction(tile, "http://example.com/tile");
         expect(tileLoadErrorCatchFunction).toHaveBeenCalled();
       });
+      it("emits a loaded event initially", async () => {
+        await vi.runAllTimersAsync();
+        expect(eventCallback).toHaveBeenCalledWith({
+          layerState: {
+            loaded: true,
+          },
+          target: layer,
+          type: `${GEOSPATIAL_SDK_PREFIX}layer-loading-status`,
+        });
+      });
     });
 
     describe("WFS", () => {
       beforeEach(async () => {
-        (layerModel = MAP_CTX_LAYER_WFS_FIXTURE),
-          (layer = await createLayer(layerModel));
+        layerModel = MAP_CTX_LAYER_WFS_FIXTURE;
+        layer = await createLayer(layerModel);
+        layer.on(`${GEOSPATIAL_SDK_PREFIX}layer-loading-status`, eventCallback);
+        layer.on(`${GEOSPATIAL_SDK_PREFIX}layer-data-info`, eventCallback);
       });
       it("create a vector layer", () => {
         expect(layer).toBeTruthy();
@@ -221,17 +262,15 @@ describe("MapContextService", () => {
           "https://www.datagrandest.fr/geoserver/region-grand-est/ows?service=WFS&version=1.1.0&request=GetFeature&outputFormat=application%2Fjson&typename=ms%3Acommune_actuelle_3857&srsname=EPSG%3A3857&bbox=10%2C20%2C30%2C40%2CEPSG%3A3857&maxFeatures=10000",
         );
       });
-      it("should NOT call handleEndpointError", () => {
-        expect(handleEndpointError).not.toHaveBeenCalled();
-      });
-    });
-    describe("WFS error", () => {
-      beforeEach(async () => {
-        layerModel = { ...MAP_CTX_LAYER_WFS_FIXTURE, url: "https://wfs/error" };
-        layer = await createLayer(layerModel);
-      });
-      it("should call handleEndpointError", () => {
-        expect(handleEndpointError).toHaveBeenCalled();
+      it("emits a loaded event initially", async () => {
+        await vi.runAllTimersAsync();
+        expect(eventCallback).toHaveBeenCalledWith({
+          layerState: {
+            loaded: true,
+          },
+          target: layer,
+          type: `${GEOSPATIAL_SDK_PREFIX}layer-loading-status`,
+        });
       });
     });
 
@@ -240,6 +279,11 @@ describe("MapContextService", () => {
         beforeEach(async () => {
           layerModel = MAP_CTX_LAYER_GEOJSON_FIXTURE;
           layer = await createLayer(layerModel);
+          layer.on(
+            `${GEOSPATIAL_SDK_PREFIX}layer-loading-status`,
+            eventCallback,
+          );
+          layer.on(`${GEOSPATIAL_SDK_PREFIX}layer-data-info`, eventCallback);
         });
         it("create a VectorLayer", () => {
           expect(layer).toBeTruthy();
@@ -261,6 +305,16 @@ describe("MapContextService", () => {
             .data as FeatureCollection;
           expect(features.length).toBe(data.features.length);
         });
+        it("emits a loaded event", async () => {
+          await vi.runAllTimersAsync();
+          expect(eventCallback).toHaveBeenCalledWith({
+            layerState: {
+              loaded: true,
+            },
+            target: layer,
+            type: `${GEOSPATIAL_SDK_PREFIX}layer-loading-status`,
+          });
+        });
       });
       describe("with inline data as string", () => {
         beforeEach(async () => {
@@ -313,6 +367,11 @@ describe("MapContextService", () => {
         beforeEach(async () => {
           layerModel = MAP_CTX_LAYER_GEOJSON_REMOTE_FIXTURE;
           layer = await createLayer(layerModel);
+          layer.on(
+            `${GEOSPATIAL_SDK_PREFIX}layer-loading-status`,
+            eventCallback,
+          );
+          layer.on(`${GEOSPATIAL_SDK_PREFIX}layer-data-info`, eventCallback);
         });
         it("create a VectorLayer", () => {
           expect(layer).toBeTruthy();
@@ -332,6 +391,16 @@ describe("MapContextService", () => {
             (layerModel as MapContextLayerGeojson).url,
           );
         });
+        it("emits a loaded event as well as data info eventually", async () => {
+          await vi.runAllTimersAsync();
+          expect(eventCallback).toHaveBeenCalledWith({
+            layerState: {
+              loaded: true,
+            },
+            target: layer,
+            type: `${GEOSPATIAL_SDK_PREFIX}layer-loading-status`,
+          });
+        });
       });
     });
 
@@ -339,6 +408,8 @@ describe("MapContextService", () => {
       beforeEach(async () => {
         layerModel = MAP_CTX_LAYER_WMTS_FIXTURE;
         layer = await createLayer(layerModel);
+        layer.on(`${GEOSPATIAL_SDK_PREFIX}layer-loading-status`, eventCallback);
+        layer.on(`${GEOSPATIAL_SDK_PREFIX}layer-data-info`, eventCallback);
       });
       it("create a tile layer", () => {
         expect(layer).toBeTruthy();
@@ -363,20 +434,15 @@ describe("MapContextService", () => {
           "https://services.geo.sg.ch/wss/service/SG00066_WMTS/guest/tile/1.0.0/SG00066/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}",
         ]);
       });
-      it("should NOT call handleEndpointError", () => {
-        expect(handleEndpointError).not.toHaveBeenCalled();
-      });
-    });
-    describe("WMTS error", () => {
-      beforeEach(async () => {
-        layerModel = {
-          ...MAP_CTX_LAYER_WMTS_FIXTURE,
-          url: "https://wmts/error",
-        };
-        layer = await createLayer(layerModel);
-      });
-      it("should call handleEndpointError", () => {
-        expect(handleEndpointError).toHaveBeenCalled();
+      it("emits a loaded event initially", async () => {
+        await vi.runAllTimersAsync();
+        expect(eventCallback).toHaveBeenCalledWith({
+          layerState: {
+            loaded: true,
+          },
+          target: layer,
+          type: `${GEOSPATIAL_SDK_PREFIX}layer-loading-status`,
+        });
       });
     });
     describe("WMTS without default style given", () => {
@@ -386,6 +452,8 @@ describe("MapContextService", () => {
           url: "https://wmts/no-default-style",
         };
         layer = await createLayer(layerModel);
+        layer.on(`${GEOSPATIAL_SDK_PREFIX}layer-loading-status`, eventCallback);
+        layer.on(`${GEOSPATIAL_SDK_PREFIX}layer-data-info`, eventCallback);
       });
       it("uses the first style as default", async () => {
         const source = layer.getSource() as WMTS;
@@ -397,6 +465,8 @@ describe("MapContextService", () => {
       beforeEach(async () => {
         layerModel = MAP_CTX_LAYER_MAPBLIBRE_STYLE_FIXTURE;
         layer = await createLayer(layerModel);
+        layer.on(`${GEOSPATIAL_SDK_PREFIX}layer-loading-status`, eventCallback);
+        layer.on(`${GEOSPATIAL_SDK_PREFIX}layer-data-info`, eventCallback);
       });
       it("create a tile layer", () => {
         expect(layer).toBeTruthy();
@@ -411,12 +481,24 @@ describe("MapContextService", () => {
         const source = layer.getSource();
         expect(source).toBeInstanceOf(VectorTile);
       });
+      it("emits a loaded event initially", async () => {
+        await vi.runAllTimersAsync();
+        expect(eventCallback).toHaveBeenCalledWith({
+          layerState: {
+            loaded: true,
+          },
+          target: layer,
+          type: `${GEOSPATIAL_SDK_PREFIX}layer-loading-status`,
+        });
+      });
     });
 
     describe("MVT", () => {
       beforeEach(async () => {
         layerModel = MAP_CTX_LAYER_MVT_FIXTURE;
         layer = await createLayer(layerModel);
+        layer.on(`${GEOSPATIAL_SDK_PREFIX}layer-loading-status`, eventCallback);
+        layer.on(`${GEOSPATIAL_SDK_PREFIX}layer-data-info`, eventCallback);
       });
       it("create a VectorTileLayer", () => {
         expect(layer).toBeTruthy();
@@ -431,6 +513,36 @@ describe("MapContextService", () => {
         expect(layer.getOpacity()).toBe(1);
         expect(layer.get("label")).toBeUndefined();
       });
+      it("emits a loaded event initially", async () => {
+        await vi.runAllTimersAsync();
+        expect(eventCallback).toHaveBeenCalledWith({
+          layerState: {
+            loaded: true,
+          },
+          target: layer,
+          type: `${GEOSPATIAL_SDK_PREFIX}layer-loading-status`,
+        });
+      });
+    });
+
+    describe("GeoTIFF", () => {
+      beforeEach(async () => {
+        layerModel = MAP_CTX_LAYER_GEOTIFF_FIXTURE;
+        layer = await createLayer(layerModel);
+      });
+      it("create a WebGLTile layer", () => {
+        expect(layer).toBeTruthy();
+        expect(layer).toBeInstanceOf(WebGLTileLayer);
+      });
+      it("set correct layer properties", () => {
+        expect(layer.getVisible()).toBe(true);
+        expect(layer.getOpacity()).toBe(1);
+        expect(layer.get("label")).toBeUndefined();
+      });
+      it("create a GeoTIFF source", () => {
+        const source = layer.getSource();
+        expect(source).toBeInstanceOf(GeoTIFF);
+      });
     });
   });
 

package/lib/map/create-map.ts

@@ -25,29 +25,48 @@ import OGCVectorTile from "ol/source/OGCVectorTile.js";
 import WMTS from "ol/source/WMTS.js";
 import MVT from "ol/format/MVT.js";
 import {
+  EndpointError,
   OgcApiEndpoint,
   WfsEndpoint,
   WmtsEndpoint,
 } from "@camptocamp/ogc-client";
 import { MapboxVectorLayer } from "ol-mapbox-style";
 import { Tile } from "ol";
-import {
-  handleEndpointError,
-  tileLoadErrorCatchFunction,
-} from "./handle-errors.js";
+import { tileLoadErrorCatchFunction } from "./handle-errors.js";
 import VectorTile from "ol/source/VectorTile.js";
+import GeoTIFF from "ol/source/GeoTIFF.js";
+import WebGLTileLayer from "ol/layer/WebGLTile.js";
+import proj4 from "proj4";
+import { register } from "ol/proj/proj4.js";
 import {
   canDoIncrementalUpdate,
   updateLayerProperties,
 } from "./layer-update.js";
 import { initHoverLayer } from "./feature-hover.js";
+import {
+  emitLayerCreationError,
+  emitLayerLoadingError,
+  emitLayerLoadingStatusSuccess,
+  propagateLayerStateChangeEventToMap,
+} from "./register-events.js";
+import { GEOSPATIAL_SDK_PREFIX } from "./constants.js";
+
+// Register proj4 with OpenLayers so that arbitrary EPSG codes
+// (e.g., UTM zones from GeoTIFF metadata) can be reprojected to the map projection
+register(proj4);
 
 const GEOJSON = new GeoJSON();
 const WFS_MAX_FEATURES = 10000;
 
+// We need to defer some events being dispatched to make sure they are caught by the map
+// where the layers sit
+// FIXME: this should be better handled in a separate module!
+const defer = () => new Promise((resolve) => setTimeout(resolve, 0));
+
 export async function createLayer(layerModel: MapContextLayer): Promise<Layer> {
   const { type } = layerModel;
-  let layer: Layer | undefined;
+  let layer: Layer;
+
   switch (type) {
     case "xyz":
       {
@@ -74,8 +93,10 @@ export async function createLayer(layerModel: MapContextLayer): Promise<Layer> {
           });
           layer.setSource(source);
         }
+        defer().then(() => emitLayerLoadingStatusSuccess(layer));
       }
       break;
+
     case "wms":
       {
         layer = new TileLayer({});
@@ -96,9 +117,10 @@ export async function createLayer(layerModel: MapContextLayer): Promise<Layer> {
           );
         });
         layer.setSource(source);
+        defer().then(() => emitLayerLoadingStatusSuccess(layer));
       }
-
       break;
+
     case "wmts": {
       const olLayer = new TileLayer({});
       const endpoint = new WmtsEndpoint(layerModel.url);
@@ -130,11 +152,16 @@ export async function createLayer(layerModel: MapContextLayer): Promise<Layer> {
             }),
           );
         })
+        .then(() => emitLayerLoadingStatusSuccess(olLayer))
         .catch((e) => {
-          handleEndpointError(olLayer, e);
+          const httpStatus =
+            e instanceof EndpointError ? e.httpStatus : undefined;
+          emitLayerLoadingError(olLayer, e, httpStatus);
         });
-      return olLayer;
+      layer = olLayer;
+      break;
     }
+
     case "wfs": {
       const olLayer = new VectorLayer({
         style: layerModel.style ?? defaultStyle,
@@ -161,28 +188,35 @@ export async function createLayer(layerModel: MapContextLayer): Promise<Layer> {
             }),
           );
         })
+        .then(() => emitLayerLoadingStatusSuccess(olLayer))
         .catch((e) => {
-          handleEndpointError(olLayer, e);
+          const httpStatus =
+            e instanceof EndpointError ? e.httpStatus : undefined;
+          emitLayerLoadingError(olLayer, e, httpStatus);
         });
       layer = olLayer;
       break;
     }
+
     case "maplibre-style": {
       layer = new MapboxVectorLayer({
         styleUrl: layerModel.styleUrl,
         accessToken: layerModel.accessToken,
       }) as unknown as Layer;
+      defer().then(() => emitLayerLoadingStatusSuccess(layer));
       break;
     }
+
     case "geojson": {
+      layer = new VectorLayer({
+        style: layerModel.style ?? defaultStyle,
+      });
+      let source: VectorSource;
       if (layerModel.url !== undefined) {
-        layer = new VectorLayer({
-          source: new VectorSource({
-            format: new GeoJSON(),
-            url: layerModel.url,
-            attributions: layerModel.attributions,
-          }),
-          style: layerModel.style ?? defaultStyle,
+        source = new VectorSource({
+          format: new GeoJSON(),
+          url: layerModel.url,
+          attributions: layerModel.attributions,
         });
       } else {
         let geojson = layerModel.data;
@@ -198,16 +232,17 @@ export async function createLayer(layerModel: MapContextLayer): Promise<Layer> {
           featureProjection: "EPSG:3857",
           dataProjection: "EPSG:4326",
         }) as Feature<Geometry>[];
-        layer = new VectorLayer({
-          source: new VectorSource({
-            features,
-            attributions: layerModel.attributions,
-          }),
-          style: layerModel.style ?? defaultStyle,
+        source = new VectorSource({
+          features,
+          attributions: layerModel.attributions,
         });
       }
+      layer.setSource(source);
+      // FIXME: actually track layer loading and data info
+      defer().then(() => emitLayerLoadingStatusSuccess(layer));
       break;
     }
+
     case "ogcapi": {
       const ogcEndpoint = new OgcApiEndpoint(layerModel.url);
       let layerUrl: string;
@@ -241,35 +276,61 @@ export async function createLayer(layerModel: MapContextLayer): Promise<Layer> {
           layerModel.collection,
           layerModel.options,
         );
+        const source = new VectorSource({
+          format: new GeoJSON(),
+          url: layerUrl,
+          attributions: layerModel.attributions,
+        });
         layer = new VectorLayer({
-          source: new VectorSource({
-            format: new GeoJSON(),
-            url: layerUrl,
-            attributions: layerModel.attributions,
-          }),
+          source,
           style: layerModel.style ?? defaultStyle,
         });
       }
+      // FIXME: actually track layer loading
+      defer().then(() => emitLayerLoadingStatusSuccess(layer));
       break;
     }
-    default:
-      throw new Error(`Unrecognized layer type: ${JSON.stringify(layerModel)}`);
-  }
-  if (!layer) {
-    throw new Error(`Layer could not be created for type: ${layerModel.type}`);
+
+    case "geotiff": {
+      const geoTiffSource = new GeoTIFF({
+        sources: [{ url: layerModel.url }],
+        convertToRGB: "auto",
+      });
+      layer = new WebGLTileLayer({
+        source: geoTiffSource,
+      });
+      // FIXME: actually track tile loading
+      defer().then(() => emitLayerLoadingStatusSuccess(layer));
+      break;
+    }
+
+    default: {
+      // we create an empty placeholder layer so that we still have a corresponding layer in OL
+      layer = new VectorLayer({
+        properties: {
+          [`${GEOSPATIAL_SDK_PREFIX}layer-with-error`]: true,
+        },
+      });
+      defer().then(() =>
+        emitLayerCreationError(
+          layer,
+          new Error(`Unrecognized layer type: ${JSON.stringify(layerModel)}`),
+        ),
+      );
+    }
   }
 
-  updateLayerProperties(layerModel, layer);
+  updateLayerProperties(layerModel, layer!);
 
-  return layer;
+  return layer!;
 }
 
-export function updateLayerInMap(
+export async function updateLayerInMap(
   map: Map,
   layerModel: MapContextLayer,
   layerPosition: number,
   previousLayerModel: MapContextLayer,
-) {
+): Promise<void> {
   const layers = map.getLayers();
   const updatedLayer = layers.item(layerPosition) as Layer;
 
@@ -281,8 +342,9 @@ export function updateLayerInMap(
 
   // dispose and recreate layer
   updatedLayer.dispose();
-  createLayer(layerModel).then((layer) => {
+  await createLayer(layerModel).then((layer) => {
     layers.setAt(layerPosition, layer);
+    propagateLayerStateChangeEventToMap(map, layer);
   });
 }
 
@@ -351,6 +413,7 @@ export async function resetMapFromContext(
   for (const layerModel of context.layers) {
     const layer = await createLayer(layerModel);
     map.addLayer(layer);
+    propagateLayerStateChangeEventToMap(map, layer);
   }
   initHoverLayer(map);
   return map;

package/lib/map/feature-hover.ts

@@ -108,7 +108,7 @@ export function initHoverLayer(map: OlMap) {
         );
         const features = Array.from(featuresByLayer.values()).flat();
         map.dispatchEvent({
-          type: FeaturesHoverEventType,
+          type: `${GEOSPATIAL_SDK_PREFIX}${FeaturesHoverEventType}`,
           features,
           featuresByLayer,
         } as unknown as BaseEvent);