add associated test to l-map.test.js

src/l-map.test.js

@@ -1,7 +1,7 @@
 // @vitest-environment happy-dom
 import "./index.js";
 import { layerRemoved, layerConnected } from "./events"
-import { it, expect } from "vitest";
+import { vi, it, expect } from "vitest";
 import LTileLayer from "./l-tile-layer";
 import LMap from "./l-map.js";
 
@@ -74,3 +74,41 @@ it("should bubble layer remove events", async () => {
   const expected = { layer: tileLayer.layer };
   expect(actual).toEqual(expected);
 })
+
+it("should handle layerConnected event from l-control-layers correctly", async () => {
+  // Arrange: create a <l-map><l-control-layers>... arrangement
+  const el = /** @type {LMap} */ (document.createElement("l-map"));
+  el.setAttribute("zoom", "0");
+  el.setAttribute("center", JSON.stringify([0, 0]));
+
+  const controlLayers = document.createElement("l-control-layers");
+  el.appendChild(controlLayers);
+
+  // Arrange: add a trackable mock layer to the layerConnected event 
+  const mockLayer = {
+    addTo: vi.fn(), // Mocks layer.addTo method
+  };
+  const event = new CustomEvent(layerConnected, {
+    bubbles: true,
+    detail: { layer: mockLayer },
+  });
+
+  // Act: connect to DOM
+  document.body.appendChild(el);
+
+  // Act: Dispatch the layerConnected event on the control layers
+  const promise = new Promise((resolve) => {
+    controlLayers.addEventListener(layerConnected, (ev) => {
+      resolve(ev.detail);
+    });
+  });
+  controlLayers.dispatchEvent(event);
+
+  // Assert: event detail is correctly passed
+  const actual = await promise;
+  expect(actual).toEqual({ layer: mockLayer });
+
+  // Assert: addTo method was called on the map
+  const map = el.map; // Map instance from <l-map>
+  expect(mockLayer.addTo).toHaveBeenCalledWith(map);
+});