@luma.gl/webgl 9.0.17 → 9.1.0-alpha.10

package/dist/index.d.ts

@@ -1,7 +1,8 @@
 export type { WebGLDeviceLimits } from "./adapter/device-helpers/webgl-device-limits.js";
+export { webgl2Adapter } from "./adapter/webgl-adapter.js";
+export type { WebGLAdapter } from "./adapter/webgl-adapter.js";
 export { WebGLDevice } from "./adapter/webgl-device.js";
 export { WebGLCanvasContext } from "./adapter/webgl-canvas-context.js";
-export { WebGLResource, WebGLResource as WEBGLResource } from "./adapter/objects/webgl-resource.js";
 export { WEBGLBuffer } from "./adapter/resources/webgl-buffer.js";
 export { WEBGLTexture } from "./adapter/resources/webgl-texture.js";
 export { WEBGLShader } from "./adapter/resources/webgl-shader.js";
@@ -16,11 +17,8 @@ export { Accessor } from "./classic/accessor.js";
 export type { AccessorObject } from "./types.js";
 export { setDeviceParameters, withDeviceParameters } from "./adapter/converters/device-parameters.js";
 export { getShaderLayout } from "./adapter/helpers/get-shader-layout.js";
-export { convertGLToTextureFormat } from "./adapter/converters/texture-formats.js";
-export type { RenderbufferProps as _RenderbufferProps } from "./adapter/objects/webgl-renderbuffer.js";
-export { WEBGLRenderbuffer as _WEBGLRenderbuffer } from "./adapter/objects/webgl-renderbuffer.js";
+export { WebGLStateTracker } from "./context/state-tracker/webgl-state-tracker.js";
 export { TEXTURE_FORMATS as _TEXTURE_FORMATS } from "./adapter/converters/texture-formats.js";
