@luma.gl/test-utils 9.1.9 → 9.2.0-alpha.2

package/dist/index.cjs

@@ -1,3 +1,4 @@
+"use strict";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
@@ -27,1311 +28,1408 @@ __export(dist_exports, {
   createTestDevice: () => createTestDevice,
   deepCopy: () => deepCopy,
   getLeakedResources: () => getLeakedResources,
+  getNullTestDevice: () => getNullTestDevice,
   getResourceCounts: () => getResourceCounts,
+  getTestDevice: () => getTestDevice,
   getTestDevices: () => getTestDevices,
+  getWebGLTestDevice: () => getWebGLTestDevice,
+  getWebGPUTestDevice: () => getWebGPUTestDevice,
   nullAdapter: () => nullAdapter,
-  webglDevice: () => webglDevice,
-  webgpuDevice: () => webgpuDevice
+  webglDevice: () => webglDevice2
 });
 module.exports = __toCommonJS(dist_exports);
 
-// dist/create-test-device.js
+// dist/register-devices.js
 var import_core = require("@luma.gl/core");
 var import_webgl = require("@luma.gl/webgl");
 var import_webgpu = require("@luma.gl/webgpu");
-var DEFAULT_CANVAS_CONTEXT_PROPS = {
-  width: 1,
-  height: 1
+import_core.luma.registerAdapters([import_webgl.webgl2Adapter, import_webgpu.webgpuAdapter]);
+
+// dist/create-test-device.js
+var import_core19 = require("@luma.gl/core");
+var import_webgl2 = require("@luma.gl/webgl");
+var import_webgpu2 = require("@luma.gl/webgpu");
+
+// dist/null-device/null-adapter.js
+var import_core18 = require("@luma.gl/core");
+
+// dist/null-device/null-device.js
+var import_core17 = require("@luma.gl/core");
+
+// dist/null-device/null-device-info.js
+var NullDeviceInfo = {
+  type: "unknown",
+  gpu: "software",
+  gpuType: "unknown",
+  gpuBackend: "unknown",
+  vendor: "no one",
+  renderer: "none",
+  version: "1.0",
+  shadingLanguage: "glsl",
+  shadingLanguageVersion: 300
 };
-function createTestDevice() {
-  try {
-    return new import_webgl.WebGLDevice({ createCanvasContext: DEFAULT_CANVAS_CONTEXT_PROPS, debugWebGL: true });
-  } catch (error) {
-    console.error(`Failed to created device: ${error.message}`);
-    debugger;
-    return null;
-  }
-}
-var webglDevice = createTestDevice();
-var webglDeviceAsync;
-var webgpuDevice;
-var devicesCreated = false;
-async function getTestDevices(type) {
-  if (!devicesCreated) {
-    devicesCreated = true;
-    try {
-      webgpuDevice = await import_core.luma.createDevice({
-        id: "webgpu-test-device",
-        type: "webgpu",
-        adapters: [import_webgpu.webgpuAdapter],
-        createCanvasContext: DEFAULT_CANVAS_CONTEXT_PROPS
-      });
-    } catch (error) {
-      import_core.log.error(String(error))();
-    }
-    try {
-      webglDeviceAsync = await import_core.luma.createDevice({
-        id: "webgl-test-device",
-        type: "webgl",
-        adapters: [import_webgl.webgl2Adapter],
-        createCanvasContext: DEFAULT_CANVAS_CONTEXT_PROPS,
-        debugWebGL: true
-      });
-    } catch (error) {
-      import_core.log.error(String(error))();
-    }
-  }
-  return [webglDeviceAsync, webgpuDevice].filter(Boolean).filter((device) => !type || type === device.type);
-}
 
-// dist/deprecated/classic-animation-loop.js
+// dist/null-device/null-device-features.js
 var import_core2 = require("@luma.gl/core");
-var import_engine = require("@luma.gl/engine");
-var import_env = require("@probe.gl/env");
-var import_webgl2 = require("@luma.gl/webgl");
-var isPage = (0, import_env.isBrowser)() && typeof document !== "undefined";
-function getHTMLCanvasElement(canvas) {
-  return typeof HTMLCanvasElement !== "undefined" && canvas instanceof HTMLCanvasElement ? canvas : null;
-}
-var statIdCounter = 0;
-var DEFAULT_CLASSIC_ANIMATION_LOOP_PROPS = {
-  onCreateDevice: (props) => import_core2.luma.createDevice(props),
-  onCreateContext: void 0,
-  onAddHTML: void 0,
-  onInitialize: () => ({}),
-  onRender: () => {
-  },
-  onFinalize: () => {
-  },
-  onError: (error) => console.error(error),
-  // eslint-disable-line no-console
-  device: null,
-  // debug: true,
-  // view parameters
-  useDevicePixels: true,
-  autoResizeViewport: true,
-  autoResizeDrawingBuffer: true,
-  stats: import_core2.luma.stats.get(`animation-loop-${statIdCounter++}`),
-  // deprecated
-  // onCreateContext: (opts) => createGLContext(opts),
-  gl: void 0,
-  glOptions: {},
-  createFramebuffer: false
+var NullDeviceLimits = class extends import_core2.DeviceLimits {
+  maxTextureDimension1D = 0;
+  maxTextureDimension2D = 2048;
+  maxTextureDimension3D = 256;
+  maxTextureArrayLayers = 256;
+  maxBindGroups = 0;
+  maxDynamicUniformBuffersPerPipelineLayout = 0;
+  maxDynamicStorageBuffersPerPipelineLayout = 0;
+  maxSampledTexturesPerShaderStage = 8;
+  maxSamplersPerShaderStage = 16;
+  maxStorageBuffersPerShaderStage = 0;
+  maxStorageTexturesPerShaderStage = 0;
+  maxUniformBuffersPerShaderStage = 20;
+  maxUniformBufferBindingSize = 16384;
+  maxStorageBufferBindingSize = 0;
+  minUniformBufferOffsetAlignment = 0;
+  minStorageBufferOffsetAlignment = 0;
+  maxVertexBuffers = 16;
+  maxVertexAttributes = 16;
+  maxVertexBufferArrayStride = 2048;
+  maxInterStageShaderVariables = 60;
+  maxComputeWorkgroupStorageSize = 0;
+  maxComputeInvocationsPerWorkgroup = 0;
+  maxComputeWorkgroupSizeX = 0;
+  maxComputeWorkgroupSizeY = 0;
+  maxComputeWorkgroupSizeZ = 0;
+  maxComputeWorkgroupsPerDimension = 0;
 };
-var ClassicAnimationLoop = class {
+
+// dist/null-device/null-canvas-context.js
+var import_core4 = require("@luma.gl/core");
+
+// dist/null-device/resources/null-framebuffer.js
+var import_core3 = require("@luma.gl/core");
+var NullFramebuffer = class extends import_core3.Framebuffer {
   device;
-  canvas;
-  props;
-  animationProps;
-  // framebuffer: ClassicFramebuffer = null;
-  timeline = null;
-  stats;
-  cpuTime;
-  gpuTime;
-  frameRate;
-  display;
-  needsRedraw = "initialized";
-  _initialized = false;
-  _running = false;
-  _animationFrameId = null;
-  _pageLoadPromise = null;
-  _nextFramePromise = null;
-  _resolveNextFrame = null;
-  _cpuStartTime = 0;
-  // _gpuTimeQuery: Query | null = null;
-  /** @deprecated */
-  gl;
-  /*
-   */
-  constructor(props = {}) {
-    this.props = { ...DEFAULT_CLASSIC_ANIMATION_LOOP_PROPS, ...props };
-    props = this.props;
-    let { useDevicePixels = true } = this.props;
-    if ("useDevicePixelRatio" in props) {
-      import_core2.log.deprecated("useDevicePixelRatio", "useDevicePixels")();
-      useDevicePixels = props.useDevicePixelRatio;
-    }
-    this.device = props.device;
-    this.gl = this.device && this.device.gl || props.gl;
-    this.stats = props.stats;
-    this.cpuTime = this.stats.get("CPU Time");
-    this.gpuTime = this.stats.get("GPU Time");
-    this.frameRate = this.stats.get("Frame Rate");
-    this.setProps({
-      autoResizeViewport: props.autoResizeViewport,
-      autoResizeDrawingBuffer: props.autoResizeDrawingBuffer,
-      useDevicePixels
-    });
-    this.start = this.start.bind(this);
-    this.stop = this.stop.bind(this);
-    this._onMousemove = this._onMousemove.bind(this);
-    this._onMouseleave = this._onMouseleave.bind(this);
-  }
-  destroy() {
-    this.stop();
-    this._setDisplay(null);
-  }
-  /** @deprecated Use .destroy() */
-  delete() {
-    this.destroy();
+  handle = null;
+  colorAttachments = [];
+  depthStencilAttachment = null;
+  constructor(device, props) {
+    super(device, props);
+    this.device = device;
   }
-  setNeedsRedraw(reason) {
-    this.needsRedraw = this.needsRedraw || reason;
-    return this;
+  updateAttachments() {
   }
-  setProps(props) {
-    if ("autoResizeViewport" in props) {
-      this.props.autoResizeViewport = props.autoResizeViewport;
-    }
-    if ("autoResizeDrawingBuffer" in props) {
-      this.props.autoResizeDrawingBuffer = props.autoResizeDrawingBuffer;
-    }
-    if ("useDevicePixels" in props) {
-      this.props.useDevicePixels = props.useDevicePixels;
-    }
-    return this;
+};
+
+// dist/null-device/null-canvas-context.js
+var NullCanvasContext = class extends import_core4.CanvasContext {
+  device;
+  handle = null;
+  presentationSize = [1, 1];
+  _framebuffer = null;
+  get [Symbol.toStringTag]() {
+    return "NullCanvasContext";
   }
-  start(opts = {}) {
-    this._start(opts);
-    return this;
+  constructor(device, props) {
+    super(props);
+    this.device = device;
+    this._setAutoCreatedCanvasId(`${this.device.id}-canvas`);
+    this._updateDevice();
   }
-  /** Starts a render loop if not already running */
-  async _start(props) {
-    if (this._running) {
-      return this;
-    }
-    this._running = true;
-    try {
-      await this._getPageLoadPromise();
-      if (!this._running) {
-        return null;
-      }
-      let appContext;
-      if (!this._initialized) {
-        this._initialized = true;
-        await this._createDevice(props);
-        this._initialize(props);
-        appContext = await this.onInitialize(this.animationProps);
-        this._addCallbackData(appContext || {});
-      }
-      if (!this._running) {
-        return null;
-      }
-      if (appContext !== false) {
-        this._cancelAnimationFrame();
-        this._requestAnimationFrame();
-      }
-      return this;
-    } catch (error) {
-      this.props.onError(error);
-      return null;
-    }
+  getCurrentFramebuffer() {
+    this._framebuffer = this._framebuffer || new NullFramebuffer(this.device, { handle: null });
+    return this._framebuffer;
   }
-  /** Explicitly draw a frame */
-  redraw() {
-    if (this.isContextLost()) {
-      return this;
-    }
-    this._beginTimers();
-    this._setupFrame();
-    this._updateCallbackData();
-    this._renderFrame(this.animationProps);
-    this._clearNeedsRedraw();
-    if (this._resolveNextFrame) {
-      this._resolveNextFrame(this);
-      this._nextFramePromise = null;
-      this._resolveNextFrame = null;
-    }
-    this._endTimers();
-    return this;
+  _updateDevice() {
   }
-  // Stops a render loop if already running, finalizing
-  stop() {
-    if (this._running) {
-      this._finalizeCallbackData();
-      this._cancelAnimationFrame();
-      this._nextFramePromise = null;
-      this._resolveNextFrame = null;
-      this._running = false;
+};
+
+// dist/null-device/resources/null-buffer.js
+var import_core5 = require("@luma.gl/core");
+var NullBuffer = class extends import_core5.Buffer {
+  device;
+  handle = "null";
+  byteLength;
+  _storage;
+  constructor(device, props = {}) {
+    super(device, props);
+    this.device = device;
+    const byteOffset = props.byteOffset || 0;
+    const byteLength = props.byteLength ?? (props.data ? props.data.byteLength + byteOffset : 0);
+    this.byteLength = byteLength;
+    this._storage = new ArrayBuffer(byteLength);
+    if (props.data) {
+      this.write(props.data, byteOffset);
     }
-    return this;
-  }
-  attachTimeline(timeline) {
-    this.timeline = timeline;
-    return this.timeline;
+    this.trackAllocatedMemory(byteLength);
   }
-  detachTimeline() {
-    this.timeline = null;
+  destroy() {
+    if (!this.destroyed) {
+      super.destroy();
+      this.trackDeallocatedMemory();
+      this.handle = null;
+      this._storage = new ArrayBuffer(0);
+    }
   }
-  waitForRender() {
-    this.setNeedsRedraw("waitForRender");
-    if (!this._nextFramePromise) {
-      this._nextFramePromise = new Promise((resolve) => {
-        this._resolveNextFrame = resolve;
-      });
+  write(data, byteOffset = 0) {
+    const source = ArrayBuffer.isView(data) ? new Uint8Array(data.buffer, data.byteOffset, data.byteLength) : new Uint8Array(data);
+    const target = new Uint8Array(this._storage, byteOffset, source.byteLength);
+    if (byteOffset + source.byteLength > this.byteLength) {
+      throw new RangeError(`NullBuffer.write(): write would overflow buffer`);
     }
-    return this._nextFramePromise;
+    target.set(source);
+    this._setDebugData(data, byteOffset, source.byteLength);
   }
-  async toDataURL() {
-    var _a;
-    this.setNeedsRedraw("toDataURL");
-    await this.waitForRender();
-    return (_a = getHTMLCanvasElement(this.gl.canvas)) == null ? void 0 : _a.toDataURL();
+  async mapAndWriteAsync(callback, byteOffset = 0, byteLength = this.byteLength - byteOffset) {
+    const view = new Uint8Array(this._storage, byteOffset, byteLength);
+    const tempBuffer = new Uint8Array(view.length);
+    callback(tempBuffer.buffer, "copied");
+    view.set(tempBuffer);
+    this._setDebugData(view, byteOffset, byteLength);
   }
-  isContextLost() {
-    return this.gl.isContextLost();
+  async readAsync(byteOffset = 0, byteLength) {
+    byteLength = byteLength ?? this.byteLength - byteOffset;
+    if (byteOffset + byteLength > this.byteLength) {
+      throw new RangeError(`NullBuffer.readAsync(): read would overflow buffer`);
+    }
+    const view = new Uint8Array(this._storage, byteOffset, byteLength);
+    return new Uint8Array(view);
   }
-  onCreateDevice(deviceProps) {
-    const { onCreateDevice } = this.props;
-    return onCreateDevice(deviceProps);
+  async mapAndReadAsync(callback, byteOffset = 0, byteLength = this.byteLength - byteOffset) {
+    const view = new Uint8Array(this._storage, byteOffset, byteLength);
+    const copy = new Uint8Array(view);
+    return callback(copy.buffer, "copied");
   }
-  onInitialize(animationProps) {
-    const { onInitialize } = this.props;
-    return onInitialize(animationProps);
+  readSyncWebGL() {
+    throw new Error("NullBuffer.readSyncWebGL() not implemented");
   }
-  onRender(animationProps) {
-    const { onRender } = this.props;
-    return onRender(animationProps);
+};
+
+// dist/null-device/resources/null-shader.js
+var import_core6 = require("@luma.gl/core");
+var NullShader = class extends import_core6.Shader {
+  device;
+  handle = null;
+  constructor(device, props) {
+    super(device, props);
+    this.device = device;
   }
-  onFinalize(animationProps) {
-    const { onFinalize } = this.props;
-    return onFinalize(animationProps);
+  get asyncCompilationStatus() {
+    return this.getCompilationInfo().then(() => "success");
   }
-  // DEPRECATED/REMOVED METHODS
-  /** @deprecated Use .onCreateDevice() */
-  onCreateContext(props) {
-    const { onCreateContext } = this.props;
-    return onCreateContext(props);
+  async getCompilationInfo() {
+    return [];
   }
-  /** @deprecated */
-  getHTMLControlValue(id, defaultValue = 1) {
-    const element = document.getElementById(id);
-    return element ? Number(element.value) : defaultValue;
+};
+
+// dist/null-device/resources/null-command-encoder.js
+var import_core9 = require("@luma.gl/core");
+
+// dist/null-device/resources/null-command-buffer.js
+var import_core7 = require("@luma.gl/core");
+var NullCommandBuffer = class extends import_core7.CommandBuffer {
+  device;
+  handle = null;
+  constructor(device, props) {
+    super(device, props);
+    this.device = device;
   }
-  // PRIVATE METHODS
-  _initialize(props) {
-    this._createFramebuffer();
-    this._startEventHandling();
-    this._initializeCallbackData();
-    this._updateCallbackData();
-    this._resizeCanvasDrawingBuffer();
-    this._resizeViewport();
+  copyBufferToBuffer(options) {
   }
-  _getPageLoadPromise() {
-    if (!this._pageLoadPromise) {
-      this._pageLoadPromise = isPage ? new Promise((resolve, reject) => {
-        if (isPage && document.readyState === "complete") {
-          resolve(document);
-          return;
-        }
-        window.addEventListener("load", () => {
-          resolve(document);
-        });
-      }) : Promise.resolve({});
-    }
-    return this._pageLoadPromise;
+  copyBufferToTexture(options) {
   }
-  _setDisplay(display) {
-    if (this.display) {
-      this.display.destroy();
-      this.display.animationLoop = null;
-    }
-    if (display) {
-      display.animationLoop = this;
-    }
-    this.display = display;
+  copyTextureToBuffer(options) {
   }
-  _requestAnimationFrame() {
-    if (!this._running) {
-      return;
-    }
-    this._animationFrameId = (0, import_engine.requestAnimationFramePolyfill)(this._animationFrame.bind(this));
+  copyTextureToTexture(options) {
   }
-  _cancelAnimationFrame() {
-    if (this._animationFrameId !== null) {
-      return;
-    }
-    (0, import_engine.cancelAnimationFramePolyfill)(this._animationFrameId);
-    this._animationFrameId = null;
+  pushDebugGroup(groupLabel) {
   }
-  _animationFrame() {
-    if (!this._running) {
-      return;
-    }
-    this.redraw();
-    this._requestAnimationFrame();
+  popDebugGroup() {
   }
-  // Called on each frame, can be overridden to call onRender multiple times
-  // to support e.g. stereoscopic rendering
-  _renderFrame(props) {
-    if (this.display) {
-      this.display._renderFrame(props);
-      return;
-    }
-    this.onRender(props);
+  insertDebugMarker(markerLabel) {
   }
-  _clearNeedsRedraw() {
-    this.needsRedraw = null;
+  resolveQuerySet(querySet) {
   }
-  _setupFrame() {
-    this._resizeCanvasDrawingBuffer();
-    this._resizeViewport();
-    this._resizeFramebuffer();
+};
+
+// dist/null-device/resources/null-render-pass.js
+var import_core8 = require("@luma.gl/core");
+var NullRenderPass = class extends import_core8.RenderPass {
+  device;
+  handle = null;
+  constructor(device, props) {
+    super(device, props);
+    this.device = device;
   }
-  /* eslint-disable @typescript-eslint/unbound-method */
-  // Initialize the  object that will be passed to app callbacks
-  _initializeCallbackData() {
-    this.animationProps = {
-      device: this.device,
-      gl: this.gl,
-      stop: this.stop,
-      canvas: this.gl.canvas,
-      // Initial values
-      useDevicePixels: this.props.useDevicePixels,
-      needsRedraw: null,
-      // Animation props
-      startTime: Date.now(),
-      engineTime: 0,
-      tick: 0,
-      tock: 0,
-      timeline: this.timeline,
-      // @ts-ignore
-      animationLoop: this,
-      // Timeline time for back compatibility
-      time: 0,
-      // Experimental
-      _mousePosition: null,
-      // Event props
-      /** @deprecated */
-      // framebuffer: this.framebuffer,
-      /** @deprecated */
-      _timeline: this.timeline,
-      /** @deprecated */
-      _loop: this,
-      /** @deprecated */
-      _animationLoop: this
-    };
+  end() {
   }
-  // Update the context object that will be passed to app callbacks
-  _updateCallbackData() {
-    const { width, height, aspect } = this._getSizeAndAspect();
-    if (width !== this.animationProps.width || height !== this.animationProps.height) {
-      this.setNeedsRedraw("drawing buffer resized");
-    }
-    if (aspect !== this.animationProps.aspect) {
-      this.setNeedsRedraw("drawing buffer aspect changed");
-    }
-    this.animationProps.width = width;
-    this.animationProps.height = height;
-    this.animationProps.aspect = aspect;
-    this.animationProps.needsRedraw = this.needsRedraw;
-    this.animationProps.engineTime = Date.now() - this.animationProps.startTime;
-    if (this.timeline) {
-      this.timeline.update(this.animationProps.engineTime);
-    }
-    this.animationProps.tick = Math.floor(this.animationProps.time / 1e3 * 60);
-    this.animationProps.tock++;
-    this.animationProps.time = this.timeline ? this.timeline.getTime() : this.animationProps.engineTime;
+  pushDebugGroup(groupLabel) {
   }
-  _finalizeCallbackData() {
-    this.onFinalize(this.animationProps);
+  popDebugGroup() {
   }
-  /** Add application's data to the app context object */
-  _addCallbackData(appContext) {
-    if (typeof appContext === "object" && appContext !== null) {
-      this.animationProps = Object.assign({}, this.animationProps, appContext);
-    }
+  insertDebugMarker(markerLabel) {
   }
-  /** Either uses supplied or existing context, or calls provided callback to create one */
-  async _createDevice(props) {
-    const deviceProps = { ...this.props, ...props, ...this.props.glOptions };
-    this.device = await this.onCreateDevice(deviceProps);
-    this.gl = this.device.gl;
-    (0, import_webgl2.resetGLParameters)(this.gl);
-    this._createInfoDiv();
+  setParameters(parameters = {}) {
   }
-  _createInfoDiv() {
-    const canvas = getHTMLCanvasElement(this.gl.canvas);
-    if (canvas && this.props.onAddHTML) {
-      const wrapperDiv = document.createElement("div");
-      document.body.appendChild(wrapperDiv);
-      wrapperDiv.style.position = "relative";
-      const div = document.createElement("div");
-      div.style.position = "absolute";
-      div.style.left = "10px";
-      div.style.bottom = "10px";
-      div.style.width = "300px";
-      div.style.background = "white";
-      if (canvas) {
-        wrapperDiv.appendChild(canvas);
-      }
-      wrapperDiv.appendChild(div);
-      const html = this.props.onAddHTML(div);
-      if (html) {
-        div.innerHTML = html;
-      }
-    }
+  beginOcclusionQuery(queryIndex) {
   }
-  _getSizeAndAspect() {
-    const width = this.gl.drawingBufferWidth;
-    const height = this.gl.drawingBufferHeight;
-    let aspect = 1;
-    const canvas = getHTMLCanvasElement(this.gl.canvas);
-    if (canvas && canvas.clientHeight) {
-      aspect = canvas.clientWidth / canvas.clientHeight;
-    } else if (width > 0 && height > 0) {
-      aspect = width / height;
-    }
-    return { width, height, aspect };
+  endOcclusionQuery() {
   }
-  /** Default viewport setup */
-  _resizeViewport() {
-    if (this.props.autoResizeViewport) {
-      this.gl.viewport(0, 0, this.gl.drawingBufferWidth, this.gl.drawingBufferHeight);
-    }
+};
+
+// dist/null-device/resources/null-command-encoder.js
+var NullCommandEncoder = class extends import_core9.CommandEncoder {
+  device;
+  handle = null;
+  constructor(device, props) {
+    super(device, props);
+    this.device = device;
   }
-  /**
-   * Resize the render buffer of the canvas to match canvas client size
-   * Optionally multiplying with devicePixel ratio
-   */
-  _resizeCanvasDrawingBuffer() {
-    if (this.props.autoResizeDrawingBuffer) {
-      this.device.canvasContext.resize({ useDevicePixels: this.props.useDevicePixels });
-    }
+  finish(props) {
+    return new NullCommandBuffer(this.device, props);
   }
-  _beginTimers() {
-    this.frameRate.timeEnd();
-    this.frameRate.timeStart();
-    this.cpuTime.timeStart();
+  beginRenderPass(props) {
+    return new NullRenderPass(this.device, props);
   }
-  _endTimers() {
-    this.cpuTime.timeEnd();
+  beginComputePass(props) {
+    throw new Error("ComputePass not supported in WebGL");
   }
-  // Event handling
-  _startEventHandling() {
-    const { canvas } = this.gl;
-    if (canvas) {
-      canvas.addEventListener("mousemove", this._onMousemove);
-      canvas.addEventListener("mouseleave", this._onMouseleave);
-    }
+  copyBufferToBuffer(options) {
   }
-  _onMousemove(e) {
-    this.animationProps._mousePosition = [e.offsetX, e.offsetY];
+  copyBufferToTexture(options) {
   }
-  _onMouseleave(e) {
-    this.animationProps._mousePosition = null;
+  copyTextureToBuffer(options) {
   }
-  // Deprecated
-  /** @deprecated */
-  _createFramebuffer() {
-    if (this.props.createFramebuffer) {
-    }
+  copyTextureToTexture(options) {
   }
-  /** @deprecated */
-  _resizeFramebuffer() {
+  resolveQuerySet(querySet) {
+  }
+  pushDebugGroup(groupLabel) {
+  }
+  popDebugGroup() {
+  }
+  insertDebugMarker(markerLabel) {
   }
 };
 
-// dist/test-runner.js
-var DEFAULT_TEST_CASE = {
-  name: "Unnamed test",
-  onInitialize: async () => {
-  },
-  onRender: ({ done }) => done(),
-  onFinalize: () => {
+// dist/null-device/resources/null-sampler.js
+var import_core10 = require("@luma.gl/core");
+var NullSampler = class extends import_core10.Sampler {
+  device;
+  handle = null;
+  constructor(device, props) {
+    super(device, props);
+    this.device = device;
   }
 };
-var DEFAULT_TEST_PROPS = {
-  width: void 0,
-  height: void 0,
-  // test lifecycle callback
-  onTestStart: (testCase) => console.log(`# ${testCase.name}`),
-  onTestPass: (testCase, result) => console.log(`ok ${testCase.name} passed`),
-  onTestFail: (testCase, error) => console.log(`not ok ${testCase.name} failed`),
-  // milliseconds to wait for each test case before aborting
-  timeout: 2e3,
-  maxFramesToRender: void 0,
-  imageDiffOptions: void 0
-};
-var TestRunner = class {
-  device = webglDevice;
-  props;
-  isRunning = false;
-  testOptions = { ...DEFAULT_TEST_PROPS };
-  _animationProps;
-  _animationLoop;
-  _testCases = [];
-  _testCaseData = null;
-  _currentTestCase;
-  _currentTestCaseStartTime;
-  _currentTestCaseStartTick;
-  // should be defined in snapshot-test-runner
-  isDiffing = false;
-  // @ts-expect-error
-  isHeadless = Boolean(window.browserTestDriver_isHeadless);
-  /**
-   * props
-   *   AnimationLoop props
-   */
-  constructor(props = {}) {
-    this.props = props;
+
+// dist/null-device/resources/null-texture.js
+var import_core12 = require("@luma.gl/core");
+
+// dist/null-device/resources/null-texture-view.js
+var import_core11 = require("@luma.gl/core");
+var NullTextureView = class extends import_core11.TextureView {
+  device;
+  handle = null;
+  texture;
+  constructor(device, props) {
+    super(device, { ...import_core11.Texture.defaultProps, ...props });
+    this.device = device;
+    this.texture = props.texture;
   }
-  /**
-   * Add testCase(s)
-   */
-  add(testCases) {
-    if (!Array.isArray(testCases)) {
-      testCases = [testCases];
-    }
-    for (const testCase of testCases) {
-      this._testCases.push(testCase);
+};
+
+// dist/null-device/resources/null-texture.js
+var NullTexture = class extends import_core12.Texture {
+  device;
+  handle = null;
+  sampler;
+  view;
+  constructor(device, props) {
+    super(device, props);
+    this.device = device;
+    if (props.sampler) {
+      this.setSampler(props.sampler);
     }
-    return this;
-  }
-  /**
-   * Returns a promise that resolves when all the test cases are done
-   */
-  run(options = {}) {
-    this.testOptions = { ...this.testOptions, ...options };
-    return new Promise((resolve, reject) => {
-      this._animationLoop = new ClassicAnimationLoop({
-        ...this.props,
-        device: this.device,
-        onRender: this._onRender.bind(this),
-        onFinalize: () => {
-          this.isRunning = false;
-          resolve();
-        }
-      });
-      this._animationLoop.start(this.props);
-      this.isRunning = true;
-      this.isDiffing = false;
-      this._currentTestCase = null;
-    }).catch((error) => {
-      this._fail({ error: error.message });
+    this.sampler = new NullSampler(this.device, this.props.sampler);
+    this.view = new NullTextureView(this.device, {
+      ...props,
+      texture: this,
+      mipLevelCount: 1,
+      arrayLayerCount: 1
     });
+    Object.seal(this);
   }
-  /* Lifecycle methods for subclassing */
-  initTestCase(testCase) {
-    const { animationLoop } = testCase;
-    if (animationLoop) {
-      testCase.onInitialize = animationLoop.props.onInitialize.bind(animationLoop);
-      testCase.onRender = animationLoop.props.onRender.bind(animationLoop);
-      testCase.onFinalize = animationLoop.props.onFinalize.bind(animationLoop);
-    }
-    for (const key in DEFAULT_TEST_CASE) {
-      testCase[key] = testCase[key] || DEFAULT_TEST_CASE[key];
+  destroy() {
+    if (!this.destroyed) {
+      super.destroy();
+      this.trackDeallocatedMemory("Texture");
     }
   }
-  shouldRender(animationProps) {
-    return true;
-  }
-  assert(testCase) {
-    this._pass(testCase);
-    this._next();
+  createView(props) {
+    return new NullTextureView(this.device, { ...props, texture: this });
   }
-  /* Utilities */
-  _pass(result) {
-    this.testOptions.onTestPass(this._currentTestCase, result);
+  copyExternalImage(options) {
+    this.trackDeallocatedMemory("Texture");
+    const { image: data } = options;
+    const bytesPerPixel = 4;
+    this.trackAllocatedMemory(this.width * this.height * bytesPerPixel, "Texture");
+    const width = options.width ?? data.width;
+    const height = options.height ?? data.height;
+    this.width = width;
+    this.height = height;
+    return { width, height };
   }
-  _fail(result) {
-    this.testOptions.onTestFail(this._currentTestCase, result);
+  setSampler(sampler) {
   }
-  _next() {
-    this._nextTestCase();
+  copyImageData(options) {
+    throw new Error("copyImageData not implemented");
   }
-  /* Private methods */
-  _onRender(animationProps) {
-    this._animationProps = animationProps;
-    const testCase = this._currentTestCase || this._nextTestCase();
-    if (!testCase) {
-      this._animationLoop.stop();
-      return;
-    }
-    let isDone = false;
-    const testCaseAnimationProps = {
-      ...animationProps,
-      ...this._testCaseData,
-      // tick/time starts from 0 for each test case
-      startTime: this._currentTestCaseStartTime,
-      time: animationProps.time - this._currentTestCaseStartTime,
-      tick: animationProps.tick - this._currentTestCaseStartTick,
-      // called by the test case when it is done rendering and ready for capture and diff
-      done: () => {
-        isDone = true;
-      }
-    };
-    if (this._testCaseData && this.shouldRender(testCaseAnimationProps)) {
-      testCase.onRender(testCaseAnimationProps);
-    }
-    const timeout = testCase.timeout || this.testOptions.timeout;
-    if (timeout && testCaseAnimationProps.time > timeout) {
-      isDone = true;
-    }
-    if (isDone) {
-      this.assert(testCase);
-    }
+  generateMipmapsWebGL() {
   }
-  _nextTestCase() {
-    const animationProps = this._animationProps;
-    if (this._testCaseData) {
-      for (const key in this._testCaseData) {
-        const value = this._testCaseData[key];
-        if (value && value.delete) {
-          value.destroy();
-        }
-      }
-      this._currentTestCase.onFinalize(Object.assign({}, animationProps, this._testCaseData));
-      this.device.popState();
-      this._currentTestCase = null;
-      this._testCaseData = null;
-    }
-    const testCase = this._testCases.shift();
-    if (testCase) {
-      this._currentTestCase = testCase;
-      this._currentTestCaseStartTime = animationProps.time;
-      this._currentTestCaseStartTick = animationProps.tick;
-      this.initTestCase(testCase);
-      this.device.pushState();
-      const initProps = {
-        ...animationProps,
-        // tick/time starts from 0 for each test case
-        startTime: animationProps.time,
-        time: 0,
-        tick: 0
-      };
-      Promise.resolve(testCase.onInitialize(initProps)).then((userData) => {
-        this._testCaseData = userData || {};
-      });
-      this.testOptions.onTestStart(testCase);
-    }
-    return testCase;
+};
+
+// dist/null-device/resources/null-render-pipeline.js
+var import_core13 = require("@luma.gl/core");
+var NullRenderPipeline = class extends import_core13.RenderPipeline {
+  device;
+  handle = null;
+  vs;
+  fs;
+  uniforms = {};
+  bindings = {};
+  constructor(device, props) {
+    super(device, props);
+    this.device = device;
+    this.vs = props.vs;
+    this.fs = props.fs;
+    this.shaderLayout = props.shaderLayout || {
+      attributes: [],
+      bindings: [],
+      uniforms: []
+    };
+  }
+  setBindings(bindings) {
+    Object.assign(this.bindings, bindings);
+  }
+  draw(options) {
+    const { renderPass, vertexArray } = options;
+    vertexArray.bindBeforeRender(renderPass);
+    vertexArray.unbindAfterRender(renderPass);
+    return true;
   }
 };
 
-// dist/utils/get-bounding-box.js
-function getBoundingBoxInPage(domElement) {
-  const bbox = domElement.getBoundingClientRect();
-  return {
-    x: window.scrollX + bbox.x,
-    y: window.scrollY + bbox.y,
-    width: bbox.width,
-    height: bbox.height
-  };
-}
-
-// dist/snapshot-test-runner.js
-var SnapshotTestRunner = class extends TestRunner {
-  // should be defined here but hack access in TestRunner
-  // private isDiffing: boolean = false;
-  constructor(props) {
-    super(props);
-    this.testOptions.imageDiffOptions = {};
+// dist/null-device/resources/null-vertex-array.js
+var import_core14 = require("@luma.gl/core");
+var NullVertexArray = class extends import_core14.VertexArray {
+  device;
+  handle = null;
+  // Create a VertexArray
+  constructor(device, props) {
+    super(device, props);
+    this.device = device;
   }
-  initTestCase(testCase) {
-    super.initTestCase(testCase);
-    if (!testCase.goldenImage) {
-      throw new Error(`Test case ${testCase.name} does not have golden image`);
+  setIndexBuffer(indexBuffer) {
+    this.indexBuffer = indexBuffer;
+  }
+  /** Set a location in vertex attributes array to a buffer, enables the location, sets divisor */
+  setBuffer(location, attributeBuffer) {
+    const attributeInfo = this.attributeInfos[location];
+    if (!attributeInfo) {
+      throw new Error(`Unknown attribute location ${location}`);
     }
+    this.attributes[location] = attributeBuffer;
   }
-  shouldRender() {
-    return !this.isDiffing;
+  bindBeforeRender() {
   }
-  async assert(testCase) {
-    var _a;
-    if (this.isDiffing) {
-      return;
-    }
-    this.isDiffing = true;
-    const canvas = (_a = this._animationProps) == null ? void 0 : _a.canvas;
-    if (!(canvas instanceof HTMLCanvasElement)) {
-      throw new Error("canvas");
-    }
-    const diffOptions = {
-      ...this.testOptions.imageDiffOptions,
-      ...testCase.imageDiffOptions,
-      goldenImage: testCase.goldenImage,
-      region: getBoundingBoxInPage(canvas)
-    };
-    const result = await globalThis.browserTestDriver_captureAndDiffScreen(diffOptions);
-    if (result.success) {
-      this._pass(result);
-    } else {
-      this._fail(result);
-    }
-    this.isDiffing = false;
-    this._next();
+  unbindAfterRender() {
+  }
+  setConstantWebGL(location, value) {
   }
 };
 
-// dist/performance-test-runner.js
-var import_stats = require("@probe.gl/stats");
-var PerformanceTestRunner = class extends TestRunner {
-  _stats = null;
-  _fps = null;
-  constructor(props) {
-    super(props);
-    Object.assign(this.testOptions, {
-      maxFramesToRender: 60,
-      targetFPS: 50
-    });
+// dist/null-device/resources/null-transform-feedback.js
+var import_core15 = require("@luma.gl/core");
+var NullTransformFeedback = class extends import_core15.TransformFeedback {
+  device;
+  handle = null;
+  layout;
+  buffers = {};
+  constructor(device, props) {
+    super(device, props);
+    this.device = device;
+    this.layout = this.props.layout;
+    if (props.buffers) {
+      this.setBuffers(props.buffers);
+    }
+    Object.seal(this);
   }
-  initTestCase(testCase) {
-    super.initTestCase(testCase);
-    this._stats = new import_stats.Stats({ id: testCase.name });
-    this._fps = this._stats.get("fps");
+  begin(topology = "point-list") {
   }
-  shouldRender(animationProps) {
-    var _a, _b;
-    (_a = this._fps) == null ? void 0 : _a.timeEnd();
-    (_b = this._fps) == null ? void 0 : _b.timeStart();
-    if (this._fps.count > this.testOptions.maxFramesToRender) {
-      animationProps.done();
-    }
-    return true;
+  end() {
   }
-  assert(testCase) {
-    var _a, _b;
-    const targetFPS = testCase.targetFPS || this.testOptions.targetFPS;
-    const count = (_a = this._fps) == null ? void 0 : _a.count;
-    const fps = ((_b = this._fps) == null ? void 0 : _b.getHz()) || 0;
-    if (fps >= targetFPS) {
-      this._pass({ fps, framesRendered: count });
-    } else {
-      this._fail({ fps, framesRendered: count });
+  setBuffers(buffers) {
+    this.buffers = {};
+    for (const bufferName in buffers) {
+      this.setBuffer(bufferName, buffers[bufferName]);
     }
-    this._next();
+  }
+  setBuffer(locationOrName, bufferOrRange) {
+    this.buffers[locationOrName] = bufferOrRange;
+  }
+  getBuffer(locationOrName) {
+    return this.buffers[locationOrName] || null;
   }
 };
 
-// dist/null-device/null-adapter.js
-var import_core18 = require("@luma.gl/core");
-
-// dist/null-device/null-device.js
-var import_core17 = require("@luma.gl/core");
-
-// dist/null-device/null-device-info.js
-var NullDeviceInfo = {
-  type: "unknown",
-  gpu: "software",
-  gpuType: "unknown",
-  gpuBackend: "unknown",
-  vendor: "no one",
-  renderer: "none",
-  version: "1.0",
-  shadingLanguage: "glsl",
-  shadingLanguageVersion: 300
-};
-
-// dist/null-device/null-device-features.js
-var import_core3 = require("@luma.gl/core");
-var NullDeviceLimits = class extends import_core3.DeviceLimits {
-  maxTextureDimension1D = 0;
-  maxTextureDimension2D = 2048;
-  maxTextureDimension3D = 256;
-  maxTextureArrayLayers = 256;
-  maxBindGroups = 0;
-  maxDynamicUniformBuffersPerPipelineLayout = 0;
-  maxDynamicStorageBuffersPerPipelineLayout = 0;
-  maxSampledTexturesPerShaderStage = 8;
-  maxSamplersPerShaderStage = 16;
-  maxStorageBuffersPerShaderStage = 0;
-  maxStorageTexturesPerShaderStage = 0;
-  maxUniformBuffersPerShaderStage = 20;
-  maxUniformBufferBindingSize = 16384;
-  maxStorageBufferBindingSize = 0;
-  minUniformBufferOffsetAlignment = 0;
-  minStorageBufferOffsetAlignment = 0;
-  maxVertexBuffers = 16;
-  maxVertexAttributes = 16;
-  maxVertexBufferArrayStride = 2048;
-  maxInterStageShaderComponents = 60;
-  maxComputeWorkgroupStorageSize = 0;
-  maxComputeInvocationsPerWorkgroup = 0;
-  maxComputeWorkgroupSizeX = 0;
-  maxComputeWorkgroupSizeY = 0;
-  maxComputeWorkgroupSizeZ = 0;
-  maxComputeWorkgroupsPerDimension = 0;
-};
-
-// dist/null-device/null-canvas-context.js
-var import_core5 = require("@luma.gl/core");
-
-// dist/null-device/resources/null-framebuffer.js
-var import_core4 = require("@luma.gl/core");
-var NullFramebuffer = class extends import_core4.Framebuffer {
+// dist/null-device/resources/null-query-set.js
+var import_core16 = require("@luma.gl/core");
+var NullQuerySet = class extends import_core16.QuerySet {
   device;
-  colorAttachments = [];
-  depthStencilAttachment = null;
+  handle = null;
   constructor(device, props) {
     super(device, props);
     this.device = device;
   }
-  updateAttachments() {
+};
+
+// dist/null-device/null-device.js
+var NullDevice = class extends import_core17.Device {
+  static isSupported() {
+    return true;
+  }
+  type = "null";
+  handle = null;
+  preferredColorFormat = "rgba8unorm";
+  preferredDepthFormat = "depth24plus";
+  features = new import_core17.DeviceFeatures([], this.props._disabledFeatures);
+  limits = new NullDeviceLimits();
+  info = NullDeviceInfo;
+  canvasContext;
+  commandEncoder;
+  lost;
+  constructor(props) {
+    super({ ...props, id: props.id || "null-device" });
+    const canvasContextProps = import_core17.Device._getCanvasContextProps(props);
+    this.canvasContext = new NullCanvasContext(this, canvasContextProps);
+    this.lost = new Promise((resolve) => {
+    });
+    this.commandEncoder = new NullCommandEncoder(this, { id: "null-command-encoder" });
+  }
+  /**
+   * Destroys the context
+   * @note Has no effect for null contexts
+   */
+  destroy() {
+  }
+  get isLost() {
+    return false;
+  }
+  // IMPLEMENTATION OF ABSTRACT DEVICE
+  getTextureByteAlignment() {
+    return 1;
+  }
+  createCanvasContext(props) {
+    return new NullCanvasContext(this, props);
+  }
+  createBuffer(props) {
+    const newProps = this._normalizeBufferProps(props);
+    return new NullBuffer(this, newProps);
+  }
+  getDefaultRenderPass() {
+    return new NullRenderPass(this, {});
+  }
+  createTexture(props) {
+    return new NullTexture(this, props);
+  }
+  createExternalTexture(props) {
+    throw new Error("createExternalTexture() not implemented");
+  }
+  createSampler(props) {
+    return new NullSampler(this, props);
   }
-};
-
-// dist/null-device/null-canvas-context.js
-var NullCanvasContext = class extends import_core5.CanvasContext {
-  device;
-  format = "rgba8unorm";
-  depthStencilFormat = "depth24plus";
-  presentationSize;
-  _framebuffer = null;
-  get [Symbol.toStringTag]() {
-    return "NullCanvasContext";
+  createShader(props) {
+    return new NullShader(this, props);
   }
-  constructor(device, props) {
-    super(props);
-    this.device = device;
-    this.presentationSize = [-1, -1];
-    this._setAutoCreatedCanvasId(`${this.device.id}-canvas`);
-    this.update();
+  createFramebuffer(props) {
+    return new NullFramebuffer(this, props);
   }
-  getCurrentFramebuffer() {
-    this.update();
-    this._framebuffer = this._framebuffer || new NullFramebuffer(this.device, { handle: null });
-    return this._framebuffer;
+  createVertexArray(props) {
+    return new NullVertexArray(this, props);
   }
-  /** Resizes and updates render targets if necessary */
-  update() {
-    const size = this.getPixelSize();
-    const sizeChanged = size[0] !== this.presentationSize[0] || size[1] !== this.presentationSize[1];
-    if (sizeChanged) {
-      this.presentationSize = size;
-      this.resize();
-    }
+  createTransformFeedback(props) {
+    return new NullTransformFeedback(this, props);
   }
-  resize(options) {
-    if (this.canvas) {
-      const devicePixelRatio = this.getDevicePixelRatio(options == null ? void 0 : options.useDevicePixels);
-      this.setDevicePixelRatio(devicePixelRatio, options);
-      return;
-    }
+  createQuerySet(props) {
+    return new NullQuerySet(this, props);
+  }
+  createRenderPipeline(props) {
+    return new NullRenderPipeline(this, props);
   }
-  getDrawingBufferSize() {
-    return [this.width, this.height];
+  createComputePipeline(props) {
+    throw new Error("ComputePipeline not supported in WebGL");
   }
-  commit() {
+  createCommandEncoder(props = {}) {
+    return new NullCommandEncoder(this, props);
   }
-};
-
-// dist/null-device/resources/null-buffer.js
-var import_core6 = require("@luma.gl/core");
-var NullBuffer = class extends import_core6.Buffer {
-  device;
-  byteLength;
-  constructor(device, props = {}) {
-    super(device, props);
-    this.device = device;
-    const byteOffset = props.byteOffset || 0;
-    const byteLength = props.byteLength ?? (props.data ? props.data.byteLength + byteOffset : 0);
-    this.byteLength = byteLength;
-    this.trackAllocatedMemory(byteLength);
+  submit() {
   }
-  destroy() {
-    if (!this.destroyed) {
-      super.destroy();
-      this.trackDeallocatedMemory();
-    }
+  setParametersWebGL(parameters) {
   }
-  async readAsync(byteOffset = 0, byteLength) {
-    byteLength = byteLength ?? this.byteLength - byteOffset;
-    return new Uint8Array(byteLength);
+  getParametersWebGL(parameters) {
   }
-  write(data, byteOffset = 0) {
+  withParametersWebGL(parameters, func) {
+    const { nocatch = true } = parameters;
+    let value;
+    if (nocatch) {
+      return func();
+    }
+    try {
+      value = func();
+    } catch {
+    }
+    return value;
+  }
+  _getDeviceSpecificTextureFormatCapabilities(format) {
+    return format;
   }
 };
 
-// dist/null-device/resources/null-shader.js
-var import_core7 = require("@luma.gl/core");
-var NullShader = class extends import_core7.Shader {
-  device;
-  constructor(device, props) {
-    super(device, props);
-    this.device = device;
+// dist/null-device/null-adapter.js
+var NullAdapter = class extends import_core18.Adapter {
+  /** type of device's created by this adapter */
+  type = "null";
+  constructor() {
+    super();
+    NullDevice.adapter = this;
   }
-  get asyncCompilationStatus() {
-    return this.getCompilationInfo().then(() => "success");
+  isSupported() {
+    return true;
   }
-  async getCompilationInfo() {
-    return [];
+  isDeviceHandle(handle) {
+    return handle === null;
+  }
+  async attach(handle) {
+    return new NullDevice({});
+  }
+  async create(props = {}) {
+    return new NullDevice(props);
   }
 };
+var nullAdapter = new NullAdapter();
 
-// dist/null-device/resources/null-command-buffer.js
-var import_core8 = require("@luma.gl/core");
-var NullCommandEncoder = class extends import_core8.CommandEncoder {
-  device;
-  constructor(device, props) {
-    super(device, props);
-    this.device = device;
+// dist/create-test-device.js
+var DEFAULT_CANVAS_CONTEXT_PROPS = { width: 1, height: 1 };
+var nullDevicePromise = makeNullTestDevice();
+var webglDevicePromise = makeWebGLTestDevice();
+var webgpuDevicePromise = makeWebGPUTestDevice();
+async function getTestDevices(types = ["webgl", "webgpu"]) {
+  const promises = types.map((type) => getTestDevice(type));
+  const devices = await Promise.all(promises);
+  return devices.filter((device) => device !== null);
+}
+async function getTestDevice(type) {
+  switch (type) {
+    case "webgl":
+      return webglDevicePromise;
+    case "webgpu":
+      return webgpuDevicePromise;
+    case "null":
+      return nullDevicePromise;
+    case "unknown":
+      return null;
   }
-  finish() {
+}
+function getWebGPUTestDevice() {
+  return webgpuDevicePromise;
+}
+async function getWebGLTestDevice() {
+  return webglDevicePromise;
+}
+async function getNullTestDevice() {
+  return nullDevicePromise;
+}
+async function makeWebGPUTestDevice() {
+  const webgpuDeviceResolvers = withResolvers();
+  try {
+    const webgpuDevice = await import_core19.luma.createDevice({
+      id: "webgpu-test-device",
+      type: "webgpu",
+      adapters: [import_webgpu2.webgpuAdapter],
+      createCanvasContext: DEFAULT_CANVAS_CONTEXT_PROPS,
+      debug: true
+    });
+    webgpuDeviceResolvers.resolve(webgpuDevice);
+  } catch (error) {
+    import_core19.log.error(String(error))();
+    webgpuDeviceResolvers.resolve(null);
   }
-  copyBufferToBuffer(options) {
+  return webgpuDeviceResolvers.promise;
+}
+async function makeWebGLTestDevice() {
+  const webglDeviceResolvers = withResolvers();
+  try {
+    const webglDevice3 = await import_core19.luma.createDevice({
+      id: "webgl-test-device",
+      type: "webgl",
+      adapters: [import_webgl2.webgl2Adapter],
+      createCanvasContext: DEFAULT_CANVAS_CONTEXT_PROPS,
+      debug: true,
+      debugWebGL: true
+    });
+    webglDeviceResolvers.resolve(webglDevice3);
+  } catch (error) {
+    import_core19.log.error(String(error))();
+    webglDeviceResolvers.resolve(null);
   }
-  copyBufferToTexture(options) {
+  return webglDeviceResolvers.promise;
+}
+async function makeNullTestDevice() {
+  const nullDeviceResolvers = withResolvers();
+  try {
+    const nullDevice = await import_core19.luma.createDevice({
+      id: "null-test-device",
+      type: "null",
+      adapters: [nullAdapter],
+      createCanvasContext: DEFAULT_CANVAS_CONTEXT_PROPS,
+      debug: true,
+      debugWebGL: true
+    });
+    nullDeviceResolvers.resolve(nullDevice);
+  } catch (error) {
+    import_core19.log.error(String(error))();
+    nullDevicePromise = Promise.resolve(null);
   }
-  copyTextureToBuffer(options) {
+  return nullDeviceResolvers.promise;
+}
+function withResolvers() {
+  let resolve;
+  let reject;
+  const promise = new Promise((_resolve, _reject) => {
+    resolve = _resolve;
+    reject = _reject;
+  });
+  return { promise, resolve, reject };
+}
+
+// dist/deprecated/classic-animation-loop.js
+var import_core20 = require("@luma.gl/core");
+var import_engine = require("@luma.gl/engine");
+var import_env = require("@probe.gl/env");
+var import_webgl3 = require("@luma.gl/webgl");
+var isPage = (0, import_env.isBrowser)() && typeof document !== "undefined";
+function getHTMLCanvasElement(canvas) {
+  return typeof HTMLCanvasElement !== "undefined" && canvas instanceof HTMLCanvasElement ? canvas : null;
+}
+var statIdCounter = 0;
+var DEFAULT_CLASSIC_ANIMATION_LOOP_PROPS = {
+  onCreateDevice: (props) => import_core20.luma.createDevice({ ...props, debug: true }),
+  onCreateContext: void 0,
+  onAddHTML: void 0,
+  onInitialize: () => ({}),
+  onRender: () => {
+  },
+  onFinalize: () => {
+  },
+  onError: (error) => console.error(error),
+  // eslint-disable-line no-console
+  device: null,
+  // debug: true,
+  // view parameters
+  useDevicePixels: true,
+  autoResizeViewport: true,
+  autoResizeDrawingBuffer: true,
+  stats: import_core20.luma.stats.get(`animation-loop-${statIdCounter++}`),
+  // deprecated
+  // onCreateContext: (opts) => createGLContext(opts),
+  gl: void 0,
+  glOptions: {},
+  createFramebuffer: false
+};
+var ClassicAnimationLoop = class {
+  device;
+  canvas;
+  props;
+  animationProps;
+  // framebuffer: ClassicFramebuffer = null;
+  timeline = null;
+  stats;
+  cpuTime;
+  gpuTime;
+  frameRate;
+  display;
+  needsRedraw = "initialized";
+  _initialized = false;
+  _running = false;
+  _animationFrameId = null;
+  _pageLoadPromise = null;
+  _nextFramePromise = null;
+  _resolveNextFrame = null;
+  _cpuStartTime = 0;
+  // _gpuTimeQuery: Query | null = null;
+  /** @deprecated */
+  gl;
+  /*
+   */
+  constructor(props = {}) {
+    this.props = { ...DEFAULT_CLASSIC_ANIMATION_LOOP_PROPS, ...props };
+    props = this.props;
+    let { useDevicePixels = true } = this.props;
+    if ("useDevicePixelRatio" in props) {
+      import_core20.log.deprecated("useDevicePixelRatio", "useDevicePixels")();
+      useDevicePixels = props.useDevicePixelRatio;
+    }
+    this.device = props.device;
+    this.gl = this.device && this.device.gl || props.gl;
+    this.stats = props.stats;
+    this.cpuTime = this.stats.get("CPU Time");
+    this.gpuTime = this.stats.get("GPU Time");
+    this.frameRate = this.stats.get("Frame Rate");
+    this.setProps({
+      autoResizeViewport: props.autoResizeViewport,
+      autoResizeDrawingBuffer: props.autoResizeDrawingBuffer,
+      useDevicePixels
+    });
+    this.start = this.start.bind(this);
+    this.stop = this.stop.bind(this);
+    this._onMousemove = this._onMousemove.bind(this);
+    this._onMouseleave = this._onMouseleave.bind(this);
   }
-  copyTextureToTexture(options) {
+  destroy() {
+    this.stop();
+    this._setDisplay(null);
   }
-  pushDebugGroup(groupLabel) {
+  /** @deprecated Use .destroy() */
+  delete() {
+    this.destroy();
   }
-  popDebugGroup() {
+  setNeedsRedraw(reason) {
+    this.needsRedraw = this.needsRedraw || reason;
+    return this;
   }
-  insertDebugMarker(markerLabel) {
+  setProps(props) {
+    if ("autoResizeViewport" in props) {
+      this.props.autoResizeViewport = props.autoResizeViewport;
+    }
+    if ("autoResizeDrawingBuffer" in props) {
+      this.props.autoResizeDrawingBuffer = props.autoResizeDrawingBuffer;
+    }
+    if ("useDevicePixels" in props) {
+      this.props.useDevicePixels = props.useDevicePixels;
+    }
+    return this;
+  }
+  start(opts = {}) {
+    this._start(opts);
+    return this;
+  }
+  /** Starts a render loop if not already running */
+  async _start(props) {
+    if (this._running) {
+      return this;
+    }
+    this._running = true;
+    try {
+      await this._getPageLoadPromise();
+      if (!this._running) {
+        return null;
+      }
+      let appContext;
+      if (!this._initialized) {
+        this._initialized = true;
+        await this._createDevice(props);
+        this._initialize(props);
+        appContext = await this.onInitialize(this.animationProps);
+        this._addCallbackData(appContext || {});
+      }
+      if (!this._running) {
+        return null;
+      }
+      if (appContext !== false) {
+        this._cancelAnimationFrame();
+        this._requestAnimationFrame();
+      }
+      return this;
+    } catch (error) {
+      this.props.onError(error);
+      return null;
+    }
   }
-  resolveQuerySet(querySet) {
+  /** Explicitly draw a frame */
+  redraw() {
+    if (this.isContextLost()) {
+      return this;
+    }
+    this._beginTimers();
+    this._setupFrame();
+    this._updateCallbackData();
+    this._renderFrame(this.animationProps);
+    this._clearNeedsRedraw();
+    if (this._resolveNextFrame) {
+      this._resolveNextFrame(this);
+      this._nextFramePromise = null;
+      this._resolveNextFrame = null;
+    }
+    this._endTimers();
+    return this;
   }
-};
-
-// dist/null-device/resources/null-sampler.js
-var import_core9 = require("@luma.gl/core");
-var NullSampler = class extends import_core9.Sampler {
-  device;
-  constructor(device, props) {
-    super(device, props);
-    this.device = device;
+  // Stops a render loop if already running, finalizing
+  stop() {
+    if (this._running) {
+      this._finalizeCallbackData();
+      this._cancelAnimationFrame();
+      this._nextFramePromise = null;
+      this._resolveNextFrame = null;
+      this._running = false;
+    }
+    return this;
   }
-};
-
-// dist/null-device/resources/null-texture.js
-var import_core11 = require("@luma.gl/core");
-
-// dist/null-device/resources/null-texture-view.js
-var import_core10 = require("@luma.gl/core");
-var NullTextureView = class extends import_core10.TextureView {
-  device;
-  texture;
-  constructor(device, props) {
-    super(device, { ...import_core10.Texture.defaultProps, ...props });
-    this.device = device;
-    this.texture = props.texture;
+  attachTimeline(timeline) {
+    this.timeline = timeline;
+    return this.timeline;
   }
-};
-
-// dist/null-device/resources/null-texture.js
-var NullTexture = class extends import_core11.Texture {
-  device;
-  sampler;
-  view;
-  constructor(device, props) {
-    super(device, props);
-    const propsWithData = { ...this.props };
-    propsWithData.data = props.data;
-    this.device = device;
-    this.initialize(propsWithData);
-    Object.seal(this);
+  detachTimeline() {
+    this.timeline = null;
   }
-  destroy() {
-    if (!this.destroyed) {
-      super.destroy();
-      this.trackDeallocatedMemory("Texture");
+  waitForRender() {
+    this.setNeedsRedraw("waitForRender");
+    if (!this._nextFramePromise) {
+      this._nextFramePromise = new Promise((resolve) => {
+        this._resolveNextFrame = resolve;
+      });
     }
+    return this._nextFramePromise;
   }
-  createView(props) {
-    return new NullTextureView(this.device, { ...props, texture: this });
-  }
-  setTexture1DData(data) {
-    throw new Error("not implemented");
+  async toDataURL() {
+    var _a;
+    this.setNeedsRedraw("toDataURL");
+    await this.waitForRender();
+    return (_a = getHTMLCanvasElement(this.gl.canvas)) == null ? void 0 : _a.toDataURL();
   }
-  setTexture2DData(lodData, depth, target) {
-    throw new Error("not implemented");
+  isContextLost() {
+    return this.gl.isContextLost();
   }
-  setTexture3DData(lodData, depth, target) {
-    throw new Error("not implemented");
+  onCreateDevice(deviceProps) {
+    const { onCreateDevice } = this.props;
+    return onCreateDevice(deviceProps);
   }
-  setTextureCubeData(data, depth) {
-    throw new Error("not implemented");
+  onInitialize(animationProps) {
+    const { onInitialize } = this.props;
+    return onInitialize(animationProps);
   }
-  setTextureArrayData(data) {
-    throw new Error("not implemented");
+  onRender(animationProps) {
+    const { onRender } = this.props;
+    return onRender(animationProps);
   }
-  setTextureCubeArrayData(data) {
-    throw new Error("not implemented");
+  onFinalize(animationProps) {
+    const { onFinalize } = this.props;
+    return onFinalize(animationProps);
   }
-  initialize(props = {}) {
-    this.setSampler(props.sampler);
-    this.view = new NullTextureView(this.device, {
-      ...props,
-      texture: this,
-      mipLevelCount: 1,
-      arrayLayerCount: 1
-    });
-    return this;
+  // DEPRECATED/REMOVED METHODS
+  /** @deprecated Use .onCreateDevice() */
+  onCreateContext(props) {
+    const { onCreateContext } = this.props;
+    return onCreateContext(props);
   }
-  setSampler(sampler = {}) {
-    if (sampler instanceof NullSampler) {
-      this.sampler = sampler;
-    } else {
-      this.sampler = new NullSampler(this.device, sampler);
-    }
-    return this;
+  /** @deprecated */
+  getHTMLControlValue(id, defaultValue = 1) {
+    const element = document.getElementById(id);
+    return element ? Number(element.value) : defaultValue;
   }
-  copyExternalImage(options) {
-    this.trackDeallocatedMemory("Texture");
-    const { image: data } = options;
-    const bytesPerPixel = 4;
-    this.trackAllocatedMemory(this.width * this.height * bytesPerPixel, "Texture");
-    const width = options.width ?? data.width;
-    const height = options.height ?? data.height;
-    this.width = width;
-    this.height = height;
-    return { width, height };
+  // PRIVATE METHODS
+  _initialize(props) {
+    this._createFramebuffer();
+    this._startEventHandling();
+    this._initializeCallbackData();
+    this._updateCallbackData();
+    this._resizeCanvasDrawingBuffer();
+    this._resizeViewport();
   }
-};
-
-// dist/null-device/resources/null-render-pass.js
-var import_core12 = require("@luma.gl/core");
-var NullRenderPass = class extends import_core12.RenderPass {
-  device;
-  constructor(device, props) {
-    super(device, props);
-    this.device = device;
+  _getPageLoadPromise() {
+    if (!this._pageLoadPromise) {
+      this._pageLoadPromise = isPage ? new Promise((resolve, reject) => {
+        if (isPage && document.readyState === "complete") {
+          resolve(document);
+          return;
+        }
+        window.addEventListener("load", () => {
+          resolve(document);
+        });
+      }) : Promise.resolve({});
+    }
+    return this._pageLoadPromise;
   }
-  end() {
+  _setDisplay(display) {
+    if (this.display) {
+      this.display.destroy();
+      this.display.animationLoop = null;
+    }
+    if (display) {
+      display.animationLoop = this;
+    }
+    this.display = display;
   }
-  pushDebugGroup(groupLabel) {
+  _requestAnimationFrame() {
+    if (!this._running) {
+      return;
+    }
+    this._animationFrameId = (0, import_engine.requestAnimationFramePolyfill)(this._animationFrame.bind(this));
   }
-  popDebugGroup() {
+  _cancelAnimationFrame() {
+    if (this._animationFrameId !== null) {
+      return;
+    }
+    (0, import_engine.cancelAnimationFramePolyfill)(this._animationFrameId);
+    this._animationFrameId = null;
   }
-  insertDebugMarker(markerLabel) {
+  _animationFrame() {
+    if (!this._running) {
+      return;
+    }
+    this.redraw();
+    this._requestAnimationFrame();
   }
-  setParameters(parameters = {}) {
+  // Called on each frame, can be overridden to call onRender multiple times
+  // to support e.g. stereoscopic rendering
+  _renderFrame(props) {
+    if (this.display) {
+      this.display._renderFrame(props);
+      return;
+    }
+    this.onRender(props);
   }
-  beginOcclusionQuery(queryIndex) {
+  _clearNeedsRedraw() {
+    this.needsRedraw = null;
   }
-  endOcclusionQuery() {
+  _setupFrame() {
+    this._resizeCanvasDrawingBuffer();
+    this._resizeViewport();
+    this._resizeFramebuffer();
   }
-};
-
-// dist/null-device/resources/null-render-pipeline.js
-var import_core13 = require("@luma.gl/core");
-var NullRenderPipeline = class extends import_core13.RenderPipeline {
-  device;
-  vs;
-  fs;
-  uniforms = {};
-  bindings = {};
-  constructor(device, props) {
-    super(device, props);
-    this.device = device;
-    this.vs = props.vs;
-    this.fs = props.fs;
-    this.shaderLayout = props.shaderLayout || {
-      attributes: [],
-      bindings: [],
-      uniforms: []
+  /* eslint-disable @typescript-eslint/unbound-method */
+  // Initialize the  object that will be passed to app callbacks
+  _initializeCallbackData() {
+    this.animationProps = {
+      device: this.device,
+      gl: this.gl,
+      stop: this.stop,
+      canvas: this.gl.canvas,
+      // Initial values
+      useDevicePixels: this.props.useDevicePixels,
+      needsRedraw: null,
+      // Animation props
+      startTime: Date.now(),
+      engineTime: 0,
+      tick: 0,
+      tock: 0,
+      timeline: this.timeline,
+      // @ts-ignore
+      animationLoop: this,
+      // Timeline time for back compatibility
+      time: 0,
+      // Experimental
+      _mousePosition: null,
+      // Event props
+      /** @deprecated */
+      // framebuffer: this.framebuffer,
+      /** @deprecated */
+      _timeline: this.timeline,
+      /** @deprecated */
+      _loop: this,
+      /** @deprecated */
+      _animationLoop: this
     };
   }
-  setBindings(bindings) {
-    Object.assign(this.bindings, bindings);
+  // Update the context object that will be passed to app callbacks
+  _updateCallbackData() {
+    const { width, height, aspect } = this._getSizeAndAspect();
+    if (width !== this.animationProps.width || height !== this.animationProps.height) {
+      this.setNeedsRedraw("drawing buffer resized");
+    }
+    if (aspect !== this.animationProps.aspect) {
+      this.setNeedsRedraw("drawing buffer aspect changed");
+    }
+    this.animationProps.width = width;
+    this.animationProps.height = height;
+    this.animationProps.aspect = aspect;
+    this.animationProps.needsRedraw = this.needsRedraw;
+    this.animationProps.engineTime = Date.now() - this.animationProps.startTime;
+    if (this.timeline) {
+      this.timeline.update(this.animationProps.engineTime);
+    }
+    this.animationProps.tick = Math.floor(this.animationProps.time / 1e3 * 60);
+    this.animationProps.tock++;
+    this.animationProps.time = this.timeline ? this.timeline.getTime() : this.animationProps.engineTime;
   }
-  setUniformsWebGL(uniforms) {
-    Object.assign(this.uniforms, uniforms);
+  _finalizeCallbackData() {
+    this.onFinalize(this.animationProps);
   }
-  draw(options) {
-    const { renderPass, vertexArray } = options;
-    vertexArray.bindBeforeRender(renderPass);
-    vertexArray.unbindAfterRender(renderPass);
-    return true;
+  /** Add application's data to the app context object */
+  _addCallbackData(appContext) {
+    if (typeof appContext === "object" && appContext !== null) {
+      this.animationProps = Object.assign({}, this.animationProps, appContext);
+    }
   }
-};
-
-// dist/null-device/resources/null-vertex-array.js
-var import_core14 = require("@luma.gl/core");
-var NullVertexArray = class extends import_core14.VertexArray {
-  device;
-  // Create a VertexArray
-  constructor(device, props) {
-    super(device, props);
-    this.device = device;
+  /** Either uses supplied or existing context, or calls provided callback to create one */
+  async _createDevice(props) {
+    const deviceProps = { ...this.props, ...props, ...this.props.glOptions };
+    this.device = await this.onCreateDevice(deviceProps);
+    this.gl = this.device.gl;
+    (0, import_webgl3.resetGLParameters)(this.gl);
+    this._createInfoDiv();
   }
-  setIndexBuffer(indexBuffer) {
-    this.indexBuffer = indexBuffer;
+  _createInfoDiv() {
+    const canvas = getHTMLCanvasElement(this.gl.canvas);
+    if (canvas && this.props.onAddHTML) {
+      const wrapperDiv = document.createElement("div");
+      document.body.appendChild(wrapperDiv);
+      wrapperDiv.style.position = "relative";
+      const div = document.createElement("div");
+      div.style.position = "absolute";
+      div.style.left = "10px";
+      div.style.bottom = "10px";
+      div.style.width = "300px";
+      div.style.background = "white";
+      if (canvas) {
+        wrapperDiv.appendChild(canvas);
+      }
+      wrapperDiv.appendChild(div);
+      const html = this.props.onAddHTML(div);
+      if (html) {
+        div.innerHTML = html;
+      }
+    }
   }
-  /** Set a location in vertex attributes array to a buffer, enables the location, sets divisor */
-  setBuffer(location, attributeBuffer) {
-    const attributeInfo = this.attributeInfos[location];
-    if (!attributeInfo) {
-      throw new Error(`Unknown attribute location ${location}`);
+  _getSizeAndAspect() {
+    const width = this.gl.drawingBufferWidth;
+    const height = this.gl.drawingBufferHeight;
+    let aspect = 1;
+    const canvas = getHTMLCanvasElement(this.gl.canvas);
+    if (canvas && canvas.clientHeight) {
+      aspect = canvas.clientWidth / canvas.clientHeight;
+    } else if (width > 0 && height > 0) {
+      aspect = width / height;
     }
-    this.attributes[location] = attributeBuffer;
+    return { width, height, aspect };
   }
-  bindBeforeRender() {
+  /** Default viewport setup */
+  _resizeViewport() {
+    if (this.props.autoResizeViewport) {
+      this.gl.viewport(0, 0, this.gl.drawingBufferWidth, this.gl.drawingBufferHeight);
+    }
   }
-  unbindAfterRender() {
+  /**
+   * Resize the render buffer of the canvas to match canvas client size
+   * Optionally multiplying with devicePixel ratio
+   */
+  _resizeCanvasDrawingBuffer() {
+    if (this.props.autoResizeDrawingBuffer) {
+      this.device.getDefaultCanvasContext().resize({ useDevicePixels: this.props.useDevicePixels });
+    }
   }
-  setConstantWebGL(location, value) {
+  _beginTimers() {
+    this.frameRate.timeEnd();
+    this.frameRate.timeStart();
+    this.cpuTime.timeStart();
   }
-};
-
-// dist/null-device/resources/null-transform-feedback.js
-var import_core15 = require("@luma.gl/core");
-var NullTransformFeedback = class extends import_core15.TransformFeedback {
-  device;
-  layout;
-  buffers = {};
-  constructor(device, props) {
-    super(device, props);
-    this.device = device;
-    this.layout = this.props.layout;
-    if (props.buffers) {
-      this.setBuffers(props.buffers);
+  _endTimers() {
+    this.cpuTime.timeEnd();
+  }
+  // Event handling
+  _startEventHandling() {
+    const { canvas } = this.gl;
+    if (canvas) {
+      canvas.addEventListener("mousemove", this._onMousemove);
+      canvas.addEventListener("mouseleave", this._onMouseleave);
     }
-    Object.seal(this);
   }
-  begin(topology = "point-list") {
+  _onMousemove(e) {
+    this.animationProps._mousePosition = [e.offsetX, e.offsetY];
   }
-  end() {
+  _onMouseleave(e) {
+    this.animationProps._mousePosition = null;
   }
-  setBuffers(buffers) {
-    this.buffers = {};
-    for (const bufferName in buffers) {
-      this.setBuffer(bufferName, buffers[bufferName]);
+  // Deprecated
+  /** @deprecated */
+  _createFramebuffer() {
+    if (this.props.createFramebuffer) {
     }
   }
-  setBuffer(locationOrName, bufferOrRange) {
-    this.buffers[locationOrName] = bufferOrRange;
-  }
-  getBuffer(locationOrName) {
-    return this.buffers[locationOrName] || null;
+  /** @deprecated */
+  _resizeFramebuffer() {
   }
 };
 
-// dist/null-device/resources/null-query-set.js
-var import_core16 = require("@luma.gl/core");
-var NullQuerySet = class extends import_core16.QuerySet {
-  device;
-  constructor(device, props) {
-    super(device, props);
-    this.device = device;
+// dist/test-runner.js
+var DEFAULT_TEST_CASE = {
+  name: "Unnamed test",
+  onInitialize: async () => {
+  },
+  onRender: ({ done }) => done(),
+  onFinalize: () => {
   }
 };
-
-// dist/null-device/null-device.js
-var NullDevice = class extends import_core17.Device {
-  static isSupported() {
-    return true;
-  }
-  type = "unknown";
-  features = new import_core17.DeviceFeatures([], this.props._disabledFeatures);
-  limits = new NullDeviceLimits();
-  info = NullDeviceInfo;
-  canvasContext;
-  lost;
-  constructor(props) {
-    super({ ...props, id: props.id || "null-device" });
-    const canvasContextProps = import_core17.Device._getCanvasContextProps(props);
-    this.canvasContext = new NullCanvasContext(this, canvasContextProps);
-    this.lost = new Promise((resolve) => {
-    });
-    this.canvasContext.resize();
-  }
+var DEFAULT_TEST_PROPS = {
+  width: void 0,
+  height: void 0,
+  // test lifecycle callback
+  onTestStart: (testCase) => console.log(`# ${testCase.name}`),
+  onTestPass: (testCase, result) => console.log(`ok ${testCase.name} passed`),
+  onTestFail: (testCase, error) => console.log(`not ok ${testCase.name} failed`),
+  // milliseconds to wait for each test case before aborting
+  timeout: 2e3,
+  maxFramesToRender: void 0,
+  imageDiffOptions: void 0
+};
+var TestRunner = class {
+  device = webglDevice;
+  props;
+  isRunning = false;
+  testOptions = { ...DEFAULT_TEST_PROPS };
+  _animationProps;
+  _animationLoop;
+  _testCases = [];
+  _testCaseData = null;
+  _currentTestCase;
+  _currentTestCaseStartTime;
+  _currentTestCaseStartTick;
+  // should be defined in snapshot-test-runner
+  isDiffing = false;
+  // @ts-expect-error
+  isHeadless = Boolean(window.browserTestDriver_isHeadless);
   /**
-   * Destroys the context
-   * @note Has no effect for null contexts
+   * props
+   *   AnimationLoop props
    */
-  destroy() {
-  }
-  get isLost() {
-    return false;
-  }
-  // IMPLEMENTATION OF ABSTRACT DEVICE
-  createCanvasContext(props) {
-    return new NullCanvasContext(this, props);
-  }
-  createBuffer(props) {
-    const newProps = this._normalizeBufferProps(props);
-    return new NullBuffer(this, newProps);
-  }
-  getDefaultRenderPass() {
-    return new NullRenderPass(this, {});
-  }
-  createTexture(props) {
-    return new NullTexture(this, props);
-  }
-  createExternalTexture(props) {
-    throw new Error("createExternalTexture() not implemented");
-  }
-  createSampler(props) {
-    return new NullSampler(this, props);
+  constructor(props = {}) {
+    this.props = props;
   }
-  createShader(props) {
-    return new NullShader(this, props);
+  /**
+   * Add testCase(s)
+   */
+  add(testCases) {
+    if (!Array.isArray(testCases)) {
+      testCases = [testCases];
+    }
+    for (const testCase of testCases) {
+      this._testCases.push(testCase);
+    }
+    return this;
   }
-  createFramebuffer(props) {
-    return new NullFramebuffer(this, props);
+  /**
+   * Returns a promise that resolves when all the test cases are done
+   */
+  async run(options = {}) {
+    this.testOptions = { ...this.testOptions, ...options };
+    const device = await getWebGLTestDevice();
+    return new Promise((resolve, reject) => {
+      this._animationLoop = new ClassicAnimationLoop({
+        ...this.props,
+        device: this.device,
+        onRender: this._onRender.bind(this),
+        onFinalize: () => {
+          this.isRunning = false;
+          resolve();
+        }
+      });
+      this._animationLoop.start(this.props);
+      this.isRunning = true;
+      this.isDiffing = false;
+      this._currentTestCase = null;
+    }).catch((error) => {
+      this._fail({ error: error.message });
+    });
   }
-  createVertexArray(props) {
-    return new NullVertexArray(this, props);
+  /* Lifecycle methods for subclassing */
+  initTestCase(testCase) {
+    const { animationLoop } = testCase;
+    if (animationLoop) {
+      testCase.onInitialize = animationLoop.props.onInitialize.bind(animationLoop);
+      testCase.onRender = animationLoop.props.onRender.bind(animationLoop);
+      testCase.onFinalize = animationLoop.props.onFinalize.bind(animationLoop);
+    }
+    for (const key in DEFAULT_TEST_CASE) {
+      testCase[key] = testCase[key] || DEFAULT_TEST_CASE[key];
+    }
   }
-  createTransformFeedback(props) {
-    return new NullTransformFeedback(this, props);
+  shouldRender(animationProps) {
+    return true;
   }
-  createQuerySet(props) {
-    return new NullQuerySet(this, props);
+  assert(testCase) {
+    this._pass(testCase);
+    this._next();
   }
-  createRenderPipeline(props) {
-    return new NullRenderPipeline(this, props);
+  /* Utilities */
+  _pass(result) {
+    this.testOptions.onTestPass(this._currentTestCase, result);
   }
-  beginRenderPass(props) {
-    return new NullRenderPass(this, props);
+  _fail(result) {
+    this.testOptions.onTestFail(this._currentTestCase, result);
   }
-  createComputePipeline(props) {
-    throw new Error("ComputePipeline not supported in WebGL");
+  _next() {
+    this._nextTestCase();
   }
-  beginComputePass(props) {
-    throw new Error("ComputePass not supported in WebGL");
+  /* Private methods */
+  _onRender(animationProps) {
+    this._animationProps = animationProps;
+    const testCase = this._currentTestCase || this._nextTestCase();
+    if (!testCase) {
+      this._animationLoop.stop();
+      return;
+    }
+    let isDone = false;
+    const testCaseAnimationProps = {
+      ...animationProps,
+      ...this._testCaseData,
+      // tick/time starts from 0 for each test case
+      startTime: this._currentTestCaseStartTime,
+      time: animationProps.time - this._currentTestCaseStartTime,
+      tick: animationProps.tick - this._currentTestCaseStartTick,
+      // called by the test case when it is done rendering and ready for capture and diff
+      done: () => {
+        isDone = true;
+      }
+    };
+    if (this._testCaseData && this.shouldRender(testCaseAnimationProps)) {
+      testCase.onRender(testCaseAnimationProps);
+    }
+    const timeout = testCase.timeout || this.testOptions.timeout;
+    if (timeout && testCaseAnimationProps.time > timeout) {
+      isDone = true;
+    }
+    if (isDone) {
+      this.assert(testCase);
+    }
   }
-  createCommandEncoder(props = {}) {
-    return new NullCommandEncoder(this, props);
+  _nextTestCase() {
+    const animationProps = this._animationProps;
+    if (this._testCaseData) {
+      for (const key in this._testCaseData) {
+        const value = this._testCaseData[key];
+        if (value && value.delete) {
+          value.destroy();
+        }
+      }
+      this._currentTestCase.onFinalize(Object.assign({}, animationProps, this._testCaseData));
+      this.device.popState();
+      this._currentTestCase = null;
+      this._testCaseData = null;
+    }
+    const testCase = this._testCases.shift();
+    if (testCase) {
+      this._currentTestCase = testCase;
+      this._currentTestCaseStartTime = animationProps.time;
+      this._currentTestCaseStartTick = animationProps.tick;
+      this.initTestCase(testCase);
+      this.device.pushState();
+      const initProps = {
+        ...animationProps,
+        // tick/time starts from 0 for each test case
+        startTime: animationProps.time,
+        time: 0,
+        tick: 0
+      };
+      Promise.resolve(testCase.onInitialize(initProps)).then((userData) => {
+        this._testCaseData = userData || {};
+      });
+      this.testOptions.onTestStart(testCase);
+    }
+    return testCase;
   }
-  submit() {
+};
+
+// dist/utils/get-bounding-box.js
+function getBoundingBoxInPage(domElement) {
+  const bbox = domElement.getBoundingClientRect();
+  return {
+    x: window.scrollX + bbox.x,
+    y: window.scrollY + bbox.y,
+    width: bbox.width,
+    height: bbox.height
+  };
+}
+
+// dist/snapshot-test-runner.js
+var SnapshotTestRunner = class extends TestRunner {
+  // should be defined here but hack access in TestRunner
+  // private isDiffing: boolean = false;
+  constructor(props) {
+    super(props);
+    this.testOptions.imageDiffOptions = {};
   }
-  setParametersWebGL(parameters) {
+  initTestCase(testCase) {
+    super.initTestCase(testCase);
+    if (!testCase.goldenImage) {
+      throw new Error(`Test case ${testCase.name} does not have golden image`);
+    }
   }
-  getParametersWebGL(parameters) {
+  shouldRender() {
+    return !this.isDiffing;
   }
-  withParametersWebGL(parameters, func) {
-    const { nocatch = true } = parameters;
-    let value;
-    if (nocatch) {
-      return func();
+  async assert(testCase) {
+    var _a;
+    if (this.isDiffing) {
+      return;
     }
-    try {
-      value = func();
-    } catch {
+    this.isDiffing = true;
+    const canvas = (_a = this._animationProps) == null ? void 0 : _a.canvas;
+    if (!(canvas instanceof HTMLCanvasElement)) {
+      throw new Error("canvas");
     }
-    return value;
-  }
-  _getDeviceSpecificTextureFormatCapabilities(format) {
-    return format;
+    const diffOptions = {
+      ...this.testOptions.imageDiffOptions,
+      ...testCase.imageDiffOptions,
+      goldenImage: testCase.goldenImage,
+      region: getBoundingBoxInPage(canvas)
+    };
+    const result = await globalThis.browserTestDriver_captureAndDiffScreen(diffOptions);
+    if (result.success) {
+      this._pass(result);
+    } else {
+      this._fail(result);
+    }
+    this.isDiffing = false;
+    this._next();
   }
 };
 
-// dist/null-device/null-adapter.js
-var NullAdapter = class extends import_core18.Adapter {
-  /** type of device's created by this adapter */
-  type = "unknown";
-  constructor() {
-    super();
-    NullDevice.adapter = this;
+// dist/performance-test-runner.js
+var import_stats = require("@probe.gl/stats");
+var PerformanceTestRunner = class extends TestRunner {
+  _stats = null;
+  _fps = null;
+  constructor(props) {
+    super(props);
+    Object.assign(this.testOptions, {
+      maxFramesToRender: 60,
+      targetFPS: 50
+    });
   }
-  /** Check if WebGPU is available */
-  isSupported() {
-    return true;
+  initTestCase(testCase) {
+    super.initTestCase(testCase);
+    this._stats = new import_stats.Stats({ id: testCase.name });
+    this._fps = this._stats.get("fps");
   }
-  async attach(handle) {
-    return new NullDevice({});
+  shouldRender(animationProps) {
+    var _a, _b;
+    (_a = this._fps) == null ? void 0 : _a.timeEnd();
+    (_b = this._fps) == null ? void 0 : _b.timeStart();
+    if (this._fps.count > this.testOptions.maxFramesToRender) {
+      animationProps["done"]();
+    }
+    return true;
   }
-  async create(props = {}) {
-    return new NullDevice(props);
+  assert(testCase) {
+    var _a, _b;
+    const targetFPS = testCase.targetFPS || this.testOptions.targetFPS;
+    const count = (_a = this._fps) == null ? void 0 : _a.count;
+    const fps = ((_b = this._fps) == null ? void 0 : _b.getHz()) || 0;
+    if (fps >= targetFPS) {
+      this._pass({ fps, framesRendered: count });
+    } else {
+      this._fail({ fps, framesRendered: count });
+    }
+    this._next();
   }
 };
-var nullAdapter = new NullAdapter();
 
 // dist/utils/check-type.js
 function checkType(value) {
@@ -1374,4 +1472,21 @@ function getLeakedResources(startCounts, endCounts) {
   }
   return leakedResources;
 }
+
+// dist/deprecated/sync-test-device.js
+var import_webgl4 = require("@luma.gl/webgl");
+var DEFAULT_CANVAS_CONTEXT_PROPS2 = {
+  width: 1,
+  height: 1
+};
+function createTestDevice() {
+  try {
+    return new import_webgl4.WebGLDevice({ createCanvasContext: DEFAULT_CANVAS_CONTEXT_PROPS2 });
+  } catch (error) {
+    console.error(`Failed to created device: ${error.message}`);
+    debugger;
+    return null;
+  }
+}
+var webglDevice2 = createTestDevice();
 //# sourceMappingURL=index.cjs.map