Switch render/query tests to the ESM bundle

GitOrigin-RevId: 64646eeffc0d665736caa60d908fd101d77dd5c8

Author: mourner

package.json

@@ -138,15 +138,20 @@
     "test-esm": "npx vitest run --config vitest.config.esm.ts",
     "test-csp": "npm run build-token && vitest --config vitest.config.csp.ts --run",
     "watch-render": "npx vitest watch --config vitest.config.render.ts",
-    "pretest-render": "npm run build-dev",
+    "pretest-render": "npm run build-esm-dev",
     "test-render": "npx vitest run --config vitest.config.render.ts",
     "test-render-firefox": "RENDER_BROWSER=firefox npm run test-render",
     "test-render-safari": "RENDER_BROWSER=webkit npm run test-render",
+    "pretest-render-dev": "npm run build-dev",
+    "test-render-dev": "RENDER_BUNDLE=dev npx vitest run --config vitest.config.render.ts",
+    "pretest-render-esm-prod": "npm run build-esm-prod",
+    "test-render-esm-prod": "RENDER_BUNDLE=esm-prod npx vitest run --config vitest.config.render.ts",
     "pretest-render-prod": "npm run build-prod",
     "test-render-prod": "RENDER_BUNDLE=prod npx vitest run --config vitest.config.render.ts",
     "pretest-render-csp": "npm run build-csp",
     "test-render-csp": "RENDER_BUNDLE=csp npx vitest run --config vitest.config.render.ts",
     "watch-query": "npx vitest watch --config vitest.config.query.ts",
+    "pretest-query": "npm run build-esm-dev",
     "test-query": "npx vitest run --config vitest.config.query.ts",
     "test-expressions": "tsx ./test/expression.test.ts",
     "test-typings": "tsx ./build/generate-typed-style-spec.ts && npm run tsc",

rollup.config.esm.ts

@@ -121,7 +121,7 @@ function assertWorkerChunkIsolation(): Plugin {
         name: 'assert-worker-chunk-isolation',
         generateBundle(_options, bundle) {
             const chunks = Object.values(bundle).filter(output => output.type === 'chunk');
-            const workerEntry = chunks.find(chunk => chunk.isEntry && chunk.facadeModuleId && chunk.facadeModuleId.endsWith('/src/source/worker.ts'));
+            const workerEntry = chunks.find(chunk => chunk.isEntry && chunk.facadeModuleId && chunk.facadeModuleId.replace(/\\/g, '/').endsWith('/src/source/worker.ts'));
             if (!workerEntry) {
                 this.error('worker entry chunk not found — cannot verify main/worker chunk isolation');
                 return;

src/render/painter.ts

@@ -184,7 +184,10 @@ async function setupStandard(painter?: Painter) {
     Object.assign(prepare, {
         model: Standard.prepare,
     });
-    if (painter && !painter._shadowRenderer) {
+    // The Standard module loads asynchronously (a lazy import in ESM builds), so the
+    // map may have been removed while it was still loading — bail out to avoid touching
+    // a destroyed WebGL context.
+    if (painter && !painter._destroyed && !painter._shadowRenderer) {
         const SR = (Standard as {ShadowRenderer?: new (p: Painter) => ShadowRenderer}).ShadowRenderer;
         if (SR) painter._shadowRenderer = new SR(painter);
     }
@@ -276,6 +279,7 @@ class Painter {
     _fogVisible: boolean;
     _cachedTileFogOpacities: Record<number, [number, number]>;
     _shadowRenderer?: ShadowRenderer;
+    _destroyed?: boolean;
     _devtools?: IDevTools;
     _wireframeDebugCache: WireframeDebugCache;
 
@@ -1909,6 +1913,8 @@ class Painter {
         if (this.emptyDepthTexture) {
             this.emptyDepthTexture.destroy();
         }
+
+        this._destroyed = true;
     }
 
     prepareDrawTile() {

src/source/worker_tile.ts

@@ -413,8 +413,6 @@ class WorkerTile {
                 assert(layer.source === this.source);
                 if (!this.isLayerActiveForTile(layer)) continue;
 
-                recalculateLayers(family, this.zoom, options.brightness, availableImages, this.worldview, options.activeFloors);
-
                 // Assign bucket.index and register the layer-id mapping synchronously in
                 // style order. The async prepare() chain below can resolve out of order
                 // (HD layers add a microtask tick for the dynamic-import await), and
@@ -424,6 +422,10 @@ class WorkerTile {
                 featureIndex.bucketLayerIDs.push(family.map((l) => makeFQID(l.id, l.scope)));
 
                 const processBucket = () => {
+                    // Recalculate right before populate: `family` layers are shared across tiles and recalculate
+                    // mutates their zoom-dependent layout in place. On the async prepare() path another tile could
+                    // otherwise recalculate at a different zoom in between, giving wrong zoom-stepped values (e.g. model-id).
+                    recalculateLayers(family, this.zoom, options.brightness, availableImages, this.worldview, options.activeFloors);
                     const styleLayer: StyleLayer = layer;
                     assert(styleLayer.createBucket);
                     const bucket: Bucket = buckets[layer.id] = styleLayer.createBucket({

test/integration/lib/mapboxgl.js

@@ -18,6 +18,12 @@ if (typeof import.meta.env !== 'undefined' && import.meta.env.VITE_DIST_BUNDLE =
     await import(/* @vite-ignore */ modulePath);
 
     mapboxgl = globalThis.mapboxgl;
+} else if (typeof import.meta.env !== 'undefined' && import.meta.env.VITE_DIST_BUNDLE === 'esm') {
+    modulePath = '../../../dist/esm-dev/mapbox-gl.js';
+    mapboxgl = await import(/* @vite-ignore */ modulePath);
+} else if (typeof import.meta.env !== 'undefined' && import.meta.env.VITE_DIST_BUNDLE === 'esm-prod') {
+    modulePath = '../../../dist/esm/mapbox-gl.js';
+    mapboxgl = await import(/* @vite-ignore */ modulePath);
 } else {
 
     mapboxgl = globalThis.mapboxgl;

vitest.config.query.ts

@@ -9,7 +9,7 @@ export default mergeConfig(baseConfig, defineConfig({
         // Opt-in embedding of passed-test images in the report (local dev only;
         // forced off on CI to keep the report small).
         'import.meta.env.VITE_EMBED_PASSED_IMAGES': JSON.stringify(String(!isCI && process.env.EMBED_PASSED_IMAGES === 'true')),
-        'import.meta.env.VITE_DIST_BUNDLE': JSON.stringify('dev'),
+        'import.meta.env.VITE_DIST_BUNDLE': JSON.stringify(process.env.QUERY_BUNDLE || 'esm'),
     },
     test: {
         include: ['test/integration/query-tests/index.test.ts'],

vitest.config.render.ts

@@ -7,7 +7,7 @@ import {integrationTests, setupIntegrationTestsMiddlewares, serveDistPlugin, sui
 import type {BrowserConfigOptions} from 'vitest/node';
 
 const renderBrowser = process.env.RENDER_BROWSER || 'chromium';
-const bundle = process.env.RENDER_BUNDLE || 'dev';
+const bundle = process.env.RENDER_BUNDLE || 'esm';
 
 const getAngle = () => {
     if (os.platform() === 'darwin' && os.arch() === 'arm64') return '--use-angle=metal';