-export { trackContextState, pushContextState, popContextState } from "./context/state-tracker/track-context-state.js";
 export { resetGLParameters, setGLParameters, getGLParameters } from "./context/parameters/unified-parameter-api.js";
 export { withGLParameters } from "./context/state-tracker/with-parameters.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAWA,YAAY,EAAC,iBAAiB,EAAC,wDAAqD;AAGpF,OAAO,EAAC,WAAW,EAAC,kCAA+B;AACnD,OAAO,EAAC,kBAAkB,EAAC,0CAAuC;AAGlE,OAAO,EAAC,aAAa,EAAE,aAAa,IAAI,aAAa,EAAC,4CAAyC;AAC/F,OAAO,EAAC,WAAW,EAAC,4CAAyC;AAC7D,OAAO,EAAC,YAAY,EAAC,6CAA0C;AAE/D,OAAO,EAAC,WAAW,EAAC,4CAAyC;AAC7D,OAAO,EAAC,YAAY,EAAC,6CAA0C;AAC/D,OAAO,EAAC,gBAAgB,EAAC,iDAA8C;AAEvE,OAAO,EAAC,mBAAmB,EAAC,qDAAkD;AAE9E,OAAO,EAAC,mBAAmB,EAAC,qDAAkD;AAC9E,OAAO,EAAC,eAAe,EAAC,iDAA8C;AAEtE,OAAO,EAAC,gBAAgB,EAAC,kDAA+C;AAGxE,OAAO,EAAC,sBAAsB,EAAC,wDAAqD;AAGpF,OAAO,EAAC,QAAQ,EAAC,8BAA2B;AAC5C,YAAY,EAAC,cAAc,EAAC,mBAAgB;AAI5C,OAAO,EAAC,mBAAmB,EAAE,oBAAoB,EAAC,kDAA+C;AAGjG,OAAO,EAAC,eAAe,EAAC,+CAA4C;AACpE,OAAO,EAAC,wBAAwB,EAAC,gDAA6C;AAG9E,YAAY,EAAC,iBAAiB,IAAI,kBAAkB,EAAC,gDAA6C;AAClG,OAAO,EAAC,iBAAiB,IAAI,kBAAkB,EAAC,gDAA6C;AAG7F,OAAO,EAAC,eAAe,IAAI,gBAAgB,EAAC,gDAA6C;AAIzF,OAAO,EACL,iBAAiB,EACjB,gBAAgB,EAChB,eAAe,EAChB,uDAAoD;AAErD,OAAO,EACL,iBAAiB,EACjB,eAAe,EACf,eAAe,EAChB,sDAAmD;AAEpD,OAAO,EAAC,gBAAgB,EAAC,mDAAgD"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAWA,YAAY,EAAC,iBAAiB,EAAC,wDAAqD;AAGpF,OAAO,EAAC,aAAa,EAAC,mCAAgC;AACtD,YAAY,EAAC,YAAY,EAAC,mCAAgC;AAG1D,OAAO,EAAC,WAAW,EAAC,kCAA+B;AACnD,OAAO,EAAC,kBAAkB,EAAC,0CAAuC;AAGlE,OAAO,EAAC,WAAW,EAAC,4CAAyC;AAC7D,OAAO,EAAC,YAAY,EAAC,6CAA0C;AAE/D,OAAO,EAAC,WAAW,EAAC,4CAAyC;AAC7D,OAAO,EAAC,YAAY,EAAC,6CAA0C;AAC/D,OAAO,EAAC,gBAAgB,EAAC,iDAA8C;AAEvE,OAAO,EAAC,mBAAmB,EAAC,qDAAkD;AAE9E,OAAO,EAAC,mBAAmB,EAAC,qDAAkD;AAC9E,OAAO,EAAC,eAAe,EAAC,iDAA8C;AAEtE,OAAO,EAAC,gBAAgB,EAAC,kDAA+C;AAGxE,OAAO,EAAC,sBAAsB,EAAC,wDAAqD;AAGpF,OAAO,EAAC,QAAQ,EAAC,8BAA2B;AAC5C,YAAY,EAAC,cAAc,EAAC,mBAAgB;AAI5C,OAAO,EAAC,mBAAmB,EAAE,oBAAoB,EAAC,kDAA+C;AAGjG,OAAO,EAAC,eAAe,EAAC,+CAA4C;AACpE,OAAO,EAAC,iBAAiB,EAAC,uDAAoD;AAG9E,OAAO,EAAC,eAAe,IAAI,gBAAgB,EAAC,gDAA6C;AAGzF,OAAO,EACL,iBAAiB,EACjB,eAAe,EACf,eAAe,EAChB,sDAAmD;AAEpD,OAAO,EAAC,gBAAgB,EAAC,mDAAgD"}

package/dist/index.js

@@ -2,10 +2,11 @@
 // SPDX-License-Identifier: MIT
 // Copyright (c) vis.gl contributors
 // WebGL adapter classes
+export { webgl2Adapter } from "./adapter/webgl-adapter.js";
+// WebGL Device classes
 export { WebGLDevice } from "./adapter/webgl-device.js";
 export { WebGLCanvasContext } from "./adapter/webgl-canvas-context.js";
 // WebGL Resource classes
-export { WebGLResource, WebGLResource as WEBGLResource } from "./adapter/objects/webgl-resource.js";
 export { WEBGLBuffer } from "./adapter/resources/webgl-buffer.js";
 export { WEBGLTexture } from "./adapter/resources/webgl-texture.js";
 // export {WEBGLExternalTexture} from './adapter/resources/webgl-external-texture';
@@ -26,12 +27,9 @@ export { Accessor } from "./classic/accessor.js";
 export { setDeviceParameters, withDeviceParameters } from "./adapter/converters/device-parameters.js";
 // HELPERS - EXPERIMENTAL
 export { getShaderLayout } from "./adapter/helpers/get-shader-layout.js";
