maplibre-gl 2.1.1 → 2.1.2

package/src/geo/lng_lat_bounds.ts

@@ -126,51 +126,51 @@ class LngLatBounds {
     getSouthWest(): LngLat { return this._sw; }
 
     /**
-    * Returns the northeast corner of the bounding box.
-    *
-    * @returns {LngLat} The northeast corner of the bounding box.
+     * Returns the northeast corner of the bounding box.
+     *
+     * @returns {LngLat} The northeast corner of the bounding box.
      */
     getNorthEast(): LngLat { return this._ne; }
 
     /**
-    * Returns the northwest corner of the bounding box.
-    *
-    * @returns {LngLat} The northwest corner of the bounding box.
+     * Returns the northwest corner of the bounding box.
+     *
+     * @returns {LngLat} The northwest corner of the bounding box.
      */
     getNorthWest(): LngLat { return new LngLat(this.getWest(), this.getNorth()); }
 
     /**
-    * Returns the southeast corner of the bounding box.
-    *
-    * @returns {LngLat} The southeast corner of the bounding box.
+     * Returns the southeast corner of the bounding box.
+     *
+     * @returns {LngLat} The southeast corner of the bounding box.
      */
     getSouthEast(): LngLat { return new LngLat(this.getEast(), this.getSouth()); }
 
     /**
-    * Returns the west edge of the bounding box.
-    *
-    * @returns {number} The west edge of the bounding box.
+     * Returns the west edge of the bounding box.
+     *
+     * @returns {number} The west edge of the bounding box.
      */
     getWest(): number { return this._sw.lng; }
 
     /**
-    * Returns the south edge of the bounding box.
-    *
-    * @returns {number} The south edge of the bounding box.
+     * Returns the south edge of the bounding box.
+     *
+     * @returns {number} The south edge of the bounding box.
      */
     getSouth(): number { return this._sw.lat; }
 
     /**
-    * Returns the east edge of the bounding box.
-    *
-    * @returns {number} The east edge of the bounding box.
+     * Returns the east edge of the bounding box.
+     *
+     * @returns {number} The east edge of the bounding box.
      */
     getEast(): number { return this._ne.lng; }
 
     /**
-    * Returns the north edge of the bounding box.
-    *
-    * @returns {number} The north edge of the bounding box.
+     * Returns the north edge of the bounding box.
+     *
+     * @returns {number} The north edge of the bounding box.
      */
     getNorth(): number { return this._ne.lat; }
 
@@ -210,20 +210,20 @@ class LngLatBounds {
     }
 
     /**
-    * Check if the point is within the bounding box.
-    *
-    * @param {LngLatLike} lnglat geographic point to check against.
-    * @returns {boolean} True if the point is within the bounding box.
-    * @example
-    * var llb = new maplibregl.LngLatBounds(
-    *   new maplibregl.LngLat(-73.9876, 40.7661),
-    *   new maplibregl.LngLat(-73.9397, 40.8002)
-    * );
-    *
-    * var ll = new maplibregl.LngLat(-73.9567, 40.7789);
-    *
-    * console.log(llb.contains(ll)); // = true
-    */
+     * Check if the point is within the bounding box.
+     *
+     * @param {LngLatLike} lnglat geographic point to check against.
+     * @returns {boolean} True if the point is within the bounding box.
+     * @example
+     * var llb = new maplibregl.LngLatBounds(
+     *   new maplibregl.LngLat(-73.9876, 40.7661),
+     *   new maplibregl.LngLat(-73.9397, 40.8002)
+     * );
+     *
+     * var ll = new maplibregl.LngLat(-73.9567, 40.7789);
+     *
+     * console.log(llb.contains(ll)); // = true
+     */
     contains(lnglat: LngLatLike) {
         const {lng, lat} = LngLat.convert(lnglat);
 

package/src/geo/mercator_coordinate.ts

@@ -99,9 +99,9 @@ class MercatorCoordinate {
         const lngLat = LngLat.convert(lngLatLike);
 
         return new MercatorCoordinate(
-                mercatorXfromLng(lngLat.lng),
-                mercatorYfromLat(lngLat.lat),
-                mercatorZfromAltitude(altitude, lngLat.lat));
+            mercatorXfromLng(lngLat.lng),
+            mercatorYfromLat(lngLat.lat),
+            mercatorZfromAltitude(altitude, lngLat.lat));
     }
 
     /**
@@ -114,8 +114,8 @@ class MercatorCoordinate {
      */
     toLngLat() {
         return new LngLat(
-                lngFromMercatorX(this.x),
-                latFromMercatorY(this.y));
+            lngFromMercatorX(this.x),
+            latFromMercatorY(this.y));
     }
 
     /**

package/src/geo/transform.test.ts

@@ -2,7 +2,7 @@ import Point from '@mapbox/point-geometry';
 import Transform from './transform';
 import LngLat from './lng_lat';
 import {OverscaledTileID, CanonicalTileID} from '../source/tile_id';
-import {fixedLngLat, fixedCoord} from '../../test/util/fixed';
+import {fixedLngLat, fixedCoord} from '../../test/unit/lib/fixed';
 
 describe('transform', () => {
     test('creates a transform', () => {

package/src/geo/transform.ts

@@ -262,8 +262,8 @@ class Transform {
      * @returns {number} zoom level An integer zoom level at which all tiles will be visible.
      */
     coveringZoomLevel(options: {
-      roundZoom?: boolean;
-      tileSize: number;
+        roundZoom?: boolean;
+        tileSize: number;
     }) {
         const z = (options.roundZoom ? Math.round : Math.floor)(
             this.zoom + this.scaleZoom(this.tileSize / options.tileSize)
@@ -315,14 +315,14 @@ class Transform {
      * @private
      */
     coveringTiles(
-      options: {
-        tileSize: number;
-        minzoom?: number;
-        maxzoom?: number;
-        roundZoom?: boolean;
-        reparseOverscaled?: boolean;
-        renderWorldCopies?: boolean;
-      }
+        options: {
+            tileSize: number;
+            minzoom?: number;
+            maxzoom?: number;
+            roundZoom?: boolean;
+            reparseOverscaled?: boolean;
+            renderWorldCopies?: boolean;
+        }
     ): Array<OverscaledTileID> {
         let z = this.coveringZoomLevel(options);
         const actualZ = z;
@@ -436,8 +436,8 @@ class Transform {
     project(lnglat: LngLat) {
         const lat = clamp(lnglat.lat, -this.maxValidLatitude, this.maxValidLatitude);
         return new Point(
-                mercatorXfromLng(lnglat.lng) * this.worldSize,
-                mercatorYfromLat(lat) * this.worldSize);
+            mercatorXfromLng(lnglat.lng) * this.worldSize,
+            mercatorYfromLat(lat) * this.worldSize);
     }
 
     unproject(point: Point): LngLat {
@@ -451,8 +451,8 @@ class Transform {
         const b = this.pointCoordinate(this.centerPoint);
         const loc = this.locationCoordinate(lnglat);
         const newCenter = new MercatorCoordinate(
-                loc.x - (a.x - b.x),
-                loc.y - (a.y - b.y));
+            loc.x - (a.x - b.x),
+            loc.y - (a.y - b.y));
         this.center = this.coordinateLocation(newCenter);
         if (this._renderWorldCopies) {
             this.center = this.center.wrap();

package/src/gl/context.ts

@@ -17,9 +17,9 @@ import type {
 import type Color from '../style-spec/util/color';
 
 type ClearArgs = {
-  color?: Color;
-  depth?: number;
-  stencil?: number;
+    color?: Color;
+    depth?: number;
+    stencil?: number;
 };
 
 class Context {

package/src/gl/types.ts

@@ -15,9 +15,9 @@ export type DepthRangeType = [number, number];
 export type DepthFuncType = CompareFuncType;
 
 export type StencilFuncType = {
-  func: CompareFuncType;
-  ref: number;
-  mask: number;
+    func: CompareFuncType;
+    ref: number;
+    mask: number;
 };
 
 export type StencilOpConstant = WebGLRenderingContext['KEEP'] | WebGLRenderingContext['ZERO'] | WebGLRenderingContext['REPLACE'] | WebGLRenderingContext['INCR'] | WebGLRenderingContext['INCR_WRAP'] | WebGLRenderingContext['DECR'] | WebGLRenderingContext['DECR_WRAP'] | WebGLRenderingContext['INVERT'];
@@ -29,29 +29,29 @@ export type TextureUnitType = number;
 export type ViewportType = [number, number, number, number];
 
 export type StencilTestGL = {
-  func: WebGLRenderingContext['NEVER'];
-  mask: 0;
+    func: WebGLRenderingContext['NEVER'];
+    mask: 0;
 } | {
-  func: WebGLRenderingContext['LESS'];
-  mask: number;
+    func: WebGLRenderingContext['LESS'];
+    mask: number;
 } | {
-  func: WebGLRenderingContext['EQUAL'];
-  mask: number;
+    func: WebGLRenderingContext['EQUAL'];
+    mask: number;
 } | {
-  func: WebGLRenderingContext['LEQUAL'];
-  mask: number;
+    func: WebGLRenderingContext['LEQUAL'];
+    mask: number;
 } | {
-  func: WebGLRenderingContext['GREATER'];
-  mask: number;
+    func: WebGLRenderingContext['GREATER'];
+    mask: number;
 } | {
-  func: WebGLRenderingContext['NOTEQUAL'];
-  mask: number;
+    func: WebGLRenderingContext['NOTEQUAL'];
+    mask: number;
 } | {
-  func: WebGLRenderingContext['GEQUAL'];
-  mask: number;
+    func: WebGLRenderingContext['GEQUAL'];
+    mask: number;
 } | {
-  func: WebGLRenderingContext['ALWAYS'];
-  mask: 0;
+    func: WebGLRenderingContext['ALWAYS'];
+    mask: 0;
 };
 
 export type CullFaceModeType = WebGLRenderingContext['FRONT'] | WebGLRenderingContext['BACK'] | WebGLRenderingContext['FRONT_AND_BACK'];

package/src/gl/value.ts

@@ -17,12 +17,12 @@ import type {
 } from './types';
 
 export interface IValue<T> {
-  current: T;
-  default: T;
-  dirty: boolean;
-  get(): T;
-  setDefault(): void;
-  set(value: T): void;
+    current: T;
+    default: T;
+    dirty: boolean;
+    get(): T;
+    setDefault(): void;
+    set(value: T): void;
 }
 
 class BaseValue<T> implements IValue<T> {

package/src/gl/vertex_buffer.test.ts

@@ -1,5 +1,5 @@
 import VertexBuffer from './vertex_buffer';
-import {StructArrayLayout3i6} from '../data/array_types';
+import {StructArrayLayout3i6} from '../data/array_types.g';
 import Context from '../gl/context';
 import gl from 'gl';
 import {StructArrayMember} from '../util/struct_array';

package/src/index.ts

@@ -1,4 +1,3 @@
-/// <reference path="./types/glsl.d.ts" />
 import assert from 'assert';
 import {supported} from '@mapbox/mapbox-gl-supported';
 
@@ -24,8 +23,16 @@ import WorkerPool from './util/worker_pool';
 import {prewarm, clearPrewarmedResources} from './util/global_worker_pool';
 import {clearTileCache} from './util/tile_request_cache';
 import {PerformanceUtils} from './util/performance';
+import {AJAXError} from './util/ajax';
 import type {RequestParameters, ResponseCallback} from './util/ajax';
 import type {Cancelable} from './types/cancelable';
+import GeoJSONSource from './source/geojson_source';
+import CanvasSource from './source/canvas_source';
+import ImageSource from './source/image_source';
+import RasterDEMTileSource from './source/raster_dem_tile_source';
+import RasterTileSource from './source/raster_tile_source';
+import VectorTileSource from './source/vector_tile_source';
+import VideoSource from './source/video_source';
 
 const exported = {
     supported,
@@ -45,7 +52,15 @@ const exported = {
     Point,
     MercatorCoordinate,
     Evented,
+    AJAXError,
     config,
+    CanvasSource,
+    GeoJSONSource,
+    ImageSource,
+    RasterDEMTileSource,
+    RasterTileSource,
+    VectorTileSource,
+    VideoSource,
     /**
      * Initializes resources like WebWorkers that can be shared across maps to lower load
      * times in some situations. `maplibregl.workerUrl` and `maplibregl.workerCount`, if being
@@ -223,14 +238,14 @@ Debug.extend(exported, {isSafari, getPerformanceMetrics: PerformanceUtils.getPer
  */
 
 /**
-  * Gets the map's [RTL text plugin](https://www.mapbox.com/mapbox-gl-js/plugins/#mapbox-gl-rtl-text) status.
-  * The status can be `unavailable` (i.e. not requested or removed), `loading`, `loaded` or `error`.
-  * If the status is `loaded` and the plugin is requested again, an error will be thrown.
-  *
-  * @function getRTLTextPluginStatus
-  * @example
-  * const pluginStatus = maplibregl.getRTLTextPluginStatus();
-  */
+ * Gets the map's [RTL text plugin](https://www.mapbox.com/mapbox-gl-js/plugins/#mapbox-gl-rtl-text) status.
+ * The status can be `unavailable` (i.e. not requested or removed), `loading`, `loaded` or `error`.
+ * If the status is `loaded` and the plugin is requested again, an error will be thrown.
+ *
+ * @function getRTLTextPluginStatus
+ * @example
+ * const pluginStatus = maplibregl.getRTLTextPluginStatus();
+ */
 
 export default exported;
 // canary assert: used to confirm that asserts have been removed from production build

package/src/render/draw_circle.ts

@@ -19,17 +19,17 @@ import type {CircleUniformsType} from './program/circle_program';
 export default drawCircles;
 
 type TileRenderState = {
-  programConfiguration: ProgramConfiguration;
-  program: Program<any>;
-  layoutVertexBuffer: VertexBuffer;
-  indexBuffer: IndexBuffer;
-  uniformValues: UniformValues<CircleUniformsType>;
+    programConfiguration: ProgramConfiguration;
+    program: Program<any>;
+    layoutVertexBuffer: VertexBuffer;
+    indexBuffer: IndexBuffer;
+    uniformValues: UniformValues<CircleUniformsType>;
 };
 
 type SegmentsTileRenderState = {
-  segments: SegmentVector;
-  sortKey: number;
-  state: TileRenderState;
+    segments: SegmentVector;
+    sortKey: number;
+    state: TileRenderState;
 };
 
 function drawCircles(painter: Painter, sourceCache: SourceCache, layer: CircleStyleLayer, coords: Array<OverscaledTileID>) {

package/src/render/draw_collision_debug.ts

@@ -8,7 +8,7 @@ import StencilMode from '../gl/stencil_mode';
 import CullFaceMode from '../gl/cull_face_mode';
 import {collisionUniformValues, collisionCircleUniformValues} from './program/collision_program';
 
-import {QuadTriangleArray, CollisionCircleLayoutArray} from '../data/array_types';
+import {QuadTriangleArray, CollisionCircleLayoutArray} from '../data/array_types.g';
 import {collisionCircleLayout} from '../data/bucket/symbol_attributes';
 import SegmentVector from '../data/segment';
 import {mat4} from 'gl-matrix';
@@ -18,10 +18,10 @@ import IndexBuffer from '../gl/index_buffer';
 export default drawCollisionDebug;
 
 type TileBatch = {
-  circleArray: Array<number>;
-  circleOffset: number;
-  transform: mat4;
-  invTransform: mat4;
+    circleArray: Array<number>;
+    circleOffset: number;
+    transform: mat4;
+    invTransform: mat4;
 };
 
 let quadTriangles: QuadTriangleArray;

package/src/render/draw_line.ts

@@ -36,8 +36,8 @@ export default function drawLine(painter: Painter, sourceCache: SourceCache, lay
 
     const programId =
         image ? 'linePattern' :
-        dasharray ? 'lineSDF' :
-        gradient ? 'lineGradient' : 'line';
+            dasharray ? 'lineSDF' :
+                gradient ? 'lineGradient' : 'line';
 
     const context = painter.context;
     const gl = context.gl;
@@ -67,8 +67,8 @@ export default function drawLine(painter: Painter, sourceCache: SourceCache, lay
 
         const uniformValues = image ? linePatternUniformValues(painter, tile, layer, crossfade) :
             dasharray ? lineSDFUniformValues(painter, tile, layer, dasharray, crossfade) :
-            gradient ? lineGradientUniformValues(painter, tile, layer, bucket.lineClipsArray.length) :
-            lineUniformValues(painter, tile, layer);
+                gradient ? lineGradientUniformValues(painter, tile, layer, bucket.lineClipsArray.length) :
+                    lineUniformValues(painter, tile, layer);
 
         if (image) {
             context.activeTexture.set(gl.TEXTURE0);

package/src/render/draw_symbol.ts

@@ -34,25 +34,25 @@ import type {CrossTileID, VariableOffset} from '../symbol/placement';
 export default drawSymbols;
 
 type SymbolTileRenderState = {
-  segments: SegmentVector;
-  sortKey: number;
-  state: {
-    program: any;
-    buffers: SymbolBuffers;
-    uniformValues: any;
-    atlasTexture: Texture;
-    atlasTextureIcon: Texture | null;
-    atlasInterpolation: any;
-    atlasInterpolationIcon: any;
-    isSDF: boolean;
-    hasHalo: boolean;
-  };
+    segments: SegmentVector;
+    sortKey: number;
+    state: {
+        program: any;
+        buffers: SymbolBuffers;
+        uniformValues: any;
+        atlasTexture: Texture;
+        atlasTextureIcon: Texture | null;
+        atlasInterpolation: any;
+        atlasInterpolationIcon: any;
+        isSDF: boolean;
+        hasHalo: boolean;
+    };
 };
 
 const identityMat4 = mat4.identity(new Float32Array(16));
 
 function drawSymbols(painter: Painter, sourceCache: SourceCache, layer: SymbolStyleLayer, coords: Array<OverscaledTileID>, variableOffsets: {
-  [_ in CrossTileID]: VariableOffset;
+    [_ in CrossTileID]: VariableOffset;
 }) {
     if (painter.renderPass !== 'translucent') return;
 
@@ -132,13 +132,13 @@ function updateVariableAnchors(coords, painter, layer, sourceCache, rotationAlig
         if (size) {
             const tileScale = Math.pow(2, tr.zoom - tile.tileID.overscaledZ);
             updateVariableAnchorsForBucket(bucket, rotateWithMap, pitchWithMap, variableOffsets, symbolSize,
-                                  tr, labelPlaneMatrix, coord.posMatrix, tileScale, size, updateTextFitIcon);
+                tr, labelPlaneMatrix, coord.posMatrix, tileScale, size, updateTextFitIcon);
         }
     }
 }
 
 function updateVariableAnchorsForBucket(bucket, rotateWithMap, pitchWithMap, variableOffsets, symbolSize,
-                               transform, labelPlaneMatrix, posMatrix, tileScale, size, updateTextFitIcon) {
+    transform, labelPlaneMatrix, posMatrix, tileScale, size, updateTextFitIcon) {
     const placedSymbols = bucket.text.placedSymbolArray;
     const dynamicTextLayoutVertexArray = bucket.text.dynamicLayoutVertexArray;
     const dynamicIconLayoutVertexArray = bucket.icon.dynamicLayoutVertexArray;
@@ -223,7 +223,7 @@ function getSymbolProgramName(isSDF: boolean, isText: boolean, bucket: SymbolBuc
 }
 
 function drawLayerSymbols(painter, sourceCache, layer, coords, isText, translate, translateAnchor,
-                          rotationAlignment, pitchAlignment, keepUpright, stencilMode, colorMode) {
+    rotationAlignment, pitchAlignment, keepUpright, stencilMode, colorMode) {
 
     const context = painter.context;
     const gl = context.gl;
@@ -310,12 +310,12 @@ function drawLayerSymbols(painter, sourceCache, layer, coords, isText, translate
         if (isSDF) {
             if (!bucket.iconsInText) {
                 uniformValues = symbolSDFUniformValues(sizeData.kind,
-                size, rotateInShader, pitchWithMap, painter, matrix,
-                uLabelPlaneMatrix, uglCoordMatrix, isText, texSize, true);
+                    size, rotateInShader, pitchWithMap, painter, matrix,
+                    uLabelPlaneMatrix, uglCoordMatrix, isText, texSize, true);
             } else {
                 uniformValues = symbolTextAndIconUniformValues(sizeData.kind,
-                size, rotateInShader, pitchWithMap, painter, matrix,
-                uLabelPlaneMatrix, uglCoordMatrix, texSize, texSizeIcon);
+                    size, rotateInShader, pitchWithMap, painter, matrix,
+                    uLabelPlaneMatrix, uglCoordMatrix, texSize, texSizeIcon);
             }
         } else {
             uniformValues = symbolIconUniformValues(sizeData.kind,

package/src/render/glyph_atlas.ts

@@ -7,21 +7,21 @@ import type {GlyphMetrics, StyleGlyph} from '../style/style_glyph';
 const padding = 1;
 
 export type Rect = {
-  x: number;
-  y: number;
-  w: number;
-  h: number;
+    x: number;
+    y: number;
+    w: number;
+    h: number;
 };
 
 export type GlyphPosition = {
-  rect: Rect;
-  metrics: GlyphMetrics;
+    rect: Rect;
+    metrics: GlyphMetrics;
 };
 
 export type GlyphPositions = {
-  [_: string]: {
-    [_: number]: GlyphPosition;
-  };
+    [_: string]: {
+        [_: number]: GlyphPosition;
+    };
 };
 
 export default class GlyphAtlas {
@@ -29,9 +29,9 @@ export default class GlyphAtlas {
     positions: GlyphPositions;
 
     constructor(stacks: {
-      [_: string]: {
-        [_: number]: StyleGlyph;
-      };
+        [_: string]: {
+            [_: number]: StyleGlyph;
+        };
     }) {
         const positions = {};
         const bins = [];

package/src/render/glyph_manager.test.ts

@@ -4,7 +4,7 @@ import fs from 'fs';
 import {RequestManager} from '../util/request_manager';
 
 const glyphs = {};
-for (const glyph of parseGlyphPBF(fs.readFileSync('./test/fixtures/0-255.pbf'))) {
+for (const glyph of parseGlyphPBF(fs.readFileSync('./test/unit/assets/0-255.pbf'))) {
     glyphs[glyph.id] = glyph;
 }
 
@@ -21,12 +21,6 @@ const createLoadGlyphRangeStub = () => {
 };
 
 const createGlyphManager = (font?) => {
-    GlyphManager.TinySDF = class {
-        // Return empty 30x30 bitmap (24 fontsize + 3 * 2 buffer)
-        draw() {
-            return {data: new Uint8ClampedArray(900)} as any;
-        }
-    };
     const manager = new GlyphManager(identityTransform, font);
     manager.setURL('https://localhost/fonts/v1/{fontstack}/{range}.pbf');
     return manager;
@@ -106,8 +100,8 @@ describe('GlyphManager', () => {
                 expect(err).toBeFalsy();
                 const glyph = glyphs['Arial Unicode MS'][0x30c6];
                 //Ensure that te is locally generated.
-                expect(glyph.bitmap.height).toBe(30);
-                expect(glyph.bitmap.width).toBe(30);
+                expect(glyph.bitmap.height).toBe(6);
+                expect(glyph.bitmap.width).toBe(6);
                 done();
             });
         });
@@ -118,7 +112,7 @@ describe('GlyphManager', () => {
 
         manager.getGlyphs({'Arial Unicode MS': [0x5e73]}, (err, glyphs) => {
             expect(err).toBeFalsy();
-            expect(glyphs['Arial Unicode MS'][0x5e73].metrics.advance).toBe(24);
+            expect(glyphs['Arial Unicode MS'][0x5e73].metrics.advance).toBe(1);
             done();
         });
     });
@@ -129,7 +123,7 @@ describe('GlyphManager', () => {
         // Katakana letter te
         manager.getGlyphs({'Arial Unicode MS': [0x30c6]}, (err, glyphs) => {
             expect(err).toBeFalsy();
-            expect(glyphs['Arial Unicode MS'][0x30c6].metrics.advance).toBe(24);
+            expect(glyphs['Arial Unicode MS'][0x30c6].metrics.advance).toBe(1);
             done();
         });
     });
@@ -140,7 +134,7 @@ describe('GlyphManager', () => {
         //Hiragana letter te
         manager.getGlyphs({'Arial Unicode MS': [0x3066]}, (err, glyphs) => {
             expect(err).toBeFalsy();
-            expect(glyphs['Arial Unicode MS'][0x3066].metrics.advance).toBe(24);
+            expect(glyphs['Arial Unicode MS'][0x3066].metrics.advance).toBe(1);
             done();
         });
     });
@@ -148,21 +142,16 @@ describe('GlyphManager', () => {
     test('GlyphManager caches locally generated glyphs', done => {
 
         const manager = createGlyphManager('sans-serif');
-        let drawCallCount = 0;
-        GlyphManager.TinySDF = class {
-            // Return empty 30x30 bitmap (24 fontsize + 3 * 2 buffer)
-            draw() {
-                drawCallCount++;
-                return {data: new Uint8ClampedArray(900)} as any;
-            }
-        };
+        const drawSpy = GlyphManager.TinySDF.prototype.draw = jest.fn().mockImplementation(() => {
+            return {data: new Uint8ClampedArray(900)} as any;
+        });
 
         // Katakana letter te
         manager.getGlyphs({'Arial Unicode MS': [0x30c6]}, (err, glyphs) => {
             expect(err).toBeFalsy();
             expect(glyphs['Arial Unicode MS'][0x30c6].metrics.advance).toBe(24);
             manager.getGlyphs({'Arial Unicode MS': [0x30c6]}, () => {
-                expect(drawCallCount).toBe(1);
+                expect(drawSpy).toHaveBeenCalledTimes(1);
                 done();
             });
         });