@luma.gl/webgl 9.0.0-beta.4 → 9.0.0-beta.5

package/dist/adapter/webgl-device.js

@@ -1,399 +1,458 @@
+// luma.gl, MIT license
+// Copyright (c) vis.gl contributors
 import { Device, CanvasContext, log, uid, assert } from '@luma.gl/core';
 import { isBrowser } from '@probe.gl/env';
-import { polyfillContext } from "../context/polyfill/polyfill-context.js";
-import { popContextState, pushContextState, trackContextState } from "../context/state-tracker/track-context-state.js";
-import { createBrowserContext } from "../context/context/create-browser-context.js";
-import { createHeadlessContext, isHeadlessGLRegistered } from "../context/context/create-headless-context.js";
-import { getDeviceInfo } from "./device-helpers/get-device-info.js";
-import { getDeviceFeatures } from "./device-helpers/device-features.js";
-import { getDeviceLimits, getWebGLLimits } from "./device-helpers/device-limits.js";
-import { WebGLCanvasContext } from "./webgl-canvas-context.js";
-import { loadSpectorJS, initializeSpectorJS } from "../context/debug/spector.js";
-import { loadWebGLDeveloperTools, makeDebugContext } from "../context/debug/webgl-developer-tools.js";
-import { isTextureFormatSupported, isTextureFormatRenderable, isTextureFormatFilterable } from "./converters/texture-formats.js";
-import { WEBGLBuffer } from "./resources/webgl-buffer.js";
-import { WEBGLShader } from "./resources/webgl-shader.js";
-import { WEBGLSampler } from "./resources/webgl-sampler.js";
-import { WEBGLTexture } from "./resources/webgl-texture.js";
-import { WEBGLFramebuffer } from "./resources/webgl-framebuffer.js";
-import { WEBGLRenderPass } from "./resources/webgl-render-pass.js";
-import { WEBGLRenderPipeline } from "./resources/webgl-render-pipeline.js";
-import { WEBGLCommandEncoder } from "./resources/webgl-command-encoder.js";
-import { WEBGLVertexArray } from "./resources/webgl-vertex-array.js";
-import { WEBGLTransformFeedback } from "./resources/webgl-transform-feedback.js";
-import { readPixelsToArray, readPixelsToBuffer } from "../classic/copy-and-blit.js";
-import { setGLParameters, getGLParameters } from "../context/parameters/unified-parameter-api.js";
-import { withGLParameters } from "../context/state-tracker/with-parameters.js";
-import { clear } from "../classic/clear.js";
+import { popContextState, pushContextState, trackContextState } from '../context/state-tracker/track-context-state';
+import { createBrowserContext } from '../context/context/create-browser-context';
+import { getDeviceInfo } from './device-helpers/webgl-device-info';
+import { getDeviceFeatures } from './device-helpers/webgl-device-features';
+import { getDeviceLimits, getWebGLLimits } from './device-helpers/webgl-device-limits';
+import { WebGLCanvasContext } from './webgl-canvas-context';
+import { loadSpectorJS, initializeSpectorJS } from '../context/debug/spector';
+import { loadWebGLDeveloperTools, makeDebugContext } from '../context/debug/webgl-developer-tools';
+import { isTextureFormatSupported, isTextureFormatRenderable, isTextureFormatFilterable } from './converters/texture-formats';
+import { WEBGLBuffer } from './resources/webgl-buffer';
+import { WEBGLShader } from './resources/webgl-shader';
+import { WEBGLSampler } from './resources/webgl-sampler';
+import { WEBGLTexture } from './resources/webgl-texture';
+import { WEBGLFramebuffer } from './resources/webgl-framebuffer';
+import { WEBGLRenderPass } from './resources/webgl-render-pass';
+import { WEBGLRenderPipeline } from './resources/webgl-render-pipeline';
+import { WEBGLCommandEncoder } from './resources/webgl-command-encoder';
+import { WEBGLVertexArray } from './resources/webgl-vertex-array';
+import { WEBGLTransformFeedback } from './resources/webgl-transform-feedback';
+import { readPixelsToArray, readPixelsToBuffer } from '../classic/copy-and-blit';
+import { setGLParameters, getGLParameters } from '../context/parameters/unified-parameter-api';
+import { withGLParameters } from '../context/state-tracker/with-parameters';
+import { clear } from '../classic/clear';
 const LOG_LEVEL = 1;