-export { convertGLToTextureFormat } from "./adapter/converters/texture-formats.js";
-export { WEBGLRenderbuffer as _WEBGLRenderbuffer } from "./adapter/objects/webgl-renderbuffer.js";
+export { WebGLStateTracker } from "./context/state-tracker/webgl-state-tracker.js";
 // TEST EXPORTS
 export { TEXTURE_FORMATS as _TEXTURE_FORMATS } from "./adapter/converters/texture-formats.js";
 // DEPRECATED TEST EXPORTS
-// State tracking
-export { trackContextState, pushContextState, popContextState } from "./context/state-tracker/track-context-state.js";
 export { resetGLParameters, setGLParameters, getGLParameters } from "./context/parameters/unified-parameter-api.js";
 export { withGLParameters } from "./context/state-tracker/with-parameters.js";

package/dist/utils/fill-array.d.ts

@@ -0,0 +1,8 @@
+import type { NumberArray } from '@math.gl/types';
+export declare function fillArray(options: {
+    target: NumberArray;
+    source: NumberArray;
+    start?: number;
+    count?: number;
+}): NumberArray;
+//# sourceMappingURL=fill-array.d.ts.map

package/dist/utils/fill-array.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fill-array.d.ts","sourceRoot":"","sources":["../../src/utils/fill-array.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAGhD,wBAAgB,SAAS,CAAC,OAAO,EAAE;IACjC,MAAM,EAAE,WAAW,CAAC;IACpB,MAAM,EAAE,WAAW,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,WAAW,CAsBd"}

package/dist/utils/fill-array.js

@@ -0,0 +1,26 @@
+// luma.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+// Uses copyWithin to significantly speed up typed array value filling
+export function fillArray(options) {
+    const { target, source, start = 0, count = 1 } = options;
+    const length = source.length;
+    const total = count * length;
+    let copied = 0;
+    for (let i = start; copied < length; copied++) {
+        target[i++] = source[copied];
+    }
+    while (copied < total) {
+        // If we have copied less than half, copy everything we got
+        // else copy remaining in one operation
+        if (copied < total - copied) {
+            target.copyWithin(start + copied, start, start + copied);
+            copied *= 2;
+        }
+        else {
+            target.copyWithin(start + copied, start, start + total - copied);
+            copied = total;
+        }
+    }
+    return options.target;
+}

package/dist/utils/load-script.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Load a script (identified by an url). When the url returns, the
+ * content of this file is added into a new script element, attached to the DOM (body element)
+ * @param scriptUrl defines the url of the script to laod
+ * @param scriptId defines the id of the script element
+ */
+export declare function loadScript(scriptUrl: string, scriptId?: string): Promise<Event>;
+//# sourceMappingURL=load-script.d.ts.map

package/dist/utils/load-script.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"load-script.d.ts","sourceRoot":"","sources":["../../src/utils/load-script.ts"],"names":[],"mappings":"AAIA;;;;;GAKG;AACH,wBAAsB,UAAU,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC,KAAK,CAAC,CAmBrF"}

package/dist/utils/load-script.js

@@ -0,0 +1,26 @@
+// luma.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+/**
+ * Load a script (identified by an url). When the url returns, the
+ * content of this file is added into a new script element, attached to the DOM (body element)
+ * @param scriptUrl defines the url of the script to laod
+ * @param scriptId defines the id of the script element
+ */
+export async function loadScript(scriptUrl, scriptId) {
+    const head = document.getElementsByTagName('head')[0];
+    if (!head) {
+        throw new Error('loadScript');
+    }
+    const script = document.createElement('script');
+    script.setAttribute('type', 'text/javascript');
+    script.setAttribute('src', scriptUrl);
+    if (scriptId) {
+        script.id = scriptId;
+    }
+    return new Promise((resolve, reject) => {
+        script.onload = resolve;
+        script.onerror = error => reject(new Error(`Unable to load script '${scriptUrl}': ${error}`));
+        head.appendChild(script);
+    });
+}

package/dist/utils/split-uniforms-and-bindings.d.ts

