add test for delayed interaction

elements/map/test/cases/select/add-select-interaction-to-existing-layer.js

@@ -0,0 +1,51 @@
+import { html } from "lit";
+import { simulateEvent } from "../../utils/events";
+import ecoRegionsFixture from "../../fixtures/ecoregions.json";
+import vectorLayerJson from "../../fixtures/vectorLayer.json";
+
+/**
+ * Tests to adds a select interaction to Vector layer
+ */
+const addSelectInteractionVector = () => {
+  cy.intercept("https://openlayers.org/data/vector/ecoregions.json", (req) => {
+    req.reply(ecoRegionsFixture);
+  });
+  const styleJson = JSON.parse(JSON.stringify(vectorLayerJson));
+  styleJson[0].minZoom = 3;
+
+  cy.mount(html`<eox-map .zoom=${4} .layers=${styleJson}></eox-map>`).as(
+    "eox-map",
+  );
+
+  cy.get("eox-map").and(($el) => {
+    const eoxMap = $el[0];
+
+    eoxMap.map.on("loadend", () => {
+      styleJson[0].interactions = [
+        {
+          type: "select",
+          options: {
+            id: "selectInteraction",
+            condition: "click",
+            style: {
+              "stroke-color": "white",
+              "stroke-width": 3,
+            },
+          },
+        },
+      ];
+      eoxMap.layers = styleJson;
+      eoxMap.addEventListener("select", (evt) => {
+        expect(evt.detail.feature, "adds interaction after update").to.exist;
+        expect(
+          eoxMap.map.getTargetElement().style.cursor,
+          "changes cursor to pointer",
+        ).to.be.equal("pointer");
+      });
+      simulateEvent(eoxMap.map, "pointermove", 120, -140);
+      simulateEvent(eoxMap.map, "click", 120, -140);
+    });
+  });
+};
+
+export default addSelectInteractionVector;

elements/map/test/cases/select/index.js

@@ -2,6 +2,7 @@
 
 export { default as addSelectInteractionVectorTile } from "./add-select-interaction-vector-tile";
 export { default as addSelectInteractionVector } from "./add-select-interaction-vector";
+export { default as addSelectInteractionToExistingLayer } from "./add-select-interaction-to-existing-layer";
 export { default as highlightByIdVectorLayer } from "./highlight-by-id-vector-layer";
 export { default as highlightByIdVectorTileLayer } from "./highlight-by-id-vector-tile-layer";
 export { default as removeSelectInteraction } from "./remove-select-interaction";

elements/map/test/selectInteraction.cy.js

@@ -2,6 +2,7 @@ import "../src/main";
 import {
   addSelectInteractionVector,
   addSelectInteractionVectorTile,
+  addSelectInteractionToExistingLayer,
   highlightByIdVectorLayer,
   highlightByIdVectorTileLayer,
   removeSelectInteractionLayer,
@@ -47,6 +48,12 @@ describe("select interaction on click", () => {
   it("adds a select interaction to Vector layer", () =>
     addSelectInteractionVector());
 
+  /**
+   * Test case to add a selection to a layer that was initially created without a selection
+   */
+  it("adds a select interaction to an existing layer (without interaction)", () =>
+    addSelectInteractionToExistingLayer());
+
   /**
    * Test case to highlight by ID (Vector Layer)
    */