maplibre-gl 2.1.0 → 2.1.4

package/src/ui/map.ts

@@ -59,49 +59,49 @@ import type {ControlPosition, IControl} from './control/control';
 /* eslint-enable no-use-before-define */
 
 export type MapOptions = {
-  hash?: boolean | string;
-  interactive?: boolean;
-  container: HTMLElement | string;
-  bearingSnap?: number;
-  attributionControl?: boolean;
-  customAttribution?: string | Array<string>;
-  logoPosition?: ControlPosition;
-  failIfMajorPerformanceCaveat?: boolean;
-  preserveDrawingBuffer?: boolean;
-  antialias?: boolean;
-  refreshExpiredTiles?: boolean;
-  maxBounds?: LngLatBoundsLike;
-  scrollZoom?: boolean;
-  minZoom?: number | null;
-  maxZoom?: number | null;
-  minPitch?: number | null;
-  maxPitch?: number | null;
-  boxZoom?: boolean;
-  dragRotate?: boolean;
-  dragPan?: DragPanOptions | boolean;
-  keyboard?: boolean;
-  doubleClickZoom?: boolean;
-  touchZoomRotate?: boolean;
-  touchPitch?: boolean;
-  trackResize?: boolean;
-  center?: LngLatLike;
-  zoom?: number;
-  bearing?: number;
-  pitch?: number;
-  renderWorldCopies?: boolean;
-  maxTileCacheSize?: number;
-  transformRequest?: RequestTransformFunction;
-  locale?: any;
-  fadeDuration?: number;
-  crossSourceCollisions?: boolean;
-  collectResourceTiming?: boolean;
-  clickTolerance?: number;
-  bounds?: LngLatBoundsLike;
-  fitBoundsOptions?: Object;
-  localIdeographFontFamily?: string;
-  style: StyleSpecification | string;
-  pitchWithRotate?: boolean;
-  pixelRatio?: number;
+    hash?: boolean | string;
+    interactive?: boolean;
+    container: HTMLElement | string;
+    bearingSnap?: number;
+    attributionControl?: boolean;
+    customAttribution?: string | Array<string>;
+    logoPosition?: ControlPosition;
+    failIfMajorPerformanceCaveat?: boolean;
+    preserveDrawingBuffer?: boolean;
+    antialias?: boolean;
+    refreshExpiredTiles?: boolean;
+    maxBounds?: LngLatBoundsLike;
+    scrollZoom?: boolean;
+    minZoom?: number | null;
+    maxZoom?: number | null;
+    minPitch?: number | null;
+    maxPitch?: number | null;
+    boxZoom?: boolean;
+    dragRotate?: boolean;
+    dragPan?: DragPanOptions | boolean;
+    keyboard?: boolean;
+    doubleClickZoom?: boolean;
+    touchZoomRotate?: boolean;
+    touchPitch?: boolean;
+    trackResize?: boolean;
+    center?: LngLatLike;
+    zoom?: number;
+    bearing?: number;
+    pitch?: number;
+    renderWorldCopies?: boolean;
+    maxTileCacheSize?: number;
+    transformRequest?: RequestTransformFunction;
+    locale?: any;
+    fadeDuration?: number;
+    crossSourceCollisions?: boolean;
+    collectResourceTiming?: boolean;
+    clickTolerance?: number;
+    bounds?: LngLatBoundsLike;
+    fitBoundsOptions?: Object;
+    localIdeographFontFamily?: string;
+    style: StyleSpecification | string;
+    pitchWithRotate?: boolean;
+    pixelRatio?: number;
 };
 
 // See article here: https://medium.com/terria/typescript-transforming-optional-properties-to-required-properties-that-may-be-undefined-7482cb4e1585