@@ -0,0 +1,9 @@
+import type { UniformValue, Binding } from '@luma.gl/core';
+export declare function isUniformValue(value: unknown): value is UniformValue;
+type UniformsAndBindings = {
+    bindings: Record<string, Binding>;
+    uniforms: Record<string, UniformValue>;
+};
+export declare function splitUniformsAndBindings(uniforms: Record<string, Binding | UniformValue>): UniformsAndBindings;
+export {};
+//# sourceMappingURL=split-uniforms-and-bindings.d.ts.map

package/dist/utils/split-uniforms-and-bindings.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"split-uniforms-and-bindings.d.ts","sourceRoot":"","sources":["../../src/utils/split-uniforms-and-bindings.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAC,YAAY,EAAE,OAAO,EAAC,MAAM,eAAe,CAAC;AAGzD,wBAAgB,cAAc,CAAC,KAAK,EAAE,OAAO,GAAG,KAAK,IAAI,YAAY,CAEpE;AAED,KAAK,mBAAmB,GAAG;IACzB,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAClC,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;CACxC,CAAC;AAEF,wBAAgB,wBAAwB,CACtC,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,GAAG,YAAY,CAAC,GAC/C,mBAAmB,CAYrB"}

package/dist/utils/split-uniforms-and-bindings.js

@@ -0,0 +1,20 @@
+// luma.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+import { isNumericArray } from '@math.gl/types';
+export function isUniformValue(value) {
+    return isNumericArray(value) !== null || typeof value === 'number' || typeof value === 'boolean';
+}
+export function splitUniformsAndBindings(uniforms) {
+    const result = { bindings: {}, uniforms: {} };
+    Object.keys(uniforms).forEach(name => {
+        const uniform = uniforms[name];
+        if (isUniformValue(uniform)) {
+            result.uniforms[name] = uniform;
+        }
+        else {
+            result.bindings[name] = uniform;
+        }
+    });
+    return result;
+}

package/dist/utils/uid.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Returns a UID.
+ * @param id= - Identifier base name
+ * @return uid
+ **/
+export declare function uid(id?: string): string;
+//# sourceMappingURL=uid.d.ts.map

package/dist/utils/uid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"uid.d.ts","sourceRoot":"","sources":["../../src/utils/uid.ts"],"names":[],"mappings":"AAMA;;;;IAII;AACJ,wBAAgB,GAAG,CAAC,EAAE,GAAE,MAAa,GAAG,MAAM,CAI7C"}

package/dist/utils/uid.js

@@ -0,0 +1,14 @@
+// luma.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+const uidCounters = {};
+/**
+ * Returns a UID.
+ * @param id= - Identifier base name
+ * @return uid
+ **/
+export function uid(id = 'id') {
+    uidCounters[id] = uidCounters[id] || 1;
+    const count = uidCounters[id]++;
+    return `${id}-${count}`;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@luma.gl/webgl",
-  "version": "9.0.17",
+  "version": "9.1.0-alpha.10",
   "description": "WebGL2 adapter for the luma.gl core API",
   "type": "module",
   "license": "MIT",
@@ -40,11 +40,12 @@
     "prepublishOnly": "npm run build-minified-bundle && npm run build-dev-bundle"
   },
   "peerDependencies": {
-    "@luma.gl/core": "^9.0.0"
+    "@luma.gl/core": "^9.0.0-beta"
   },
   "dependencies": {
-    "@luma.gl/constants": "9.0.17",
-    "@probe.gl/env": "^4.0.2"
+    "@luma.gl/constants": "9.1.0-alpha.10",
+    "@math.gl/types": "^4.0.0",
+    "@probe.gl/env": "^4.0.8"
   },
-  "gitHead": "f348f3221ab2842ffa877b6c99e0e9e4df82426e"
+  "gitHead": "f419cdc284e87b553df60af49d2888ac7dbbf288"
 }

package/src/adapter/converters/device-parameters.ts

