test: adapt test to new layer format #38

Author: wazolab

src/teritorio-cluster.ts

@@ -302,6 +302,10 @@ export class TeritorioCluster extends EventTarget implements CustomLayerInterfac
     this.markersOnScreen = newMarkers
   }
 
+  public getOptionsForTesting(): Required<TeritorioClusterOptions> {
+    return this.opts
+  }
+
   private renderUnfoldedCluster = (id: string, leaves: MapGeoJSONFeature[]): HTMLDivElement => {
     const element = document.createElement('div')
     element.id = id

tests/mocks/maplibre-gl.mock.ts

@@ -2,13 +2,12 @@ import { vi } from 'vitest'
 
 vi.mock('maplibre-gl', () => {
   return {
-    Map: vi.fn().mockImplementation(() => ({
-      on: vi.fn(),
-      querySourceFeatures: vi.fn().mockReturnValue([]),
-      getSource: vi.fn().mockReturnValue({
-        getClusterLeaves: vi.fn(),
-      }),
-      fitBounds: vi.fn(),
-    })),
+    default: {
+      Map: vi.fn().mockImplementation(() => ({
+        addLayer: vi.fn(),
+        addSource: vi.fn(),
+        on: vi.fn(),
+      })),
+    },
   }
 })

tests/teritorio-cluster.test.ts

@@ -1,52 +1,88 @@
-import { Map as MapGL } from 'maplibre-gl'
-import { beforeEach, describe, expect, it } from 'vitest'
+import maplibre from 'maplibre-gl'
+import { describe, expect, it, vi } from 'vitest'
 import { TeritorioCluster } from '../src/index'
 
 describe('teritorio cluster class implementation', () => {
-  let map: MapGL
-  let teritorioCluster: TeritorioCluster
+  it('should call onAdd when map.addLayer is used', () => {
+    const map = new maplibre.Map({ container: 'map' })
 
-  beforeEach(() => {
-    // Create a mock map
-    map = new MapGL({ container: 'map' })
+    map.on('load', () => {
+      map.addSource('earthquakes', {
+        type: 'geojson',
+        data: {
+          type: 'FeatureCollection',
+          features: [],
+        },
+        cluster: true,
+        clusterRadius: 80,
+        clusterMaxZoom: 22,
+        maxzoom: 24,
+      })
 
-    // Initialize the cluster
-    teritorioCluster = new TeritorioCluster(map, 'sourceId')
-  })
-
-  it('should initialize with default values', () => {
-    expect(teritorioCluster.map).toMatchObject(map)
-    expect(teritorioCluster.clusterLeaves).toBeInstanceOf(Map)
-    expect(teritorioCluster.clusterLeaves.size).toBe(0)
-    expect(teritorioCluster.clusterMaxZoom).toBe(17)
-    expect(teritorioCluster.clusterMinZoom).toBe(0)
-
-    // Should have the default render function
-    expect(teritorioCluster.clusterRender).toBeUndefined()
+      const teritorioLayer = new TeritorioCluster(
+        'layerId',
+        'sourceId',
+        {
+          clusterRender: vi.fn(),
+          markerRender: vi.fn(),
+          unfoldedClusterRender: vi.fn(),
+          pinMarkerRender: vi.fn(),
+        },
+      )
+      const onAddSpy = vi.spyOn(teritorioLayer, 'onAdd')
 
-    expect(teritorioCluster.featuresMap).toBeInstanceOf(Map)
-    expect(teritorioCluster.featuresMap.size).toBe(0)
-    expect(teritorioCluster.fitBoundsOptions).toMatchObject({ padding: 20 })
-    expect(teritorioCluster.initialFeature).toBeUndefined()
+      map.addLayer(teritorioLayer)
 
-    // Should have the default render function
-    expect(teritorioCluster.markerRender).toBeUndefined()
-
-    expect(teritorioCluster.markerSize).toBe(24)
-    expect(teritorioCluster.markersOnScreen).toBeInstanceOf(Map)
-    expect(teritorioCluster.markersOnScreen.size).toBe(0)
-    expect(teritorioCluster.pinMarker).toBeNull()
+      expect(onAddSpy).toHaveBeenCalledOnce()
+      expect(onAddSpy).toHaveBeenCalledWith(map)
+    })
+  })
 
-    // Should have the default render function
-    expect(teritorioCluster.pinMarkerRender).toBeUndefined()
+  it('should initialize with default values', () => {
+    const teritorioCluster = new TeritorioCluster('layerId', 'sourceId')
+    const opts = teritorioCluster.getOptionsForTesting()
 
-    expect(teritorioCluster.selectedClusterId).toBeNull()
-    expect(teritorioCluster.selectedFeatureId).toBeNull()
-    expect(teritorioCluster.sourceId).toBe('sourceId')
+    expect(teritorioCluster.id).toBe('layerId')
+    expect(opts.clusterMaxZoom).toBe(17)
+    expect(opts.clusterMinZoom).toBe(0)
+    expect(opts.markerSize).toBe(24)
+    expect(opts.unfoldedClusterMaxLeaves).toBe(7)
+    expect(opts.fitBoundsOptions).toEqual({ padding: 20 })
+    expect(opts.initialFeature).toBeUndefined()
+    expect(typeof opts.clusterRender).toBe('function')
+    expect(typeof opts.markerRender).toBe('function')
+    expect(typeof opts.pinMarkerRender).toBe('function')
+    expect(typeof opts.unfoldedClusterRender).toBe('function')
+  })
 
-    // Should have the default render function
-    expect(teritorioCluster.unfoldedClusterRender).toBeUndefined()
+  it('should initialize with user values', () => {
+    const teritorioCluster = new TeritorioCluster(
+      'layerId',
+      'sourceId',
+      {
+        clusterMaxZoom: 22,
+        clusterMinZoom: 2,
+        clusterRender: vi.fn(),
+        fitBoundsOptions: { padding: { top: 57, bottom: 20, left: 20, right: 20 } },
+        markerRender: vi.fn(),
+        markerSize: 28,
+        unfoldedClusterRender: vi.fn(),
+        unfoldedClusterMaxLeaves: 8,
+        pinMarkerRender: vi.fn(),
+      },
+    )
+    const opts = teritorioCluster.getOptionsForTesting()
 
-    expect(teritorioCluster.unfoldedClusterMaxLeaves).toBe(7)
+    expect(teritorioCluster.id).toBe('layerId')
+    expect(opts.clusterMaxZoom).toBe(22)
+    expect(opts.clusterMinZoom).toBe(2)
+    expect(opts.markerSize).toBe(28)
+    expect(opts.unfoldedClusterMaxLeaves).toBe(8)
+    expect(opts.fitBoundsOptions).toEqual({ padding: { top: 57, bottom: 20, left: 20, right: 20 } })
+    expect(opts.initialFeature).toBeUndefined()
+    expect(typeof opts.clusterRender).toBe('function')
+    expect(typeof opts.markerRender).toBe('function')
+    expect(typeof opts.pinMarkerRender).toBe('function')
+    expect(typeof opts.unfoldedClusterRender).toBe('function')
   })
 })