@@ -212,19 +212,19 @@ const defaultOptions = {
  * @param {boolean} [options.doubleClickZoom=true] If `true`, the "double click to zoom" interaction is enabled (see {@link DoubleClickZoomHandler}).
  * @param {boolean|Object} [options.touchZoomRotate=true] If `true`, the "pinch to rotate and zoom" interaction is enabled. An `Object` value is passed as options to {@link TouchZoomRotateHandler#enable}.
  * @param {boolean|Object} [options.touchPitch=true] If `true`, the "drag to pitch" interaction is enabled. An `Object` value is passed as options to {@link TouchPitchHandler#enable}.
- * @param {boolean} [options.trackResize=true]  If `true`, the map will automatically resize when the browser window resizes.
+ * @param {boolean} [options.trackResize=true] If `true`, the map will automatically resize when the browser window resizes.
  * @param {LngLatLike} [options.center=[0, 0]] The initial geographical centerpoint of the map. If `center` is not specified in the constructor options, MapLibre GL JS will look for it in the map's style object. If it is not specified in the style, either, it will default to `[0, 0]` Note: MapLibre GL uses longitude, latitude coordinate order (as opposed to latitude, longitude) to match GeoJSON.
  * @param {number} [options.zoom=0] The initial zoom level of the map. If `zoom` is not specified in the constructor options, MapLibre GL JS will look for it in the map's style object. If it is not specified in the style, either, it will default to `0`.
  * @param {number} [options.bearing=0] The initial bearing (rotation) of the map, measured in degrees counter-clockwise from north. If `bearing` is not specified in the constructor options, MapLibre GL JS will look for it in the map's style object. If it is not specified in the style, either, it will default to `0`.
  * @param {number} [options.pitch=0] The initial pitch (tilt) of the map, measured in degrees away from the plane of the screen (0-85). If `pitch` is not specified in the constructor options, MapLibre GL JS will look for it in the map's style object. If it is not specified in the style, either, it will default to `0`. Values greater than 60 degrees are experimental and may result in rendering issues. If you encounter any, please raise an issue with details in the MapLibre project.
  * @param {LngLatBoundsLike} [options.bounds] The initial bounds of the map. If `bounds` is specified, it overrides `center` and `zoom` constructor options.
  * @param {Object} [options.fitBoundsOptions] A {@link Map#fitBounds} options object to use _only_ when fitting the initial `bounds` provided above.
- * @param {boolean} [options.renderWorldCopies=true]  If `true`, multiple copies of the world will be rendered side by side beyond -180 and 180 degrees longitude. If set to `false`:
+ * @param {boolean} [options.renderWorldCopies=true] If `true`, multiple copies of the world will be rendered side by side beyond -180 and 180 degrees longitude. If set to `false`:
  * - When the map is zoomed out far enough that a single representation of the world does not fill the map's entire
  * container, there will be blank space beyond 180 and -180 degrees longitude.
  * - Features that cross 180 and -180 degrees longitude will be cut in two (with one portion on the right edge of the
  * map and the other on the left edge of the map) at every zoom level.
- * @param {number} [options.maxTileCacheSize=null]  The maximum number of tiles stored in the tile cache for a given source. If omitted, the cache will be dynamically sized based on the current viewport.
+ * @param {number} [options.maxTileCacheSize=null] The maximum number of tiles stored in the tile cache for a given source. If omitted, the cache will be dynamically sized based on the current viewport.
  * @param {string} [options.localIdeographFontFamily='sans-serif'] Defines a CSS
  *   font-family for locally overriding generation of glyphs in the 'CJK Unified Ideographs', 'Hiragana', 'Katakana' and 'Hangul Syllables' ranges.
  *   In these ranges, font settings from the map's style will be ignored, except for font-weight keywords (light/regular/medium/bold).
@@ -476,6 +476,9 @@ class Map extends Camera {
         this.on('dataloading', (event: MapDataEvent) => {
             this.fire(new Event(`${event.dataType}dataloading`, event));
         });
+        this.on('dataabort', (event: MapDataEvent) => {
+            this.fire(new Event('sourcedataabort', event));
+        });
     }
 
     /*
@@ -618,7 +621,7 @@ class Map extends Camera {
      * Sets the map's pixel ratio. This allows to override `devicePixelRatio`.
      * After this call, the canvas' `width` attribute will be `container.clientWidth * pixelRatio`
      * and its height attribute will be `container.clientHeight * pixelRatio`.
-     * @param pixelRatio {number} The pixel ratio.
+     * @param {number} pixelRatio The pixel ratio.
      */
     setPixelRatio(pixelRatio: number) {
         const [width, height] = this._containerDimensions();
@@ -1018,6 +1021,8 @@ class Map extends Camera {
      * | [`styledataloading`](#map.event:styledataloading)         |                           |
      * | [`sourcedataloading`](#map.event:sourcedataloading)       |                           |
      * | [`styleimagemissing`](#map.event:styleimagemissing)       |                           |
+     * | [`dataabort`](#map.event:dataabort)                       |                           |
+     * | [`sourcedataabort`](#map.event:sourcedataabort)           |                           |
      *
      * @param {string | Listener} layerIdOrListener 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
@@ -1338,9 +1343,9 @@ class Map extends Camera {
      *
      */
     querySourceFeatures(sourceId: string, parameters?: {
-      sourceLayer: string;
-      filter: Array<any>;
-      validate?: boolean;
+        sourceLayer: string;
+        filter: Array<any>;
+        validate?: boolean;
     } | null) {
         return this.style.querySourceFeatures(sourceId, parameters);
     }
@@ -1372,7 +1377,7 @@ class Map extends Camera {
      *
      */
     setStyle(style: StyleSpecification | string | null, options?: {
-      diff?: boolean;
+        diff?: boolean;
     } & StyleOptions) {
         options = extend({}, {localIdeographFontFamily: this._localIdeographFontFamily}, options);
 
@@ -1388,10 +1393,10 @@ class Map extends Camera {
     /**
      *  Updates the requestManager's transform request with a new function
      *
-     *  @param transformRequest A callback run before the Map makes a request for an external URL. The callback can be used to modify the url, set headers, or set the credentials property for cross-origin requests.
+     * @param transformRequest A callback run before the Map makes a request for an external URL. The callback can be used to modify the url, set headers, or set the credentials property for cross-origin requests.
      *    Expected to return an object with a `url` property and optionally `headers` and `credentials` properties
      *
-     *  @returns {Map} `this`
+     * @returns {Map} `this`
      *
      *  @example
      *  map.setTransformRequest((url: string, resourceType: string) => {});
@@ -1411,7 +1416,7 @@ class Map extends Camera {
     }
 
     _updateStyle(style: StyleSpecification | string | null,  options?: {
-      diff?: boolean;
+        diff?: boolean;
     } & StyleOptions) {
         if (this.style) {
             this.style.setEventedParent(null);
@@ -1445,7 +1450,7 @@ class Map extends Camera {
     }
 
     _diffStyle(style: StyleSpecification | string,  options?: {
-      diff?: boolean;
+        diff?: boolean;
     } & StyleOptions) {
         if (typeof style === 'string') {
             const url = style;
@@ -1463,7 +1468,7 @@ class Map extends Camera {
     }
 
     _updateDiff(style: StyleSpecification,  options?: {
-      diff?: boolean;
+        diff?: boolean;
     } & StyleOptions) {
         try {
             if (this.style.setState(style)) {
@@ -1648,9 +1653,9 @@ class Map extends Camera {
      * @param options Options object.
      * @param options.pixelRatio The ratio of pixels in the image to physical pixels on the screen
      * @param options.sdf Whether the image should be interpreted as an SDF image
-     * @param options.content  `[x1, y1, x2, y2]`  If `icon-text-fit` is used in a layer with this image, this option defines the part of the image that can be covered by the content in `text-field`.
-     * @param options.stretchX  `[[x1, x2], ...]` If `icon-text-fit` is used in a layer with this image, this option defines the part(s) of the image that can be stretched horizontally.
-     * @param options.stretchY  `[[y1, y2], ...]` If `icon-text-fit` is used in a layer with this image, this option defines the part(s) of the image that can be stretched vertically.
+     * @param options.content `[x1, y1, x2, y2]`  If `icon-text-fit` is used in a layer with this image, this option defines the part of the image that can be covered by the content in `text-field`.
+     * @param options.stretchX `[[x1, x2], ...]` If `icon-text-fit` is used in a layer with this image, this option defines the part(s) of the image that can be stretched horizontally.
+     * @param options.stretchY `[[y1, y2], ...]` If `icon-text-fit` is used in a layer with this image, this option defines the part(s) of the image that can be stretched vertically.
      *
      * @example
      * // If the style's sprite does not already contain an image with ID 'cat',
@@ -1679,18 +1684,18 @@ class Map extends Camera {
      * @see Use `ImageData`: [Add a generated icon to the map](https://maplibre.org/maplibre-gl-js-docs/example/add-image-generated/)
      */
     addImage(id: string,
-             image: HTMLImageElement | ImageBitmap | ImageData | {
-               width: number;
-               height: number;
-               data: Uint8Array | Uint8ClampedArray;
-             } | StyleImageInterface,
-             {
-                 pixelRatio = 1,
-                 sdf = false,
-                 stretchX,
-                 stretchY,
-                 content
-             }: Partial<StyleImageMetadata> = {}) {
+        image: HTMLImageElement | ImageBitmap | ImageData | {
+            width: number;
+            height: number;
+            data: Uint8Array | Uint8ClampedArray;
+        } | StyleImageInterface,
+        {
+            pixelRatio = 1,
+            sdf = false,
+            stretchX,
+            stretchY,
+            content
+        }: Partial<StyleImageMetadata> = {}) {
         this._lazyInitEmptyStyle();
         const version = 0;
 
@@ -1742,9 +1747,9 @@ class Map extends Camera {
      */
     updateImage(id: string,
         image: HTMLImageElement | ImageBitmap | ImageData | {
-          width: number;
-          height: number;
-          data: Uint8Array | Uint8ClampedArray;
+            width: number;
+            height: number;
+            data: Uint8Array | Uint8ClampedArray;
         } | StyleImageInterface) {
 
         const existingImage = this.style.getImage(id);
@@ -1781,7 +1786,7 @@ class Map extends Camera {
      *
      * @param id The ID of the image.
      *
-     * @returns {boolean}  A Boolean indicating whether the image exists.
+     * @returns {boolean} A Boolean indicating whether the image exists.
      * @example
      * // Check if an image with the ID 'cat' exists in
      * // the style's sprite.
@@ -1834,16 +1839,16 @@ class Map extends Camera {
     }
 
     /**
-    * Returns an Array of strings containing the IDs of all images currently available in the map.
-    * This includes both images from the style's original sprite
-    * and any images that have been added at runtime using {@link Map#addImage}.
-    *
-    * @returns {Array<string>} An Array of strings containing the names of all sprites/images currently available in the map.
-    *
-    * @example
-    * var allImages = map.listImages();
-    *
-    */
+     * Returns an Array of strings containing the IDs of all images currently available in the map.
+     * This includes both images from the style's original sprite
+     * and any images that have been added at runtime using {@link Map#addImage}.
+     *
+     * @returns {Array<string>} An Array of strings containing the names of all sprites/images currently available in the map.
+     *
+     * @example
+     * var allImages = map.listImages();
+     *
+     */
     listImages() {
         return this.style.listImages();
     }
@@ -2207,9 +2212,9 @@ class Map extends Camera {
      * @see [Create a hover effect](https://maplibre.org/maplibre-gl-js-docs/example/hover-styles/)
      */
     setFeatureState(feature: {
-      source: string;
-      sourceLayer?: string;
-      id: string | number;
+        source: string;
+        sourceLayer?: string;
+        id: string | number;
     }, state: any) {
         this.style.setFeatureState(feature, state);
         return this._update();
@@ -2261,11 +2266,11 @@ class Map extends Camera {
      *   }, 'hover');
      * });
      *
-    */
+     */
     removeFeatureState(target: {
-      source: string;
-      sourceLayer?: string;
-      id?: string | number;
+        source: string;
+        sourceLayer?: string;
+        id?: string | number;
     }, key?: string) {
         this.style.removeFeatureState(target, key);
         return this._update();
@@ -2301,11 +2306,11 @@ class Map extends Camera {
      *
      */
     getFeatureState(
-      feature: {
-        source: string;
-        sourceLayer?: string;
-        id: string | number;
-      }
+        feature: {
+            source: string;
+            sourceLayer?: string;
+            id: string | number;
+        }
     ): any {
         return this.style.getFeatureState(feature);
     }
@@ -2634,11 +2639,11 @@ class Map extends Camera {
     }
 
     /**
-    * Force a synchronous redraw of the map.
-    * @example
-    * map.redraw();
-    * @returns {Map} `this`
-    */
+     * Force a synchronous redraw of the map.
+     * @example
+     * map.redraw();
+     * @returns {Map} `this`
+     */
     redraw(): Map {
         if (this.style) {
             // cancel the scheduled update

package/src/ui/map_events.test.ts

@@ -1,4 +1,4 @@
-import simulate, {window} from '../../test/util/simulate_interaction';
+import simulate, {window} from '../../test/unit/lib/simulate_interaction';
 import StyleLayer from '../style/style_layer';
 import {createMap, setPerformance, setWebGlContext} from '../util/test/util';
 import {MapLayerEventType} from './events';

package/src/ui/marker.test.ts

@@ -3,7 +3,7 @@ import Marker from './marker';
 import Popup from './popup';
 import LngLat from '../geo/lng_lat';
 import Point from '@mapbox/point-geometry';
-import simulate from '../../test/util/simulate_interaction';
+import simulate from '../../test/unit/lib/simulate_interaction';
 
 function createMap(options = {}) {
     const container = window.document.createElement('div');
@@ -46,16 +46,16 @@ describe('marker', () => {
 
         // initial dimensions of svg element
         expect(
-        defaultMarker.getElement().children[0].getAttribute('height').includes('41')
+            defaultMarker.getElement().children[0].getAttribute('height').includes('41')
         ).toBeTruthy();
         expect(defaultMarker.getElement().children[0].getAttribute('width').includes('27')).toBeTruthy();
 
         // (41 * 0.8) = 32.8, (27 * 0.8) = 21.6
         expect(
-        smallerMarker.getElement().children[0].getAttribute('height').includes('32.8')
+            smallerMarker.getElement().children[0].getAttribute('height').includes('32.8')
         ).toBeTruthy();
         expect(
-        smallerMarker.getElement().children[0].getAttribute('width').includes('21.6')
+            smallerMarker.getElement().children[0].getAttribute('width').includes('21.6')
         ).toBeTruthy();
 
         // (41 * 2) = 82, (27 * 2) = 54
@@ -287,49 +287,49 @@ describe('marker', () => {
 
         // marker should default to above since it has enough space
         expect(
-        marker.getPopup()._container.classList.contains('maplibregl-popup-anchor-bottom')
+            marker.getPopup()._container.classList.contains('maplibregl-popup-anchor-bottom')
         ).toBeTruthy();
 
         // move marker to the top forcing the popup to below
         marker.setLngLat(map.unproject([mapHeight / 2, markerTop]));
         expect(
-        marker.getPopup()._container.classList.contains('maplibregl-popup-anchor-top')
+            marker.getPopup()._container.classList.contains('maplibregl-popup-anchor-top')
         ).toBeTruthy();
 
         // move marker to the right forcing the popup to the left
         marker.setLngLat(map.unproject([mapHeight - markerRight, mapHeight / 2]));
         expect(
-        marker.getPopup()._container.classList.contains('maplibregl-popup-anchor-right')
+            marker.getPopup()._container.classList.contains('maplibregl-popup-anchor-right')
         ).toBeTruthy();
 
         // move marker to the left forcing the popup to the right
         marker.setLngLat(map.unproject([markerRight, mapHeight / 2]));
         expect(
-        marker.getPopup()._container.classList.contains('maplibregl-popup-anchor-left')
+            marker.getPopup()._container.classList.contains('maplibregl-popup-anchor-left')
         ).toBeTruthy();
 
         // move marker to the top left forcing the popup to the bottom right
         marker.setLngLat(map.unproject([markerRight, markerTop]));
         expect(
-        marker.getPopup()._container.classList.contains('maplibregl-popup-anchor-top-left')
+            marker.getPopup()._container.classList.contains('maplibregl-popup-anchor-top-left')
         ).toBeTruthy();
 
         // move marker to the top right forcing the popup to the bottom left
         marker.setLngLat(map.unproject([mapHeight - markerRight, markerTop]));
         expect(
-        marker.getPopup()._container.classList.contains('maplibregl-popup-anchor-top-right')
+            marker.getPopup()._container.classList.contains('maplibregl-popup-anchor-top-right')
         ).toBeTruthy();
 
         // move marker to the bottom left forcing the popup to the top right
         marker.setLngLat(map.unproject([markerRight, mapHeight]));
         expect(
-        marker.getPopup()._container.classList.contains('maplibregl-popup-anchor-bottom-left')
+            marker.getPopup()._container.classList.contains('maplibregl-popup-anchor-bottom-left')
         ).toBeTruthy();
 
         // move marker to the bottom right forcing the popup to the top left
         marker.setLngLat(map.unproject([mapHeight - markerRight, mapHeight]));
         expect(
-        marker.getPopup()._container.classList.contains('maplibregl-popup-anchor-bottom-right')
+            marker.getPopup()._container.classList.contains('maplibregl-popup-anchor-bottom-right')
         ).toBeTruthy();
 
     });

package/src/ui/marker.ts

@@ -13,16 +13,16 @@ import type {MapMouseEvent, MapTouchEvent} from './events';
 import type {PointLike} from './camera';
 
 type MarkerOptions = {
-  element?: HTMLElement;
-  offset?: PointLike;
-  anchor?: PositionAnchor;
-  color?: string;
-  scale?: number;
-  draggable?: boolean;
-  clickTolerance?: number;
-  rotation?: number;
-  rotationAlignment?: string;
-  pitchAlignment?: string;
+    element?: HTMLElement;
+    offset?: PointLike;
+    anchor?: PositionAnchor;
+    color?: string;
+    scale?: number;
+    draggable?: boolean;
+    clickTolerance?: number;
+    rotation?: number;
+    rotationAlignment?: string;
+    pitchAlignment?: string;
 };
 
 /**
@@ -289,29 +289,29 @@ export default class Marker extends Evented {
      * the marker on screen.
      *
      * @returns {LngLat} A {@link LngLat} describing the marker's location.
-    * @example
-    * // Store the marker's longitude and latitude coordinates in a variable
-    * var lngLat = marker.getLngLat();
-    * // Print the marker's longitude and latitude values in the console
-    * console.log('Longitude: ' + lngLat.lng + ', Latitude: ' + lngLat.lat )
-    * @see [Create a draggable Marker](https://maplibre.org/maplibre-gl-js-docs/example/drag-a-marker/)
-    */
+     * @example
+     * // Store the marker's longitude and latitude coordinates in a variable
+     * var lngLat = marker.getLngLat();
+     * // Print the marker's longitude and latitude values in the console
+     * console.log('Longitude: ' + lngLat.lng + ', Latitude: ' + lngLat.lat )
+     * @see [Create a draggable Marker](https://maplibre.org/maplibre-gl-js-docs/example/drag-a-marker/)
+     */
     getLngLat() {
         return this._lngLat;
     }
 
     /**
-    * Set the marker's geographical position and move it.
-    * @param {LngLat} lnglat A {@link LngLat} describing where the marker should be located.
-    * @returns {Marker} `this`
-    * @example
-    * // Create a new marker, set the longitude and latitude, and add it to the map
-    * new maplibregl.Marker()
-    *   .setLngLat([-65.017, -16.457])
-    *   .addTo(map);
-    * @see [Add custom icons with Markers](https://maplibre.org/maplibre-gl-js-docs/example/custom-marker-icons/)
-    * @see [Create a draggable Marker](https://maplibre.org/maplibre-gl-js-docs/example/drag-a-marker/)
-    */
+     * Set the marker's geographical position and move it.
+     * @param {LngLat} lnglat A {@link LngLat} describing where the marker should be located.
+     * @returns {Marker} `this`
+     * @example
+     * // Create a new marker, set the longitude and latitude, and add it to the map
+     * new maplibregl.Marker()
+     *   .setLngLat([-65.017, -16.457])
+     *   .addTo(map);
+     * @see [Add custom icons with Markers](https://maplibre.org/maplibre-gl-js-docs/example/custom-marker-icons/)
+     * @see [Create a draggable Marker](https://maplibre.org/maplibre-gl-js-docs/example/drag-a-marker/)
+     */
     setLngLat(lnglat: LngLatLike) {
         this._lngLat = LngLat.convert(lnglat);
         this._pos = null;
@@ -437,7 +437,7 @@ export default class Marker extends Evented {
     }
 
     _update(e?: {
-      type: 'move' | 'moveend';
+        type: 'move' | 'moveend';
     }) {
         if (!this._map) return;
 
@@ -545,14 +545,14 @@ export default class Marker extends Evented {
         // only fire dragend if it was preceded by at least one drag event
         if (this._state === 'active') {
             /**
-            * Fired when the marker is finished being dragged
-            *
-            * @event dragend
-            * @memberof Marker
-            * @instance
-            * @type {Object}
-            * @property {Marker} marker object that was dragged
-            */
+             * Fired when the marker is finished being dragged
+             *
+             * @event dragend
+             * @memberof Marker
+             * @instance
+             * @type {Object}
+             * @property {Marker} marker object that was dragged
+             */
             this.fire(new Event('dragend'));
         }
 

package/src/ui/popup.test.ts

@@ -2,7 +2,7 @@ import {createMap as globalCreateMap, setPerformance, setWebGlContext} from '../
 import Popup, {Offset} from './popup';
 import LngLat from '../geo/lng_lat';
 import Point from '@mapbox/point-geometry';
-import simulate from '../../test/util/simulate_interaction';
+import simulate from '../../test/unit/lib/simulate_interaction';
 import {PositionAnchor} from './anchor';
 
 const containerWidth = 512;
@@ -91,7 +91,7 @@ describe('popup', () => {
             .addTo(map);
 
         expect(
-        popup.getElement().querySelectorAll('.maplibregl-popup-close-button')
+            popup.getElement().querySelectorAll('.maplibregl-popup-close-button')
         ).toHaveLength(0);
     });
 
@@ -561,7 +561,7 @@ describe('popup', () => {
             .addTo(map);
 
         expect(
-        popup._container.classList.value
+            popup._container.classList.value
         ).toContain('maplibregl-popup-track-pointer');
     });
 
@@ -574,7 +574,7 @@ describe('popup', () => {
         popup.setText('Test');
 
         expect(
-        popup._container.classList.value
+            popup._container.classList.value
         ).toContain('maplibregl-popup-track-pointer');
     });
 
@@ -587,7 +587,7 @@ describe('popup', () => {
         popup.trackPointer();
 
         expect(
-        popup._container.classList.value
+            popup._container.classList.value
         ).toContain('maplibregl-popup-track-pointer');
     });
 
@@ -601,7 +601,7 @@ describe('popup', () => {
 
         expect(popup._pos).toEqual(map.project([0, 0]));
         expect(
-        popup._container.classList.value
+            popup._container.classList.value
         ).not.toContain('maplibregl-popup-track-pointer');
     });
 
@@ -613,7 +613,7 @@ describe('popup', () => {
             .addTo(map);
 
         expect(
-        popup._container.classList.value
+            popup._container.classList.value
         ).not.toContain('maplibregl-popup-track-pointer');
     });
 

package/src/ui/popup.ts

@@ -21,18 +21,18 @@ const defaultOptions = {
 };
 
 export type Offset = number | PointLike | {
-  [_ in PositionAnchor]: PointLike;
+    [_ in PositionAnchor]: PointLike;
 };
 
 export type PopupOptions = {
-  closeButton?: boolean;
-  closeOnClick?: boolean;
-  closeOnMove?: boolean;
-  focusAfterOpen?: boolean;
-  anchor?: PositionAnchor;
-  offset?: Offset;
-  className?: string;
-  maxWidth?: string;
+    closeButton?: boolean;
+    closeOnClick?: boolean;
+    closeOnMove?: boolean;
+    focusAfterOpen?: boolean;
+    anchor?: PositionAnchor;
+    offset?: Offset;
+    className?: string;
+    maxWidth?: string;
 };
 
 const focusQuerySelector = [