@@ -3,7 +3,7 @@
 // Copyright (c) vis.gl contributors
 
 import type {CompareFunction, StencilOperation, BlendOperation, BlendFactor} from '@luma.gl/core';
-import {Device, log, isObjectEmpty, Parameters, PolygonMode, ProvokingVertex} from '@luma.gl/core';
+import {Device, log, Parameters, PolygonMode, ProvokingVertex} from '@luma.gl/core';
 import {GL} from '@luma.gl/constants';
 import type {
   GLBlendEquation,
@@ -14,7 +14,6 @@ import type {
   GLProvokingVertex,
   GLStencilOp
 } from '@luma.gl/constants';
-import {pushContextState, popContextState} from '../../context/state-tracker/track-context-state';
 import {setGLParameters} from '../../context/parameters/unified-parameter-api';
 import {WebGLDevice} from '../webgl-device';
 
@@ -41,13 +40,13 @@ export function withDeviceAndGLParameters<T = unknown>(
 
   // Wrap in a try-catch to ensure that parameters are restored on exceptions
   const webglDevice = device as WebGLDevice;
-  pushContextState(webglDevice.gl);
+  webglDevice.pushState();
   try {
     setDeviceParameters(device, parameters);
     setGLParameters(webglDevice.gl, glParameters);
     return func(device);
   } finally {
-    popContextState(webglDevice.gl);
+    webglDevice.popState();
   }
 }
 
@@ -72,12 +71,12 @@ export function withGLParameters<T = unknown>(
 
   // Wrap in a try-catch to ensure that parameters are restored on exceptions
   const webglDevice = device as WebGLDevice;
-  pushContextState(webglDevice.gl);
+  webglDevice.pushState();
   try {
     setGLParameters(webglDevice.gl, parameters);
     return func(device);
   } finally {
-    popContextState(webglDevice.gl);
+    webglDevice.popState();
   }
 }
 
@@ -99,15 +98,14 @@ export function withDeviceParameters<T = unknown>(
     return func(device);
   }
 
-  // Wrap in a try-catch to ensure that parameters are restored on exceptions
-  // @ts-expect-error
-  pushContextState(device.gl);
+  // Wrap in a try-catch to ensure that parameters are restored on exceptions'
+  const webglDevice = device as WebGLDevice;
+  webglDevice.pushState();
   try {
     setDeviceParameters(device, parameters);
     return func(device);
   } finally {
-    // @ts-expect-error
-    popContextState(device.gl);
+    webglDevice.popState();
   }
 }
 