+/** WebGPU style Device API for a WebGL context */
 export class WebGLDevice extends Device {
-  static isSupported() {
-    return typeof WebGLRenderingContext !== 'undefined' || isHeadlessGLRegistered();
-  }
-  get features() {
-    this._features = this._features || getDeviceFeatures(this.gl);
-    return this._features;
-  }
-  get limits() {
-    this._limits = this._limits || getDeviceLimits(this.gl);
-    return this._limits;
-  }
-  static attach(gl) {
-    if (gl instanceof WebGLDevice) {
-      return gl;
-    }
-    if ((gl === null || gl === void 0 ? void 0 : gl.device) instanceof Device) {
-      return gl.device;
-    }
-    if (!isWebGL(gl)) {
-      throw new Error('Invalid WebGLRenderingContext');
-    }
-    return new WebGLDevice({
-      gl: gl
-    });
-  }
-  static async create() {
-    let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-    log.groupCollapsed(LOG_LEVEL, 'WebGLDevice created')();
-    if (typeof props.canvas === 'string') {
-      await CanvasContext.pageLoaded;
-    }
-    if (log.get('debug') || props.debug) {
-      await loadWebGLDeveloperTools();
-    }
-    const {
-      spector
-    } = props;
-    if (log.get('spector') || spector) {
-      await loadSpectorJS();
-    }
-    log.probe(LOG_LEVEL + 1, 'DOM is loaded')();
-    if (props.gl && props.gl.device) {
-      return WebGLDevice.attach(props.gl);
-    }
-    const device = new WebGLDevice(props);
-    const message = `\
+    //
+    // Public `Device` API
+    //
+    static type = 'webgl';
+    static isSupported() {
+        return typeof WebGL2RenderingContext !== 'undefined';
+    }
+    info;
+    canvasContext;
+    handle;
+    get features() {
+        this._features = this._features || getDeviceFeatures(this.gl);
+        return this._features;
+    }
+    get limits() {
+        this._limits = this._limits || getDeviceLimits(this.gl);
+        return this._limits;
+    }
+    lost;
+    _resolveContextLost;
+    _features;
+    _limits;
+    //
+    // Static methods, expected to be present by `luma.createDevice()`
+    //
+    /**
+     * Get a device instance from a GL context
+     * Creates and instruments the device if not already created
+     * @param gl
+     * @returns
+     */
+    static attach(gl) {
+        if (gl instanceof WebGLDevice) {
+            return gl;
+        }
+        // @ts-expect-error
+        if (gl?.device instanceof Device) {
+            // @ts-expect-error
+            return gl.device;
+        }
+        if (!isWebGL(gl)) {
+            throw new Error('Invalid WebGL2RenderingContext');
+        }
+        return new WebGLDevice({ gl: gl });
+    }
+    static async create(props = {}) {
+        log.groupCollapsed(LOG_LEVEL, 'WebGLDevice created')();
+        // Wait for page to load. Only wait when props. canvas is string
+        // to avoid setting page onload callback unless necessary
+        if (typeof props.canvas === 'string') {
+            await CanvasContext.pageLoaded;
+        }
+        // Load webgl and spector debug scripts from CDN if requested
+        if (log.get('debug') || props.debug) {
+            await loadWebGLDeveloperTools();
+        }
+        // @ts-expect-error spector not on props
+        const { spector } = props;
+        if (log.get('spector') || spector) {
+            await loadSpectorJS();
+        }
+        log.probe(LOG_LEVEL + 1, 'DOM is loaded')();
+        // @ts-expect-error
+        if (props.gl && props.gl.device) {
+            return WebGLDevice.attach(props.gl);
+        }
+        const device = new WebGLDevice(props);
+        // Log some debug info about the newly created context
+        const message = `\
 Created ${device.info.type}${device.debug ? ' debug' : ''} context: \
 ${device.info.vendor}, ${device.info.renderer} for canvas: ${device.canvasContext.id}`;
-    log.probe(LOG_LEVEL, message)();
-    log.table(LOG_LEVEL, device.info)();
-    log.groupEnd(LOG_LEVEL)();
-    return device;
-  }
-  constructor(props) {
-    var _props$gl, _props$gl2;
-    super({
-      ...props,
-      id: props.id || uid('webgl-device')
-    });
-    this.info = void 0;
-    this.canvasContext = void 0;
-    this.handle = void 0;
-    this.lost = void 0;
-    this._resolveContextLost = void 0;
-    this._features = void 0;
-    this._limits = void 0;
-    this.renderPass = null;
-    this.gl = void 0;
-    this.gl2 = null;
-    this.debug = false;
-    this.isWebGL1 = void 0;
-    this.isWebGL2 = void 0;
-    this._canvasSizeInfo = {
-      clientWidth: 0,
-      clientHeight: 0,
-      devicePixelRatio: 1
-    };
-    this._extensions = {};
-    this._polyfilled = false;
-    this.spector = void 0;
-    this._webglLimits = void 0;
-    this._constants = void 0;
-    const device = (_props$gl = props.gl) === null || _props$gl === void 0 ? void 0 : _props$gl.device;
-    if (device) {
-      throw new Error(`WebGL context already attached to device ${device.id}`);
-    }
-    const canvas = props.canvas || ((_props$gl2 = props.gl) === null || _props$gl2 === void 0 ? void 0 : _props$gl2.canvas);
-    this.canvasContext = new WebGLCanvasContext(this, {
-      ...props,
-      canvas
-    });
-    this.lost = new Promise(resolve => {
-      this._resolveContextLost = resolve;
-    });
-    const onContextLost = event => {
-      var _this$_resolveContext;
-      return (_this$_resolveContext = this._resolveContextLost) === null || _this$_resolveContext === void 0 ? void 0 : _this$_resolveContext.call(this, {
-        reason: 'destroyed',
-        message: 'Computer entered sleep mode, or too many apps or browser tabs are using the GPU.'
-      });
-    };
-    let gl = props.gl || null;
-    gl = gl || (isBrowser() ? createBrowserContext(this.canvasContext.canvas, {
-      ...props,
-      onContextLost
-    }) : null);
-    gl = gl || (!isBrowser() ? createHeadlessContext({
-      ...props,
-      onContextLost
-    }) : null);
-    if (!gl) {
-      throw new Error('WebGL context creation failed');
-    }
-    this.handle = gl;
-    this.gl = this.handle;
-    this.gl2 = this.gl;
-    this.isWebGL2 = isWebGL2(this.gl);
-    this.isWebGL1 = !this.isWebGL2;
-    this.canvasContext.resize();
-    this.info = getDeviceInfo(this.gl);
-    this.gl.device = this;
-    this.gl._version = this.isWebGL2 ? 2 : 1;
-    polyfillContext(this.gl);
-    const {
-      enable = true,
-      copyState = false
-    } = props;
-    trackContextState(this.gl, {
-      enable,
-      copyState,
-      log: function () {
-        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-          args[_key] = arguments[_key];
+        log.probe(LOG_LEVEL, message)();
+        log.table(LOG_LEVEL, device.info)();
+        log.groupEnd(LOG_LEVEL)();
+        return device;
+    }
+    //
+    // Public API
+    //
+    constructor(props) {
+        super({ ...props, id: props.id || uid('webgl-device') });
+        // If attaching to an already attached context, return the attached device
+        // @ts-expect-error device is attached to context
+        const device = props.gl?.device;
+        if (device) {
+            throw new Error(`WebGL context already attached to device ${device.id}`);
+        }
+        // Create and instrument context
+        const canvas = props.canvas || props.gl?.canvas;
+        this.canvasContext = new WebGLCanvasContext(this, { ...props, canvas });
+        this.lost = new Promise(resolve => {
+            this._resolveContextLost = resolve;
+        });
+        const onContextLost = (event) => this._resolveContextLost?.({
+            reason: 'destroyed',
+            message: 'Computer entered sleep mode, or too many apps or browser tabs are using the GPU.'
+        });
+        let gl = props.gl || null;
+        gl =
+            gl ||
+                (isBrowser()
+                    ? createBrowserContext(this.canvasContext.canvas, { ...props, onContextLost })
+                    : null);
+        if (!gl) {
+            throw new Error('WebGL context creation failed');
         }
-        return log.log(1, ...args)();
-      }
-    });
-    if (isBrowser() && props.debug) {
-      this.gl = makeDebugContext(this.gl, {
-        ...props,
-        webgl2: this.isWebGL2,
-        throwOnError: true
-      });
-      this.gl2 = this.gl;
-      this.debug = true;
-      log.level = Math.max(log.level, 1);
-      log.warn('WebGL debug mode activated. Performance reduced.')();
-    }
-    if (isBrowser() && props.spector) {
-      const canvas = this.handle.canvas || props.canvas;
-      this.spector = initializeSpectorJS({
-        ...this.props,
-        canvas
-      });
-    }
-  }
-  destroy() {
-    const ext = this.gl.getExtension('STACKGL_destroy_context');
-    if (ext) {
-      ext.destroy();
-    }
-  }
-  get isLost() {
-    return this.gl.isContextLost();
-  }
-  getSize() {
-    return [this.gl.drawingBufferWidth, this.gl.drawingBufferHeight];
-  }
-  isTextureFormatSupported(format) {
-    return isTextureFormatSupported(this.gl, format);
-  }
-  isTextureFormatFilterable(format) {
-    return isTextureFormatFilterable(this.gl, format);
-  }
-  isTextureFormatRenderable(format) {
-    return isTextureFormatRenderable(this.gl, format);
-  }
-  assertWebGL2() {
-    if (!this.gl2) {
-      throw new Error('Requires WebGL2');
-    }
-    return this.gl2;
-  }
-  createCanvasContext(props) {
-    throw new Error('WebGL only supports a single canvas');
-  }
-  createBuffer(props) {
-    const newProps = this._getBufferProps(props);
-    return new WEBGLBuffer(this, newProps);
-  }
-  _createTexture(props) {
-    return new WEBGLTexture(this, props);
-  }
-  createExternalTexture(props) {
-    throw new Error('createExternalTexture() not implemented');
-  }
-  createSampler(props) {
-    return new WEBGLSampler(this, props);
-  }
-  createShader(props) {
-    return new WEBGLShader(this, props);
-  }
-  createFramebuffer(props) {
-    return new WEBGLFramebuffer(this, props);
-  }
-  createRenderPipeline(props) {
-    return new WEBGLRenderPipeline(this, props);
-  }
-  createVertexArray(props) {
-    return new WEBGLVertexArray(this, props);
-  }
-  beginRenderPass(props) {
-    return new WEBGLRenderPass(this, props);
-  }
-  createComputePipeline(props) {
-    throw new Error('ComputePipeline not supported in WebGL');
-  }
-  beginComputePass(props) {
-    throw new Error('ComputePass not supported in WebGL');
-  }
-  createTransformFeedback(props) {
-    return new WEBGLTransformFeedback(this, props);
-  }
-  getDefaultRenderPass() {
-    this.renderPass = this.renderPass || this.beginRenderPass({
-      framebuffer: this.canvasContext.getCurrentFramebuffer()
-    });
-    return this.renderPass;
-  }
-  createCommandEncoder(props) {
-    return new WEBGLCommandEncoder(this, props);
-  }
-  submit() {
-    var _this$renderPass;
-    (_this$renderPass = this.renderPass) === null || _this$renderPass === void 0 ? void 0 : _this$renderPass.end();
-    this.renderPass = null;
-  }
-  readPixelsToArrayWebGL(source, options) {
-    return readPixelsToArray(source, options);
-  }
-  readPixelsToBufferWebGL(source, options) {
-    return readPixelsToBuffer(source, options);
-  }
-  setParametersWebGL(parameters) {
-    setGLParameters(this, parameters);
-  }
-  getParametersWebGL(parameters) {
-    return getGLParameters(this, parameters);
-  }
-  withParametersWebGL(parameters, func) {
-    withGLParameters(this, parameters, func);
-  }
-  clearWebGL(options) {
-    clear(this, options);
-  }
-  get webglLimits() {
-    this._webglLimits = this._webglLimits || getWebGLLimits(this.gl);
-    return this._webglLimits;
-  }
-  loseDevice() {
-    var _this$_resolveContext2;
-    let deviceLossTriggered = false;
-    const ext = this.gl.getExtension('WEBGL_lose_context');
-    if (ext) {
-      deviceLossTriggered = true;
-      ext.loseContext();
-    }
-    (_this$_resolveContext2 = this._resolveContextLost) === null || _this$_resolveContext2 === void 0 ? void 0 : _this$_resolveContext2.call(this, {
-      reason: 'destroyed',
-      message: 'Application triggered context loss'
-    });
-    return deviceLossTriggered;
-  }
-  pushState() {
-    pushContextState(this.gl);
-  }
-  popState() {
-    popContextState(this.gl);
-  }
-  setSpectorMetadata(handle, props) {
-    handle.__SPECTOR_Metadata = props;
-  }
-  getGLKey(value, gl) {
-    gl = gl || this.gl2 || this.gl;
-    const number = Number(value);
-    for (const key in gl) {
-      if (gl[key] === number) {
-        return `GL.${key}`;
-      }
-    }
-    return String(value);
-  }
-  setConstantAttribute(location, constant) {
-    this._constants = this._constants || new Array(this.limits.maxVertexAttributes).fill(null);
-    const currentConstant = this._constants[location];
-    if (currentConstant && compareConstantArrayValues(currentConstant, constant)) {
-      log.info(1, `setConstantAttribute(${location}) could have been skipped, value unchanged`)();
-    }
-    this._constants[location] = constant;
-    switch (constant.constructor) {
-      case Float32Array:
-        setConstantFloatArray(this, location, constant);
-        break;
-      case Int32Array:
-        setConstantIntArray(this, location, constant);
-        break;
-      case Uint32Array:
-        setConstantUintArray(this, location, constant);
-        break;
-      default:
-        assert(false);
-    }
-  }
+        this.handle = gl;
+        this.gl = this.handle;
+        this.canvasContext.resize();
+        // luma Device fields
+        this.info = getDeviceInfo(this.gl);
+        // @ts-expect-error Link webgl context back to device
+        this.gl.device = this;
+        // @ts-expect-error Annotate webgl context to handle
+        this.gl._version = this.isWebGL2 ? 2 : 1;
+        // Install context state tracking
+        // @ts-expect-error - hidden parameters
+        const { enable = true, copyState = false } = props;
+        trackContextState(this.gl, {
+            enable,
+            copyState,
+            log: (...args) => log.log(1, ...args)()
+        });
+        // DEBUG contexts: Add debug instrumentation to the context, force log level to at least 1
+        if (isBrowser() && props.debug) {
+            this.gl = makeDebugContext(this.gl, { ...props, throwOnError: true });
+            this.debug = true;
+            log.level = Math.max(log.level, 1);
+            log.warn('WebGL debug mode activated. Performance reduced.')();
+        }
+        // @ts-expect-error spector not on props
+        if (isBrowser() && props.spector) {
+            const canvas = this.handle.canvas || props.canvas;
+            this.spector = initializeSpectorJS({ ...this.props, canvas });
+        }
+    }
+    /**
+     * Destroys the context
+     * @note Has no effect for browser contexts, there is no browser API for destroying contexts
+     */
+    destroy() {
+    }
+    get isLost() {
+        return this.gl.isContextLost();
+    }
+    getSize() {
+        return [this.gl.drawingBufferWidth, this.gl.drawingBufferHeight];
+    }
+    isTextureFormatSupported(format) {
+        return isTextureFormatSupported(this.gl, format);
+    }
+    isTextureFormatFilterable(format) {
+        return isTextureFormatFilterable(this.gl, format);
+    }
+    isTextureFormatRenderable(format) {
+        return isTextureFormatRenderable(this.gl, format);
+    }
+    // IMPLEMENTATION OF ABSTRACT DEVICE
+    createCanvasContext(props) {
+        throw new Error('WebGL only supports a single canvas');
+    }
+    createBuffer(props) {
+        const newProps = this._getBufferProps(props);
+        return new WEBGLBuffer(this, newProps);
+    }
+    _createTexture(props) {
+        return new WEBGLTexture(this, props);
+    }
+    createExternalTexture(props) {
+        throw new Error('createExternalTexture() not implemented'); // return new Program(props);
+    }
+    createSampler(props) {
+        return new WEBGLSampler(this, props);
+    }
+    createShader(props) {
+        return new WEBGLShader(this, props);
+    }
+    createFramebuffer(props) {
+        return new WEBGLFramebuffer(this, props);
+    }
+    createRenderPipeline(props) {
+        return new WEBGLRenderPipeline(this, props);
+    }
+    createVertexArray(props) {
+        return new WEBGLVertexArray(this, props);
+    }
+    beginRenderPass(props) {
+        return new WEBGLRenderPass(this, props);
+    }
+    createComputePipeline(props) {
+        throw new Error('ComputePipeline not supported in WebGL');
+    }
+    beginComputePass(props) {
+        throw new Error('ComputePass not supported in WebGL');
+    }
+    createTransformFeedback(props) {
+        return new WEBGLTransformFeedback(this, props);
+    }
+    renderPass = null;
+    getDefaultRenderPass() {
+        this.renderPass =
+            this.renderPass ||
+                this.beginRenderPass({
+                    framebuffer: this.canvasContext.getCurrentFramebuffer()
+                });
+        return this.renderPass;
+    }
+    createCommandEncoder(props) {
+        return new WEBGLCommandEncoder(this, props);
+    }
+    /**
+     * Offscreen Canvas Support: Commit the frame
+     * https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/commit
+     * Chrome's offscreen canvas does not require gl.commit
+     */
+    submit() {
+        this.renderPass?.end();
+        this.renderPass = null;
+        // this.canvasContext.commit();
+    }
+    //
+    // TEMPORARY HACKS - will be removed in v9.1
+    // 
+    /** @deprecated - should use command encoder */
+    readPixelsToArrayWebGL(source, options) {
+        return readPixelsToArray(source, options);
+    }
+    /** @deprecated - should use command encoder */
+    readPixelsToBufferWebGL(source, options) {
+        return readPixelsToBuffer(source, options);
+    }
+    setParametersWebGL(parameters) {
+        setGLParameters(this, parameters);
+    }
+    getParametersWebGL(parameters) {
+        return getGLParameters(this, parameters);
+    }
+    withParametersWebGL(parameters, func) {
+        withGLParameters(this, parameters, func);
+    }
+    clearWebGL(options) {
+        clear(this, options);
+    }
+    //
+    // WebGL-only API (not part of `Device` API)
+    //
+    /** WebGL2 context. */
+    gl;
+    debug = false;
+    /** State used by luma.gl classes: TODO - move to canvasContext*/
+    _canvasSizeInfo = { clientWidth: 0, clientHeight: 0, devicePixelRatio: 1 };
+    /** State used by luma.gl classes - TODO - not used? */
+    _extensions = {};
+    _polyfilled = false;
+    /** Instance of Spector.js (if initialized) */
+    spector;
+    _webglLimits;
+    /** Return WebGL specific limits */
+    get webglLimits() {
+        this._webglLimits = this._webglLimits || getWebGLLimits(this.gl);
+        return this._webglLimits;
+    }
+    /**
+     * Triggers device (or WebGL context) loss.
+     * @note primarily intended for testing how application reacts to device loss
+     */
+    loseDevice() {
+        let deviceLossTriggered = false;
+        const ext = this.gl.getExtension('WEBGL_lose_context');
+        if (ext) {
+            deviceLossTriggered = true;
+            ext.loseContext();
+            // ext.loseContext should trigger context loss callback but the platform may not do this, so do it explicitly
+        }
+        this._resolveContextLost?.({
+            reason: 'destroyed',
+            message: 'Application triggered context loss'
+        });
+        return deviceLossTriggered;
+    }
+    /** Save current WebGL context state onto an internal stack */
+    pushState() {
+        pushContextState(this.gl);
+    }
+    /** Restores previously saved context state */
+    popState() {
+        popContextState(this.gl);
+    }
+    /**
+     * Storing data on a special field on WebGLObjects makes that data visible in SPECTOR chrome debug extension
+     * luma.gl ids and props can be inspected
+     */
+    setSpectorMetadata(handle, props) {
+        // @ts-expect-error
+        // eslint-disable-next-line camelcase
+        handle.__SPECTOR_Metadata = props;
+    }
+    /**
+     * Returns the GL.<KEY> constant that corresponds to a numeric value of a GL constant
+     * Be aware that there are some duplicates especially for constants that are 0,
+     * so this isn't guaranteed to return the right key in all cases.
+     */
+    getGLKey(value, gl) {
+        // @ts-ignore expect-error depends on settings
+        gl = gl || this.gl2 || this.gl;
+        const number = Number(value);
+        for (const key in gl) {
+            // @ts-ignore expect-error depends on settings
+            if (gl[key] === number) {
+                return `GL.${key}`;
+            }
+        }
+        // No constant found. Stringify the value and return it.
+        return String(value);
+    }
+    /** Store constants */
+    _constants;
+    /**
+     * Set a constant value for a location. Disabled attributes at that location will read from this value
+     * @note WebGL constants are stored globally on the WebGL context, not the VertexArray
+     * so they need to be updated before every render
+     * @todo - remember/cache values to avoid setting them unnecessarily?
+     */
+    setConstantAttribute(location, constant) {
+        this._constants = this._constants || new Array(this.limits.maxVertexAttributes).fill(null);
+        const currentConstant = this._constants[location];
+        if (currentConstant && compareConstantArrayValues(currentConstant, constant)) {
+            log.info(1, `setConstantAttribute(${location}) could have been skipped, value unchanged`)();
+        }
+        this._constants[location] = constant;
+        switch (constant.constructor) {
+            case Float32Array:
+                setConstantFloatArray(this, location, constant);
+                break;
+            case Int32Array:
+                setConstantIntArray(this, location, constant);
+                break;
+            case Uint32Array:
+                setConstantUintArray(this, location, constant);
+                break;
+            default:
+                assert(false);
+        }
+    }
 }
-WebGLDevice.type = 'webgl';
+/** Check if supplied parameter is a WebGL2RenderingContext */
 function isWebGL(gl) {
-  if (typeof WebGLRenderingContext !== 'undefined' && gl instanceof WebGLRenderingContext) {
-    return true;
-  }
-  if (typeof WebGL2RenderingContext !== 'undefined' && gl instanceof WebGL2RenderingContext) {
-    return true;
-  }
-  return Boolean(gl && Number.isFinite(gl._version));
-}
-function isWebGL2(gl) {
-  if (typeof WebGL2RenderingContext !== 'undefined' && gl instanceof WebGL2RenderingContext) {
-    return true;
-  }
-  return Boolean(gl && gl._version === 2);
+    if (typeof WebGL2RenderingContext !== 'undefined' && gl instanceof WebGL2RenderingContext) {
+        return true;
+    }
+    // Look for debug contexts, headless gl etc
+    return Boolean(gl && Number.isFinite(gl._version));
 }
+/** Set constant float array attribute */
 function setConstantFloatArray(device, location, array) {
-  switch (array.length) {
-    case 1:
-      device.gl.vertexAttrib1fv(location, array);
-      break;
-    case 2:
-      device.gl.vertexAttrib2fv(location, array);
-      break;
-    case 3:
-      device.gl.vertexAttrib3fv(location, array);
-      break;
-    case 4:
-      device.gl.vertexAttrib4fv(location, array);
-      break;
-    default:
-      assert(false);
-  }
+    switch (array.length) {
+        case 1:
+            device.gl.vertexAttrib1fv(location, array);
+            break;
+        case 2:
+            device.gl.vertexAttrib2fv(location, array);
+            break;
+        case 3:
+            device.gl.vertexAttrib3fv(location, array);
+            break;
+        case 4:
+            device.gl.vertexAttrib4fv(location, array);
+            break;
+        default:
+            assert(false);
+    }
 }
+/** Set constant signed int array attribute */
 function setConstantIntArray(device, location, array) {
-  var _device$gl;
-  device.assertWebGL2();
-  (_device$gl = device.gl2) === null || _device$gl === void 0 ? void 0 : _device$gl.vertexAttribI4iv(location, array);
+    device.gl.vertexAttribI4iv(location, array);
+    // TODO - not clear if we need to use the special forms, more testing needed
+    // switch (array.length) {
+    //   case 1:
+    //     gl.vertexAttribI1iv(location, array);
+    //     break;
+    //   case 2:
+    //     gl.vertexAttribI2iv(location, array);
+    //     break;
+    //   case 3:
+    //     gl.vertexAttribI3iv(location, array);
+    //     break;
+    //   case 4:
+    //     break;
+    //   default:
+    //     assert(false);
+    // }
 }
+/** Set constant unsigned int array attribute */
 function setConstantUintArray(device, location, array) {
-  var _device$gl2;
-  device.assertWebGL2();
-  (_device$gl2 = device.gl2) === null || _device$gl2 === void 0 ? void 0 : _device$gl2.vertexAttribI4uiv(location, array);
+    device.gl.vertexAttribI4uiv(location, array);
+    // TODO - not clear if we need to use the special forms, more testing needed
+    // switch (array.length) {
+    //   case 1:
+    //     gl.vertexAttribI1uiv(location, array);
+    //     break;
+    //   case 2:
+    //     gl.vertexAttribI2uiv(location, array);
+    //     break;
+    //   case 3:
+    //     gl.vertexAttribI3uiv(location, array);
+    //     break;
+    //   case 4:
+    //     gl.vertexAttribI4uiv(location, array);
+    //     break;
+    //   default:
+    //     assert(false);
+    // }
 }
+/**
+ * Compares contents of two typed arrays
+ * @todo max length?
+ */
 function compareConstantArrayValues(v1, v2) {
-  if (!v1 || !v2 || v1.length !== v2.length || v1.constructor !== v2.constructor) {
-    return false;
-  }
-  for (let i = 0; i < v1.length; ++i) {
-    if (v1[i] !== v2[i]) {
-      return false;
-    }
-  }
-  return true;
+    if (!v1 || !v2 || v1.length !== v2.length || v1.constructor !== v2.constructor) {
+        return false;
+    }
+    for (let i = 0; i < v1.length; ++i) {
+        if (v1[i] !== v2[i]) {
+            return false;
+        }
+    }
+    return true;
 }
-//# sourceMappingURL=webgl-device.js.map