@luma.gl/webgl 9.2.5 → 9.3.0-alpha.10

package/src/context/debug/spector.ts

@@ -4,6 +4,7 @@
 
 import {log} from '@luma.gl/core';
 import {loadScript} from '../../utils/load-script';
+import {getWebGLContextData} from '../helpers/webgl-context-data';
 
 import type {Spector} from './spector-types';
 
@@ -91,11 +92,10 @@ export function initializeSpectorJS(props: SpectorProps): Spector | null {
   if (props.gl) {
     // capture startup
     const gl = props.gl;
-    // @ts-expect-error
-    const device = gl.device;
+    const contextData = getWebGLContextData(gl);
+    const device = contextData.device;
     spector?.startCapture(props.gl, 500); // 500 commands
-    // @ts-expect-error
-    gl.device = device;
+    contextData.device = device;
 
     new Promise(resolve => setTimeout(resolve, 2000)).then(_ => {
       log.info('Spector capture stopped after 2 seconds')();

package/src/context/debug/webgl-developer-tools.ts

@@ -4,7 +4,7 @@
 
 import {log} from '@luma.gl/core';
 // Rename constant to prevent inlining. We need the full set of constants for generating debug strings.
-import {GL as GLEnum} from '@luma.gl/constants';
+import {GL as GLEnum} from '@luma.gl/webgl/constants';
 import {isBrowser} from '@probe.gl/env';
 import {loadScript} from '../../utils/load-script';
 
@@ -104,6 +104,8 @@ function getDebugContext(
   // Store the debug context
   data.realContext = gl;
   data.debugContext = debugContext;
+  // Share the context metadata object with the debug context so lookups stay consistent.
+  (debugContext as {luma?: unknown}).luma = data;
   debugContext.debug = true;
 
   // Return it
@@ -132,9 +134,13 @@ function onGLError(
   const functionArgs = globalThis.WebGLDebugUtils.glFunctionArgsToString(functionName, args);
   const message = `${errorMessage} in gl.${functionName}(${functionArgs})`;
   // TODO - call device.reportError
-  log.error(message)();
+  log.error(
+    '%cWebGL',
+    'color: white; background: red; padding: 2px 6px; border-radius: 3px;',
+    message
+  )();
   debugger; // eslint-disable-line
-  // throw new Error(message);
+  throw new Error(message);
 }
 
 // Don't generate function string until it is needed
@@ -144,11 +150,14 @@ function onValidateGLFunc(
   functionArgs: unknown[]
 ): void {
   let functionString: string = '';
-  if (log.level >= 1) {
+  if (props.traceWebGL && log.level >= 1) {
     functionString = getFunctionString(functionName, functionArgs);
-    if (props.traceWebGL) {
-      log.log(1, functionString)();
-    }
+    log.info(
+      1,
+      '%cWebGL',
+      'color: white; background: blue; padding: 2px 6px; border-radius: 3px;',
+      functionString
+    )();
   }
 
   for (const arg of functionArgs) {

package/src/context/helpers/create-browser-context.ts

@@ -2,6 +2,8 @@
 // SPDX-License-Identifier: MIT
 // Copyright (c) vis.gl contributors
 
+import {getWebGLContextData} from './webgl-context-data';
+
 /**
  * ContextProps
  * @param onContextLost
@@ -26,63 +28,72 @@ export function createBrowserContext(
 ): WebGL2RenderingContext {
   // Try to extract any extra information about why context creation failed
   let errorMessage = '';
-  // const onCreateError = error => (errorMessage = error.statusMessage || errorMessage);
+  const onCreateError = (event: Event) => {
+    const statusMessage = (event as WebGLContextEvent).statusMessage;
+    if (statusMessage) {
+      errorMessage ||= statusMessage;
+    }
+  };
+  canvas.addEventListener('webglcontextcreationerror', onCreateError, false);
 
-  // Avoid multiple listeners?
-  // canvas.removeEventListener('webglcontextcreationerror', onCreateError, false);
-  // canvas.addEventListener('webglcontextcreationerror', onCreateError, false);
+  const allowSoftwareRenderer = webglContextAttributes.failIfMajorPerformanceCaveat !== true;
 
   const webglProps: WebGLContextAttributes = {
     preserveDrawingBuffer: true,
-    // failIfMajorPerformanceCaveat: true,
-    ...webglContextAttributes
+    ...webglContextAttributes,
+    // Always start by requesting a high-performance context.
+    failIfMajorPerformanceCaveat: true
   };
 
   // Create the desired context
   let gl: WebGL2RenderingContext | null = null;
 
-  // Create a webgl2 context
-  gl ||= canvas.getContext('webgl2', webglProps);
-  if (webglProps.failIfMajorPerformanceCaveat) {
-    errorMessage ||=
-      'Only software GPU is available. Set `failIfMajorPerformanceCaveat: false` to allow.';
-  }
+  try {
+    // Create a webgl2 context
+    gl ||= canvas.getContext('webgl2', webglProps);
+    if (!gl && webglProps.failIfMajorPerformanceCaveat) {
+      errorMessage ||=
+        'Only software GPU is available. Set `failIfMajorPerformanceCaveat: false` to allow.';
+    }
 
-  // Creation failed with failIfMajorPerformanceCaveat - Try a Software GPU
-  if (!gl && !webglContextAttributes.failIfMajorPerformanceCaveat) {
-    webglProps.failIfMajorPerformanceCaveat = false;
-    gl = canvas.getContext('webgl2', webglProps);
-    // @ts-expect-error
-    gl.luma ||= {};
-    // @ts-expect-error
-    gl.luma.softwareRenderer = true;
-  }
+    // Creation failed with failIfMajorPerformanceCaveat - Try a Software GPU
+    let softwareRenderer = false;
+    if (!gl && allowSoftwareRenderer) {
+      webglProps.failIfMajorPerformanceCaveat = false;
+      gl = canvas.getContext('webgl2', webglProps);
+      softwareRenderer = true;
+    }
 
-  if (!gl) {
-    gl = canvas.getContext('webgl', {}) as WebGL2RenderingContext;
-    if (gl) {
-      gl = null;
-      errorMessage ||= 'Your browser only supports WebGL1';
+    if (!gl) {
+      gl = canvas.getContext('webgl', {}) as WebGL2RenderingContext;
+      if (gl) {
+        gl = null;
+        errorMessage ||= 'Your browser only supports WebGL1';
+      }
     }
-  }
 
-  if (!gl) {
-    errorMessage ||= 'Your browser does not support WebGL';
-    throw new Error(`Failed to create WebGL context: ${errorMessage}`);
-  }
+    if (!gl) {
+      errorMessage ||= 'Your browser does not support WebGL';
+      throw new Error(`Failed to create WebGL context: ${errorMessage}`);
+    }
 
-  // Carefully extract and wrap callbacks to prevent addEventListener from rebinding them.
-  const {onContextLost, onContextRestored} = props;
-  canvas.addEventListener('webglcontextlost', (event: Event) => onContextLost(event), false);
-  canvas.addEventListener(
-    'webglcontextrestored',
-    (event: Event) => onContextRestored(event),
-    false
-  );
-
-  // @ts-expect-error
-  gl.luma ||= {};
-  return gl;
+    // Initialize luma.gl specific context data
+    const luma = getWebGLContextData(gl);
+    luma.softwareRenderer = softwareRenderer;
+
+    // Carefully extract and wrap callbacks to prevent addEventListener from rebinding them.
+    const {onContextLost, onContextRestored} = props;
+    canvas.addEventListener('webglcontextlost', (event: Event) => onContextLost(event), false);
+    canvas.addEventListener(
+      'webglcontextrestored',
+      (event: Event) => onContextRestored(event),
+      false
+    );
+
+    return gl;
+  } finally {
+    canvas.removeEventListener('webglcontextcreationerror', onCreateError, false);
+  }
 }
 
 /* TODO - can we call this asynchronously to catch the error events?

package/src/context/helpers/webgl-context-data.ts

@@ -2,12 +2,17 @@
 // SPDX-License-Identifier: MIT
 // Copyright (c) vis.gl contributors
 
+import type {GLExtensions} from '@luma.gl/webgl/constants';
+
 /**
  * Stores luma.gl specific state associated with a context
  */
 export interface WebGLContextData {
+  /** This type is used by lower level code that is not aware of the Device type */
+  device?: unknown;
   _polyfilled: boolean;
-  _extensions: Record<string, any>;
+  extensions: GLExtensions;
+  softwareRenderer?: boolean;
 }
 
 /**
@@ -16,16 +21,17 @@ export interface WebGLContextData {
  */
 export function getWebGLContextData(gl: WebGL2RenderingContext): WebGLContextData {
   // @ts-expect-error
-  const luma = gl.luma as WebGLContextData | null;
-  if (!luma) {
-    const contextState: WebGLContextData = {
-      _polyfilled: false,
-      _extensions: {}
-    };
-    // @ts-expect-error
-    gl.luma = contextState;
-  }
+  const contextData = (gl.luma as WebGLContextData | null) || {
+    _polyfilled: false,
+    extensions: {},
+    softwareRenderer: false
+  };
+
+  contextData._polyfilled ??= false;
+  contextData.extensions ||= {};
 
   // @ts-expect-error
-  return gl.luma;
+  gl.luma = contextData;
+
+  return contextData;
 }

package/src/context/helpers/webgl-extensions.ts

@@ -2,7 +2,7 @@
 // SPDX-License-Identifier: MIT
 // Copyright (c) vis.gl contributors
 
-import {GLExtensions} from '@luma.gl/constants';
+import {GLExtensions} from '@luma.gl/webgl/constants';
 
 /** Ensure extensions are only requested once */
 export function getWebGLExtension(

package/src/context/parameters/unified-parameter-api.ts

@@ -5,7 +5,7 @@
 // Provides a unified API for getting and setting any WebGL parameter
 // Also knows default values of all parameters, enabling fast cache initialization
 // Provides base functionality for the state caching.
-import type {GLParameters} from '@luma.gl/constants';
+import type {GLParameters} from '@luma.gl/webgl/constants';
 import {
   GL_PARAMETER_DEFAULTS,
   GL_PARAMETER_SETTERS,
@@ -18,7 +18,7 @@ export type {GLParameters};
 /**
  * Sets any GL parameter regardless of function (gl.blendMode, ...)
  *
- * @note requires a `cache` object to be set on the context (gl.state.cache)
+ * @note requires a `cache` object to be set on the context (lumaState.cache)
  * This object is used to fill in any missing values for composite setter functions
  */
 export function setGLParameters(gl: WebGL2RenderingContext, parameters: GLParameters): void {
@@ -58,7 +58,7 @@ export function setGLParameters(gl: WebGL2RenderingContext, parameters: GLParame
   // But it is too inconvenient to always require a cache parameter here.
   // This is the ONLY external dependency in this module/
   // @ts-expect-error
-  const cache = gl.state && gl.state.cache;
+  const cache = gl.lumaState?.cache;
   if (cache) {
     for (const key in compositeSetters) {
       // TODO - avoid calling composite setters if values have not changed.

package/src/context/parameters/webgl-parameter-tables.ts

@@ -5,7 +5,7 @@
 // @ts-nocheck TODO fix
 
 // Tables describing WebGL parameters
-import {GL, GLParameters} from '@luma.gl/constants';
+import {GL, GLParameters} from '@luma.gl/webgl/constants';
 
 // DEFAULT SETTINGS - FOR FAST CACHE INITIALIZATION AND CONTEXT RESETS
 

package/src/context/polyfills/polyfill-webgl1-extensions.ts

@@ -7,7 +7,7 @@
 
 /* eslint-disable camelcase */
 
-import {GL} from '@luma.gl/constants';
+import {GL} from '@luma.gl/webgl/constants';
 
 // webgl1 extensions natively supported by webgl2
 const WEBGL1_STATIC_EXTENSIONS = {

package/src/context/state-tracker/webgl-state-tracker.ts

@@ -21,7 +21,7 @@ import {
 export class WebGLStateTracker {
   static get(gl: WebGL2RenderingContext): WebGLStateTracker {
     // @ts-expect-error
-    return gl.state as WebGLStateTracker;
+    return gl.lumaState as WebGLStateTracker;
   }
 
   gl: WebGL2RenderingContext;
@@ -78,7 +78,7 @@ export class WebGLStateTracker {
     this.initialized = true;
 
     // @ts-expect-error
-    this.gl.state = this;
+    this.gl.lumaState = this;
 
     installProgramSpy(gl);
 

package/src/index.ts

@@ -10,6 +10,32 @@
 
 // Types
 export type {WebGLDeviceLimits} from './adapter/device-helpers/webgl-device-limits';
+export {GL} from './constants/webgl-constants';
+export type {
+  GLTextureTarget,
+  GLTextureCubeMapTarget,
+  GLTexelDataFormat,
+  GLPrimitiveTopology,
+  GLPrimitive,
+  GLDataType,
+  GLPixelType,
+  GLUniformType,
+  GLSamplerType,
+  GLFunction,
+  GLBlendEquation,
+  GLBlendFunction,
+  GLStencilOp,
+  GLSamplerParameters,
+  GLValueParameters,
+  GLPackParameters,
+  GLUnpackParameters,
+  GLFunctionParameters,
+  GLParameters,
+  GLLimits,
+  GLExtensions,
+  GLPolygonMode,
+  GLProvokingVertex
+} from './constants/webgl-types';
 
 // WebGL adapter classes
 export {webgl2Adapter} from './adapter/webgl-adapter';
@@ -26,6 +52,7 @@ export {WEBGLTexture} from './adapter/resources/webgl-texture';
 export {WEBGLShader} from './adapter/resources/webgl-shader';
 export {WEBGLSampler} from './adapter/resources/webgl-sampler';
 export {WEBGLFramebuffer} from './adapter/resources/webgl-framebuffer';
+export {WEBGLFence} from './adapter/resources/webgl-fence';
 
 export {WEBGLRenderPipeline} from './adapter/resources/webgl-render-pipeline';
 // export {WEBGLComputePipeline} from './adapter/resources/webgl-compute-pipeline';

package/src/utils/fill-array.ts

@@ -16,7 +16,7 @@ export function fillArray(options: {
   const total = count * length;
   let copied = 0;
   for (let i = start; copied < length; copied++) {
-    target[i++] = source[copied];
+    target[i++] = source[copied] ?? 0;
   }
 
   while (copied < total) {

package/src/webgl-constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"webgl-constants.d.ts","sourceRoot":"","sources":["webgl-constants.ts"],"names":[],"mappings":"AAIA,OAAO,EAAC,EAAE,EAAC,uCAAoC"}

package/src/webgl-constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webgl-constants.js","sourceRoot":"","sources":["webgl-constants.ts"],"names":[],"mappings":"AAAA,UAAU;AACV,+BAA+B;AAC/B,oCAAoC;AAEpC,OAAO,EAAC,EAAE,EAAC,uCAAoC"}

package/src/webgl-constants.ts

@@ -0,0 +1,5 @@
+// luma.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
+export {GL} from './constants/webgl-constants';

package/src/webgl-types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"webgl-types.d.ts","sourceRoot":"","sources":["webgl-types.ts"],"names":[],"mappings":"AAIA,YAAY,EACV,eAAe,EACf,sBAAsB,EACtB,iBAAiB,EACjB,mBAAmB,EACnB,WAAW,EACX,UAAU,EACV,WAAW,EACX,aAAa,EACb,aAAa,EACb,UAAU,EACV,eAAe,EACf,eAAe,EACf,WAAW,EACX,mBAAmB,EACnB,iBAAiB,EACjB,gBAAgB,EAChB,kBAAkB,EAClB,oBAAoB,EACpB,YAAY,EACZ,QAAQ,EACR,YAAY,EACZ,aAAa,EACb,iBAAiB,EAClB,mCAAgC"}

package/src/webgl-types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webgl-types.js","sourceRoot":"","sources":["webgl-types.ts"],"names":[],"mappings":"AAAA,UAAU;AACV,+BAA+B;AAC/B,oCAAoC"}

package/src/webgl-types.ts

@@ -0,0 +1,29 @@
+// luma.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
+export type {
+  GLTextureTarget,
+  GLTextureCubeMapTarget,
+  GLTexelDataFormat,
+  GLPrimitiveTopology,
+  GLPrimitive,
+  GLDataType,
+  GLPixelType,
+  GLUniformType,
+  GLSamplerType,
+  GLFunction,
+  GLBlendEquation,
+  GLBlendFunction,
+  GLStencilOp,
+  GLSamplerParameters,
+  GLValueParameters,
+  GLPackParameters,
+  GLUnpackParameters,
+  GLFunctionParameters,
+  GLParameters,
+  GLLimits,
+  GLExtensions,
+  GLPolygonMode,
+  GLProvokingVertex
+} from './constants/webgl-types';

package/dist/types.d.ts

@@ -1,11 +0,0 @@
-export type AccessorObject = {
-    size?: number;
-    index?: number;
-    type?: number;
-    divisor?: number;
-    offset?: number;
-    stride?: number;
-    normalized?: boolean;
-    integer?: boolean;
-};
-//# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAIA,MAAM,MAAM,cAAc,GAAG;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC"}

package/dist/types.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,UAAU;AACV,+BAA+B;AAC/B,oCAAoC"}

package/src/types.ts

@@ -1,14 +0,0 @@
-// luma.gl
-// SPDX-License-Identifier: MIT
-// Copyright (c) vis.gl contributors
-
-export type AccessorObject = {
-  size?: number;
-  index?: number;
-  type?: number;
-  divisor?: number;
-  offset?: number;
-  stride?: number;
-  normalized?: boolean;
-  integer?: boolean;
-};