Fix typings issues in 3.2.0

build/generate-typings.ts

@@ -8,7 +8,7 @@ if (!fs.existsSync('dist')) {
 
 console.log('Starting bundling types');
 const outputFile = './dist/maplibre-gl.d.ts';
-childProcess.execSync(`dts-bundle-generator --umd-module-name=maplibregl -o ${outputFile} ./src/index.ts`);
+childProcess.execSync(`dts-bundle-generator --umd-module-name=maplibregl -o ${outputFile} ./src/index.ts  --project tsconfig.typegen.json`);
 let types = fs.readFileSync(outputFile, 'utf8');
 // Classes are not exported but should be since this is exported as UMD - fixing...
 types = types.replace(/declare class/g, 'export declare class');

package.json

@@ -25,6 +25,7 @@
     "@types/mapbox__point-geometry": "^0.1.2",
     "@types/mapbox__vector-tile": "^1.3.0",
     "@types/pbf": "^3.0.2",
+    "@types/supercluster": "^7.1.0",
     "earcut": "^2.2.4",
     "geojson-vt": "^3.2.1",
     "gl-matrix": "^3.4.3",
@@ -69,7 +70,6 @@
     "@types/react-dom": "^18.2.6",
     "@types/request": "^2.48.8",
     "@types/shuffle-seed": "^1.1.0",
-    "@types/supercluster": "^7.1.0",
     "@types/window-or-global": "^1.0.4",
     "@typescript-eslint/eslint-plugin": "^5.61.0",
     "@typescript-eslint/parser": "^5.62.0",
@@ -175,7 +175,7 @@
     "benchmark": "npm run tsnode test/bench/run-benchmarks.ts",
     "gl-stats": "npm run tsnode test/bench/gl-stats.ts",
     "prepare": "npm run codegen",
-    "typecheck": "tsc --noEmit && tsc --project tsconfig.dist.json",
+    "typecheck": "tsc --noEmit && tsc --project tsconfig.typecheck.json",
     "tsnode": "node --experimental-loader=ts-node/esm --no-warnings"
   },
   "files": [

src/ui/hash.ts

@@ -133,6 +133,5 @@ export class Hash {
     /**
      * Mobile Safari doesn't allow updating the hash more than 100 times per 30 seconds.
      */
-    _updateHash = throttle(this._updateHashUnthrottled, 30 * 1000 / 100);
-
+    _updateHash: () => ReturnType<typeof setTimeout> = throttle(this._updateHashUnthrottled, 30 * 1000 / 100);
 }

src/ui/map.ts

@@ -1367,8 +1367,8 @@ export class Map extends Camera {
      * when the cursor enters a visible portion of the specified layer from outside that layer or outside the map canvas.
      * @param layer - The ID of a style layer or a listener if no ID is provided. Event will only be triggered if its location
      * is within a visible feature in this layer. The event will have a `features` property containing
-     * an array of the matching features. If `layerIdOrListener` is not supplied, the event will not have a `features` property.
-     * Please note that many event types are not compatible with the optional `layerIdOrListener` parameter.
+     * an array of the matching features. If `layer` is not supplied, the event will not have a `features` property.
+     * Please note that many event types are not compatible with the optional `layer` parameter.
      * @param listener - The function to be called when the event is fired.
      * @returns `this`
      * @example
@@ -1411,21 +1411,27 @@ export class Map extends Camera {
      * @see [Create a hover effect](https://maplibre.org/maplibre-gl-js/docs/examples/hover-styles/)
      * @see [Create a draggable marker](https://maplibre.org/maplibre-gl-js/docs/examples/drag-a-point/)
      */
-    on(type: keyof MapEventType | string, listener: Listener): this;
     on<T extends keyof MapLayerEventType>(
         type: T,
         layer: string,
         listener: (ev: MapLayerEventType[T] & Object) => void,
     ): Map;
+    /**
+     * Overload of the `on` method that allows to listen to events without specifying a layer.
+     * @event
+     * @param type - The type of the event.
+     * @param listener - The listener callback.
+     * @returns `this`
+     */
     on<T extends keyof MapEventType>(type: T, listener: (ev: MapEventType[T] & Object) => void): this;
     /**
-     * This is an overload of the `on` method that allows to listen to events based on the `layerId`
+     * Overload of the `on` method that allows to listen to events without specifying a layer.
      * @event
      * @param type - The type of the event.
-     * @param layerIdOrListener - The ID of the layer.
      * @param listener - The listener callback.
      * @returns `this`
      */
+    on(type: keyof MapEventType | string, listener: Listener): this;
     on(type: keyof MapEventType | string, layerIdOrListener: string | Listener, listener?: Listener): this {
         if (listener === undefined) {
             return super.on(type, layerIdOrListener as Listener);
@@ -1445,7 +1451,7 @@ export class Map extends Camera {
     }
 
     /**
-     * Adds a listener that will be called only once to a specified event type occurring on features in a specified style layer.
+     * Adds a listener that will be called only once to a specified event type, optionally limited to features in a specified style layer.
      *
      * @event
      * @param type - The event type to listen for; one of `'mousedown'`, `'mouseup'`, `'click'`, `'dblclick'`,
@@ -1460,13 +1466,27 @@ export class Map extends Camera {
      * @param listener - The function to be called when the event is fired.
      * @returns `this` if listener is provided, promise otherwise to allow easier usage of async/await
      */
-    once(type: keyof MapEventType | string, listener?: Listener): this | Promise<any>;
     once<T extends keyof MapLayerEventType>(
         type: T,
         layer: string,
         listener?: (ev: MapLayerEventType[T] & Object) => void,
     ): this | Promise<MapLayerEventType[T] & Object>;
+    /**
+     * Overload of the `once` method that allows to listen to events without specifying a layer.
+     * @event
+     * @param type - The type of the event.
+     * @param listener - The listener callback.
+     * @returns `this`
+     */
     once<T extends keyof MapEventType>(type: T, listener?: (ev: MapEventType[T] & Object) => void): this | Promise<any>;
+    /**
+     * Overload of the `once` method that allows to listen to events without specifying a layer.
+     * @event
+     * @param type - The type of the event.
+     * @param listener - The listener callback.
+     * @returns `this`
+     */
+    once(type: keyof MapEventType | string, listener?: Listener): this | Promise<any>;
     once(type: keyof MapEventType | string, layerIdOrListener: string | Listener, listener?: Listener): this | Promise<any> {
 
         if (listener === undefined) {
@@ -1483,21 +1503,35 @@ export class Map extends Camera {
     }
 
     /**
-     * Removes an event listener for layer-specific events previously added with `Map#on`.
+     * Removes an event listener for events previously added with `Map#on`.
      *
      * @event
      * @param type - The event type previously used to install the listener.
-     * @param layerIdOrListener - The layer ID or listener previously used to install the listener.
-     * @param listener - (optional) The function previously installed as a listener.
+     * @param layer - The layer ID or listener previously used to install the listener.
+     * @param listener - The function previously installed as a listener.
      * @returns `this`
      */
-    off(type: keyof MapEventType | string, listener: Listener): this;
     off<T extends keyof MapLayerEventType>(
         type: T,
         layer: string,
         listener: (ev: MapLayerEventType[T] & Object) => void,
     ): this;
+    /**
+     * Overload of the `off` method that allows to listen to events without specifying a layer.
+     * @event
+     * @param type - The type of the event.
+     * @param listener - The function previously installed as a listener.
+     * @returns `this`
+     */
     off<T extends keyof MapEventType>(type: T, listener: (ev: MapEventType[T] & Object) => void): this;
+    /**
+     * Overload of the `off` method that allows to listen to events without specifying a layer.
+     * @event
+     * @param type - The type of the event.
+     * @param listener - The function previously installed as a listener.
+     * @returns `this`
+     */
+    off(type: keyof MapEventType | string, listener: Listener): this;
     off(type: keyof MapEventType | string, layerIdOrListener: string | Listener, listener?: Listener): this {
         if (listener === undefined) {
             return super.off(type, layerIdOrListener as Listener);

src/ui/map_events.test.ts

@@ -4,6 +4,10 @@ import {createMap, beforeMapTest} from '../util/test/util';
 import {MapGeoJSONFeature} from '../util/vectortile_to_geojson';
 import {MapLayerEventType, MapLibreEvent} from './events';
 
+type IsAny<T> = 0 extends T & 1 ? T : never;
+type NotAny<T> = T extends IsAny<T> ? never : T;
+function assertNotAny<T>(_x: NotAny<T>) { }
+
 beforeEach(() => {
     beforeMapTest();
 });
@@ -170,6 +174,20 @@ describe('map events', () => {
         expect(handler.onMove).toHaveBeenCalledTimes(1);
     });
 
+    test('Map#on allows a listener to infer the event type ', () => {
+        const map = createMap();
+
+        const spy = jest.fn();
+        map.on('mousemove', (event) => {
+            assertNotAny(event);
+            const {lng, lat} = event.lngLat;
+            spy({lng, lat});
+        });
+
+        simulate.mousemove(map.getCanvas());
+        expect(spy).toHaveBeenCalledTimes(1);
+    });
+
     test('Map#off removes a delegated event listener', () => {
         const map = createMap();
 
@@ -244,6 +262,64 @@ describe('map events', () => {
         expect(spyB).not.toHaveBeenCalled();
     });
 
+    test('Map#off calls an event listener with no type arguments, defaulting to \'unknown\' originalEvent type', () => {
+        const map = createMap();
+
+        const handler = {
+            onMove: function onMove(_event: MapLibreEvent) {}
+        };
+
+        jest.spyOn(handler, 'onMove');
+
+        map.off('move', (event) => handler.onMove(event));
+        map.jumpTo({center: {lng: 10, lat: 10}});
+
+        expect(handler.onMove).toHaveBeenCalledTimes(0);
+    });
+
+    test('Map#off allows a listener to infer the event type ', () => {
+        const map = createMap();
+
+        const spy = jest.fn();
+        map.off('mousemove', (event) => {
+            assertNotAny(event);
+            const {lng, lat} = event.lngLat;
+            spy({lng, lat});
+        });
+
+        simulate.mousemove(map.getCanvas());
+        expect(spy).toHaveBeenCalledTimes(0);
+    });
+
+    test('Map#once calls an event listener with no type arguments, defaulting to \'unknown\' originalEvent type', () => {
+        const map = createMap();
+
+        const handler = {
+            onMoveOnce: function onMoveOnce(_event: MapLibreEvent) {}
+        };
+
+        jest.spyOn(handler, 'onMoveOnce');
+
+        map.once('move', (event) => handler.onMoveOnce(event));
+        map.jumpTo({center: {lng: 10, lat: 10}});
+
+        expect(handler.onMoveOnce).toHaveBeenCalledTimes(1);
+    });
+
+    test('Map#once allows a listener to infer the event type ', () => {
+        const map = createMap();
+
+        const spy = jest.fn();
+        map.once('mousemove', (event) => {
+            assertNotAny(event);
+            const {lng, lat} = event.lngLat;
+            spy({lng, lat});
+        });
+
+        simulate.mousemove(map.getCanvas());
+        expect(spy).toHaveBeenCalledTimes(1);
+    });
+
     (['mouseenter', 'mouseover'] as (keyof MapLayerEventType)[]).forEach((event) => {
         test(`Map#on ${event} does not fire if the specified layer does not exist`, () => {
             const map = createMap();

tsconfig.dist.json → tsconfig.typecheck.json

@@ -1,7 +1,7 @@
 {
   "extends": "./tsconfig.json",
   "compilerOptions": {
-    "strict": true,
+    "strict": true
   },
   "include": [
     "dist/maplibre-gl.d.ts"

tsconfig.typegen.json

@@ -0,0 +1,9 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "types": [
+      "geojson",
+      "offscreencanvas"
+    ]
+  }
+}