@@ -280,10 +278,18 @@ export function setDeviceParameters(device: Device, parameters: Parameters) {
   // },
 
   // COLOR STATE
+  switch (parameters.blend) {
+    case true:
+      gl.enable(GL.BLEND);
+      break;
+    case false:
+      gl.disable(GL.BLEND);
+      break;
+    default:
+    // leave WebGL blend state unchanged if `parameters.blend` is not set
+  }
 
   if (parameters.blendColorOperation || parameters.blendAlphaOperation) {
-    gl.enable(GL.BLEND);
-
     const colorEquation = convertBlendOperationToEquation(
       'blendColorOperation',
       parameters.blendColorOperation || 'add'
@@ -423,3 +429,15 @@ function map<K extends string | number, V>(parameter: string, value: K, valueMap
 function mapBoolean(parameter: string, value: boolean): boolean {
   return value;
 }
+
+/** Returns true if given object is empty, false otherwise. */
+function isObjectEmpty(obj: object): boolean {
+  let isEmpty = true;
+  // @ts-ignore key is unused
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  for (const key in obj) {
+    isEmpty = false;
+    break;
+  }
+  return isEmpty;
+}

package/src/adapter/converters/texture-formats.ts

@@ -4,7 +4,7 @@
 
 import type {TextureFormat, DeviceFeature} from '@luma.gl/core';
 import {decodeTextureFormat} from '@luma.gl/core';
-import {GL, GLExtensions} from '@luma.gl/constants';
+import {GL, GLPixelType, GLExtensions, GLTexelDataFormat} from '@luma.gl/constants';
 import {getWebGLExtension} from '../../context/helpers/webgl-extensions';
 import {getGLFromVertexType} from './vertex-formats';
 
@@ -123,9 +123,8 @@ type Format = {
   /** If not supported on WebGPU */
   wgpu?: false;
 
-  types?: number[];
-
-  dataFormat?: GL;
+  types?: GLPixelType[];
+  dataFormat?: GLTexelDataFormat;
   /** Depth and stencil format attachment points. If set, needs to be a Renderbuffer unless depthTexture is set  */
   attachment?: GL.DEPTH_ATTACHMENT | GL.STENCIL_ATTACHMENT | GL.DEPTH_STENCIL_ATTACHMENT;
   /** if depthTexture is set this is a depth/stencil format that can be set to a texture  */
@@ -142,15 +141,6 @@ type Format = {
  */
 // prettier-ignore
 export const TEXTURE_FORMATS: Record<TextureFormat, Format> = {
-  // Unsized formats that leave the precision up to the driver. TODO - Fix bpp constants
-  'rgb8unorm-unsized': {gl: GL.RGB, b: 4, c: 2, bpp: 4,
-    dataFormat: GL.RGB, types: [GL.UNSIGNED_BYTE, GL.UNSIGNED_SHORT_5_6_5]},
-  'rgba8unorm-unsized': {gl: GL.RGBA, b: 4, c: 2, bpp: 4,
-    dataFormat: GL.RGBA, types: [GL.UNSIGNED_BYTE, GL.UNSIGNED_SHORT_4_4_4_4, GL.UNSIGNED_SHORT_5_5_5_1]},
-  // 'r8unorm-unsized': {gl: GL.LUMINANCE, b: 4, c: 2, bpp: 4},
-  // 'rgb8unorm-srgb-unsized': {gl: GL.SRGB_EXT, b: 4, c: 2, bpp: 4, gl1Ext: SRGB},
-  // 'rgba8unorm-srgb-unsized': {gl: GL.SRGB_ALPHA_EXT, b: 4, c: 2, bpp: 4, gl1Ext: SRGB},
-
   // 8-bit formats
   'r8unorm': {gl: GL.R8, b: 1, c: 1, rb: true},
   'r8snorm': {gl: GL.R8_SNORM, b: 1, c: 1, render: snorm8_renderable},
@@ -190,7 +180,6 @@ export const TEXTURE_FORMATS: Record<TextureFormat, Format> = {
 
   'rg16uint': {gl: GL.RG16UI, b: 4, c: 1, bpp: 4},
   'rg16sint': {gl: GL.RG16I, b: 4, c: 2, bpp: 4},
-  // When using a WebGL 2 context and the EXT_color_buffer_float WebGL2 extension
   'rg16float': {gl: GL.RG16F, bpp: 4, b: 4, c: 2, render: float16_renderable, filter: float16_filterable, rb: true},
   'rg16unorm-webgl': {gl: GL.RG16_EXT, b:2, c:2, render: norm16_renderable},
   'rg16snorm-webgl': {gl: GL.RG16_SNORM_EXT, b:2, c:2, render: snorm16_renderable},
@@ -241,9 +230,6 @@ export const TEXTURE_FORMATS: Record<TextureFormat, Format> = {
   // The depth component of the "depth24plus" and "depth24plus-stencil8" formats may be implemented as either a 24-bit depth value or a "depth32float" value.
   'depth24plus-stencil8': {gl: GL.DEPTH24_STENCIL8, b: 4, c: 2, p: 1, attachment: GL.DEPTH_STENCIL_ATTACHMENT, rb: true, depthTexture: true,
     dataFormat: GL.DEPTH_STENCIL, types: [GL.UNSIGNED_INT_24_8]},
-  // "depth24unorm-stencil8" feature
-  'depth24unorm-stencil8': {gl: GL.DEPTH24_STENCIL8, b: 4, c: 2, p: 1, attachment: GL.DEPTH_STENCIL_ATTACHMENT, 
-    dataFormat: GL.DEPTH_STENCIL, types: [GL.UNSIGNED_INT_24_8], rb: true},
   // "depth32float-stencil8" feature - TODO below is render buffer only?
   'depth32float-stencil8': {gl: GL.DEPTH32F_STENCIL8, b: 5, c: 2, p: 1, attachment: GL.DEPTH_STENCIL_ATTACHMENT, 
     dataFormat: GL.DEPTH_STENCIL, types: [GL.FLOAT_32_UNSIGNED_INT_24_8_REV], rb: true},
@@ -471,6 +457,10 @@ export function isTextureFormatSupported(
   if (info.gl === undefined) {
     return false;
   }
+  const feature = info.f;
+  if (feature) {
+    return checkTextureFeature(gl, feature, extensions);
+  }
   // Check extensions
   const extension = info.x || info.gl2ext;
   if (extension) {
@@ -485,33 +475,7 @@ export function isRenderbufferFormatSupported(
   extensions: GLExtensions
 ): boolean {
   // Note: Order is important since the function call initializes extensions.
-  return isTextureFormatSupported(gl, format, extensions) && TEXTURE_FORMATS[format]?.rb;
-}
-
-/**
- * Map WebGL texture formats (GL constants) to WebGPU-style TextureFormat strings
- */
-export function convertGLToTextureFormat(format: GL | TextureFormat): TextureFormat {
-  if (typeof format === 'string') {
-    return format;
-  }
-  const entry = Object.entries(TEXTURE_FORMATS).find(([, entry]) => entry.gl === format);
-  if (!entry) {
-    throw new Error(`Unknown texture format ${format}`);
-  }
-  return entry[0] as TextureFormat;
-}
-
-/**
- * Map WebGPU style texture format strings to GL constants
- */
-export function convertTextureFormatToGL(format: TextureFormat): GL | undefined {
-  const formatInfo = TEXTURE_FORMATS[format];
-  const webglFormat = formatInfo?.gl;
-  if (webglFormat === undefined) {
-    throw new Error(`Unsupported texture format ${format}`);
-  }
-  return webglFormat;
+  return isTextureFormatSupported(gl, format, extensions) && Boolean(TEXTURE_FORMATS[format]?.rb);
 }
 
 /** Checks if a texture format is supported */
@@ -601,21 +565,25 @@ export function isTextureFormatRenderable(
 }
 
 /** Get parameters necessary to work with format in WebGL: internalFormat, dataFormat, type, compressed, */
-export function getWebGLTextureParameters(format: TextureFormat) {
+export function getTextureFormatWebGL(format: TextureFormat): {
+  internalFormat: GL;
+  format: GLTexelDataFormat;
+  type: GLPixelType;
+  compressed: boolean;
+} {
   const formatData = TEXTURE_FORMATS[format];
   const webglFormat = convertTextureFormatToGL(format);
   const decoded = decodeTextureFormat(format);
   return {
-    format: webglFormat,
-    dataFormat:
+    internalFormat: webglFormat,
+    format:
       formatData?.dataFormat ||
-      getWebGLPixelDataFormat(decoded.format, decoded.integer, decoded.normalized, webglFormat),
+      getWebGLPixelDataFormat(decoded.channels, decoded.integer, decoded.normalized, webglFormat),
     // depth formats don't have a type
     type: decoded.dataType
       ? getGLFromVertexType(decoded.dataType)
       : formatData?.types?.[0] || GL.UNSIGNED_BYTE,
-    // @ts-expect-error
-    compressed: decoded.compressed
+    compressed: decoded.compressed || false
   };
 }
 
@@ -632,31 +600,58 @@ export function getDepthStencilAttachmentWebGL(
 /** TODO - VERY roundabout legacy way of calculating bytes per pixel */
 export function getTextureFormatBytesPerPixel(format: TextureFormat): number {
   // TODO remove webgl1 support
-  const params = getWebGLTextureParameters(format);
+  const params = getTextureFormatWebGL(format);
   // NOTE(Tarek): Default to RGBA bytes
-  const channels = DATA_FORMAT_CHANNELS[params.dataFormat] || 4;
+  const channels = DATA_FORMAT_CHANNELS[params.format] || 4;
   const channelSize = TYPE_SIZES[params.type] || 1;
   return channels * channelSize;
 }
 
 // DATA TYPE HELPERS
 
-function getWebGLPixelDataFormat(
-  dataFormat: string,
+export function getWebGLPixelDataFormat(
+  channels: 'r' | 'rg' | 'rgb' | 'rgba' | 'bgra',
   integer: boolean,
   normalized: boolean,
   format: GL
-): GL {
+): GLTexelDataFormat {
   // WebGL1 formats use same internalFormat
   if (format === GL.RGBA || format === GL.RGB) {
     return format;
   }
   // prettier-ignore
-  switch (dataFormat) {
+  switch (channels) {
     case 'r': return integer && !normalized ? GL.RED_INTEGER : GL.RED;
     case 'rg': return integer && !normalized ? GL.RG_INTEGER : GL.RG;
     case 'rgb': return integer && !normalized ? GL.RGB_INTEGER : GL.RGB;
     case 'rgba': return integer && !normalized ? GL.RGBA_INTEGER : GL.RGBA;
+    case 'bgra': throw new Error('bgra pixels not supported by WebGL');
     default: return GL.RGBA;
   }
 }
+
+/**
+ * Map WebGPU style texture format strings to GL constants
+ */
+function convertTextureFormatToGL(format: TextureFormat): GL | undefined {
+  const formatInfo = TEXTURE_FORMATS[format];
+  const webglFormat = formatInfo?.gl;
+  if (webglFormat === undefined) {
+    throw new Error(`Unsupported texture format ${format}`);
+  }
+  return webglFormat;
+}
+
+/**
+ * Map WebGL texture formats (GL constants) to WebGPU-style TextureFormat strings
+export function convertGLToTextureFormat(format: GL | TextureFormat): TextureFormat {
+  if (typeof format === 'string') {
+    return format;
+  }
+  const entry = Object.entries(TEXTURE_FORMATS).find(([, entry]) => entry.gl === format);
+  if (!entry) {
+    throw new Error(`Unknown texture format ${format}`);
+  }
+  return entry[0] as TextureFormat;
+}
+ */

package/src/adapter/device-helpers/webgl-device-features.ts

@@ -21,7 +21,6 @@ const WEBGL_FEATURES: Partial<Record<DeviceFeature, boolean | string>> = {
   // 'timestamp-query' // GPUQueryType "timestamp-query"
   // "indirect-first-instance"
   // Textures are handled by getTextureFeatures()
-  // 'depth24unorm-stencil8' // GPUTextureFormat 'depth24unorm-stencil8'
   // 'depth32float-stencil8' // GPUTextureFormat 'depth32float-stencil8'
 
   // optional WebGL features
@@ -71,7 +70,7 @@ export class WebGLDeviceFeatures extends DeviceFeatures {
   }
 
   override has(feature: DeviceFeature): boolean {
-    if (this.disabledFeatures[feature]) {
+    if (this.disabledFeatures?.[feature]) {
       return false;
     }
 

package/src/adapter/device-helpers/webgl-device-limits.ts

@@ -48,6 +48,6 @@ export class WebGLDeviceLimits extends DeviceLimits {
     if (this.limits[parameter] === undefined) {
       this.limits[parameter] = this.gl.getParameter(parameter);
     }
-    return this.limits[parameter];
+    return this.limits[parameter] || 0;
   }
 }