@luma.gl/webgl 9.0.0-alpha.5 → 9.0.0-alpha.7

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

@@ -1,7 +1,7 @@
 // SAMPLER FILTERS
 import {SamplerParameters} from '@luma.gl/api';
 import GL from '@luma.gl/constants';
-import {WebGLSamplerParameters} from '../../types/webgl';
+import {GLSamplerParameters} from '../../types/webgl';
 import {convertCompareFunction, convertToCompareFunction} from './device-parameters';
 
 /**
@@ -9,7 +9,7 @@ import {convertCompareFunction, convertToCompareFunction} from './device-paramet
  * @param props
  * @returns
  */
-export function convertSamplerParametersToWebGL(props: SamplerParameters): WebGLSamplerParameters {
+export function convertSamplerParametersToWebGL(props: SamplerParameters): GLSamplerParameters {
   const params: Record<number, number> = {};
   if (props.addressModeU) {
     params[GL.TEXTURE_WRAP_S] = convertAddressMode(props.addressModeU);
@@ -33,10 +33,12 @@ export function convertSamplerParametersToWebGL(props: SamplerParameters): WebGL
   if (props.lodMaxClamp !== undefined) {
     params[GL.TEXTURE_MAX_LOD] = props.lodMaxClamp;
   }
-  if (props.compare) {
+  if (props.type === 'comparison-sampler') {
     // Setting prop.compare turns this into a comparison sampler
     params[GL.TEXTURE_COMPARE_MODE] = GL.COMPARE_REF_TO_TEXTURE;
-    params[GL.TEXTURE_COMPARE_FUNC] = convertCompareFunction('compare', props.compare);
+  }
+  if (props.compare) {
+      params[GL.TEXTURE_COMPARE_FUNC] = convertCompareFunction('compare', props.compare);
   }
   // Note depends on WebGL extension
   if (props.maxAnisotropy) {
@@ -82,7 +84,7 @@ function convertMinFilterMode(minFilter: 'nearest' | 'linear', mipmapFilter?: 'n
  * @param props
  * @returns
  */
- export function convertToSamplerParameters(params: WebGLSamplerParameters): SamplerParameters {
+ export function convertToSamplerParameters(params: GLSamplerParameters): SamplerParameters {
   const props: SamplerParameters = {};
   if (params[GL.TEXTURE_WRAP_S]) {
     props.addressModeU = convertToAddressMode(params[GL.TEXTURE_WRAP_S]);
@@ -108,7 +110,10 @@ function convertMinFilterMode(minFilter: 'nearest' | 'linear', mipmapFilter?: 'n
   if (params[GL.TEXTURE_MAX_LOD]) {
     props.lodMaxClamp = params[GL.TEXTURE_MAX_LOD];
   }
-  if (params[GL.TEXTURE_COMPARE_MODE] === GL.COMPARE_REF_TO_TEXTURE) {
+  if (params[GL.TEXTURE_COMPARE_MODE]) {
+    props.type = params[GL.TEXTURE_COMPARE_MODE]  === GL.COMPARE_REF_TO_TEXTURE ? 'comparison-sampler' : 'color-sampler';
+  }
+  if (params[GL.TEXTURE_COMPARE_FUNC]) {
     props.compare = convertToCompareFunction('compare', params[GL.TEXTURE_COMPARE_FUNC]);
   }
   // NOTE depends on extension (very common)
@@ -124,6 +129,7 @@ function convertToAddressMode(addressMode: number): 'clamp-to-edge' | 'repeat' |
     case GL.CLAMP_TO_EDGE: return 'clamp-to-edge';
     case GL.REPEAT: return 'repeat';
     case GL.MIRRORED_REPEAT: return 'mirror-repeat';
+    default: throw new Error('address');
   }
 }
 
@@ -131,6 +137,7 @@ function convertToMaxFilterMode(filterMode: number): 'nearest' | 'linear' {
   switch (filterMode) {
     case GL.NEAREST: return 'nearest';
     case GL.LINEAR: return 'linear';
+    default: throw new Error('maxfilter');
   }
 }
 
@@ -144,6 +151,7 @@ function convertToMinFilterMode(filterMode: number): 'nearest' | 'linear' {
     case GL.LINEAR_MIPMAP_NEAREST: return 'linear';
     case GL.NEAREST_MIPMAP_LINEAR: return 'nearest';
     case GL.LINEAR_MIPMAP_LINEAR: return 'linear';
+    default: throw new Error('minfilter');
   }
 }
 
@@ -156,13 +164,14 @@ function convertToMipmapFilterMode(filterMode: number): 'nearest' | 'linear' {
     case GL.LINEAR_MIPMAP_NEAREST: return 'nearest';
     case GL.NEAREST_MIPMAP_LINEAR: return 'linear';
     case GL.LINEAR_MIPMAP_LINEAR: return 'linear';
+    default: throw new Error('mipmap');
   }
 }
 
 /**
  * Override sampler settings that are not supported by Non-Power-of-Two textures in WebGL1.
 */
-export function updateSamplerParametersForNPOT(parameters: WebGLSamplerParameters): WebGLSamplerParameters {
+export function updateSamplerParametersForNPOT(parameters: GLSamplerParameters): GLSamplerParameters {
   const newParameters = {...parameters};
   if (parameters[GL.TEXTURE_MIN_FILTER] !== GL.NEAREST) {
     // log.warn(`texture: ${this} is Non-Power-Of-Two, forcing TEXTURE_MIN_FILTER to LINEAR`)();

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

@@ -64,7 +64,7 @@ const TEXTURE_FEATURE_CHECKS: Partial<Record<DeviceFeature, (gl: WebGLRenderingC
 };
 
 export function checkTextureFeature(gl: WebGLRenderingContext, feature: DeviceFeature): boolean {
-  return TEXTURE_FEATURE_CHECKS[feature]?.(gl);
+  return TEXTURE_FEATURE_CHECKS[feature]?.(gl) || false;
 }
 
 const checkTextureFeatures = (gl: WebGLRenderingContext, features: DeviceFeature[]): boolean =>
@@ -520,8 +520,8 @@ export function _checkFloat32ColorAttachment(
   srcFormat = GL.RGBA,
   srcType = GL.UNSIGNED_BYTE
 ) {
-  let texture: WebGLTexture;
-  let framebuffer: WebGLFramebuffer;
+  let texture: WebGLTexture | null = null;
+  let framebuffer: WebGLFramebuffer | null = null;
   try {
     texture = gl.createTexture();
     gl.bindTexture(GL.TEXTURE_2D, texture);

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

@@ -47,7 +47,12 @@ export function getWebGLFeatures(gl: WebGLRenderingContext): Set<DeviceFeature>
 }
 
 function isFeatureSupported(gl: WebGLRenderingContext, feature: DeviceFeature): boolean {
-  const [webgl1Feature, webgl2Feature] = WEBGL_FEATURES[feature];;
+  const featureInfo = WEBGL_FEATURES[feature];
+  if (!featureInfo) {
+    return false;
+  }
+
+  const [webgl1Feature, webgl2Feature] = featureInfo || [];
 
   // Get extension name from table
   const featureDefinition = isWebGL2(gl) ? webgl2Feature : webgl1Feature;
@@ -100,6 +105,9 @@ export function canCompileGLSLExtension(gl: WebGLRenderingContext, extensionName
   const source = `#extension GL_${extensionName} : ${behavior}\nvoid main(void) {}`;
 
   const shader = gl.createShader(gl.VERTEX_SHADER);
+  if (!shader) {
+    throw new Error('shader');
+  }
   gl.shaderSource(shader, source);
   gl.compileShader(shader);
   const canCompile = gl.getShaderParameter(shader, gl.COMPILE_STATUS);

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

@@ -5,7 +5,7 @@ import {getWebGL2Context} from '../../context/context/webgl-checks';
 
 /** Populate a WebGPU style device limits */
 export function getDeviceLimits(gl: WebGLRenderingContext): DeviceLimits {
-  const gl2: WebGL2RenderingContext = getWebGL2Context(gl);
+  const gl2: WebGL2RenderingContext | null = getWebGL2Context(gl);
   return {
     maxTextureDimension1D: 0, // WebGL does not support 1D textures
     maxTextureDimension2D: gl.getParameter(GL.MAX_TEXTURE_SIZE),

package/src/adapter/helpers/get-shader-layout.ts

@@ -1,3 +1,5 @@
+// luma.gl, MIT license
+
 import {
   ShaderLayout,
   BindingLayout,
@@ -123,12 +125,16 @@ function readAttributeBindings(
   const count = gl.getProgramParameter(program, gl.ACTIVE_ATTRIBUTES);
 
   for (let index = 0; index < count; index++) {
-    const {name, type: compositeType, size} = gl.getActiveAttrib(program, index);
+    const activeInfo = gl.getActiveAttrib(program, index);
+    if (!activeInfo) {
+      throw new Error('activeInfo');
+    }
+    const {name, type: compositeType, size} = activeInfo;
     const location = gl.getAttribLocation(program, name);
     // Add only user provided attributes, for built-in attributes like
     // `gl_InstanceID` locaiton will be < 0
     if (location >= 0) {
-      const {glType, components} = decodeAttributeType(compositeType);
+      const {glType, components} = decodeAttributeType(compositeType);;
       const accessor: AccessorObject = {type: glType, size: size * components};
       // Any attribute name containing the word "instance" will be assumed to be instanced
       if (/instance/i.test(name)) {
@@ -158,8 +164,12 @@ function readVaryings(gl: WebGLRenderingContext, program: WebGLProgram): Varying
 
   const count = gl.getProgramParameter(program, GL.TRANSFORM_FEEDBACK_VARYINGS);
   for (let location = 0; location < count; location++) {
-    const {name, type: compositeType, size} = gl2.getTransformFeedbackVarying(program, location);
-    const {glType, components} = decodeUniformType(compositeType);
+    const activeInfo = gl2.getTransformFeedbackVarying(program, location);
+    if (!activeInfo) {
+      throw new Error('activeInfo');
+    }
+    const {name, type: compositeType, size} = activeInfo;
+    const {glType, components} = decodeUniformType(compositeType);;
     const accessor = new Accessor({type: glType, size: size * components});
     const varying = {location, name, accessor}; // Base values
     varyings.push(varying);
@@ -179,7 +189,11 @@ function readUniformBindings(gl: WebGLRenderingContext, program: WebGLProgram):
 
   const uniformCount = gl.getProgramParameter(program, GL.ACTIVE_UNIFORMS);
   for (let i = 0; i < uniformCount; i++) {
-    const {name: rawName, size, type} = gl.getActiveUniform(program, i);
+    const activeInfo = gl.getActiveUniform(program, i);
+    if (!activeInfo) {
+      throw new Error('activeInfo');
+    }
+    const {name: rawName, size, type} = activeInfo;
     const {name, isArray} = parseUniformName(rawName);
     let webglLocation = gl.getUniformLocation(program, name);
     const uniformInfo = {
@@ -234,8 +248,8 @@ function readUniformBlocks(
 
   const blockCount = gl2.getProgramParameter(program, GL.ACTIVE_UNIFORM_BLOCKS);
   for (let blockIndex = 0; blockIndex < blockCount; blockIndex++) {
-    const blockInfo = {
-      name: gl2.getActiveUniformBlockName(program, blockIndex),
+    const blockInfo: UniformBlockBinding = {
+      name: gl2.getActiveUniformBlockName(program, blockIndex) || '',
       location: getBlockParameter(blockIndex, GL.UNIFORM_BLOCK_BINDING),
       byteLength: getBlockParameter(blockIndex, GL.UNIFORM_BLOCK_DATA_SIZE),
       vertex: getBlockParameter(blockIndex, GL.UNIFORM_BLOCK_REFERENCED_BY_VERTEX_SHADER),
@@ -244,7 +258,7 @@ function readUniformBlocks(
       uniforms: [] as any[]
     };
 
-    const uniformIndices = getBlockParameter(blockIndex, GL.UNIFORM_BLOCK_ACTIVE_UNIFORM_INDICES);
+    const uniformIndices = getBlockParameter(blockIndex, GL.UNIFORM_BLOCK_ACTIVE_UNIFORM_INDICES) as number[] || [];
 
     const uniformType = gl2.getActiveUniforms(program, uniformIndices, GL.UNIFORM_TYPE); // Array of GLenum indicating the types of the uniforms.
     const uniformArrayLength = gl2.getActiveUniforms(program, uniformIndices, GL.UNIFORM_SIZE); // Array of GLuint indicating the sizes of the uniforms.
@@ -262,15 +276,20 @@ function readUniformBlocks(
     ); // Array of GLint indicating the strides between columns of a column-major matrix or a row-major matrix.
     const uniformRowMajor = gl2.getActiveUniforms(program, uniformIndices, GL.UNIFORM_IS_ROW_MAJOR);
     for (let i = 0; i < blockInfo.uniformCount; ++i) {
+      const activeInfo = gl2.getActiveUniform(program, uniformIndices[i]);
+      if (!activeInfo) {
+        throw new Error('activeInfo');
+      }
+  
       blockInfo.uniforms.push({
-        name: gl2.getActiveUniform(program, uniformIndices[i]).name,
+        name: activeInfo.name,
         format: decodeUniformType(uniformType[i]).format,
         type: uniformType[i],
         arrayLength: uniformArrayLength[i],
         byteOffset: uniformOffset[i],
         byteStride: uniformStride[i],
-        matrixStride: uniformStride[i],
-        rowMajor: uniformRowMajor[i]
+        // matrixStride: uniformStride[i],
+        // rowMajor: uniformRowMajor[i]
       });
     }
 
@@ -305,18 +324,18 @@ const SAMPLER_UNIFORMS_GL_TO_GPU: Record<
   [GL.UNSIGNED_INT_SAMPLER_2D_ARRAY]: ['2d-array', 'uint']
 };
 
-function getSamplerInfo(type: GL):
-  | {
-      viewDimension: '1d' | '2d' | '2d-array' | 'cube' | 'cube-array' | '3d';
-      sampleType: 'float' | 'unfilterable-float' | 'depth' | 'sint' | 'uint';
-    }
-  | undefined {
+type SamplerInfo =   | {
+  viewDimension: '1d' | '2d' | '2d-array' | 'cube' | 'cube-array' | '3d';
+  sampleType: 'float' | 'unfilterable-float' | 'depth' | 'sint' | 'uint';
+};
+
+function getSamplerInfo(type: GL): SamplerInfo {
   let sampler = SAMPLER_UNIFORMS_GL_TO_GPU[type];
-  if (sampler) {
-    const [viewDimension, sampleType] = sampler;
-    return {viewDimension, sampleType};
+  if (!sampler) {
+    throw new Error('sampler');
   }
-  return null;
+  const [viewDimension, sampleType] = sampler;
+  return {viewDimension, sampleType};
 }
 
 // HELPERS

package/src/adapter/helpers/uniforms.ts

@@ -1,6 +1,6 @@
 import {UniformFormat, VertexFormat} from '@luma.gl/api';
 import GL from '@luma.gl/constants';
-import {GLUniformType, GLSamplerType, GLCompositeType, GLType} from '../../types/webgl'
+import {GLUniformType, GLSamplerType, GLCompositeType, GLType} from '../../types/webgl';
 
 /** Check is uniform is of sampler type */
 export function isSamplerUniform(type: GLUniformType): boolean {
@@ -25,8 +25,11 @@ const SAMPLER_TYPES: GLSamplerType[] = [
   GL.UNSIGNED_INT_SAMPLER_2D_ARRAY
 ];
 
-// Composite types table 
-const COMPOSITE_GL_TYPES: Record<GLCompositeType, [GLType, number, string, UniformFormat, VertexFormat?]> = {
+// Composite types table
+const COMPOSITE_GL_TYPES: Record<
+  GLCompositeType,
+  [GLType, number, string, UniformFormat, VertexFormat?]
+> = {
   [GL.FLOAT]: [GL.FLOAT, 1, 'float', 'f32', 'float32'],
   [GL.FLOAT_VEC2]: [GL.FLOAT, 2, 'vec2', 'vec2<f32>', 'float32x2'],
   [GL.FLOAT_VEC3]: [GL.FLOAT, 3, 'vec3', 'vec3<f32>', 'float32x3'],
@@ -61,26 +64,34 @@ const COMPOSITE_GL_TYPES: Record<GLCompositeType, [GLType, number, string, Unifo
 };
 
 /** Decomposes a composite type GL.VEC3 into a basic type (GL.FLOAT) and components (3) */
-export function decodeUniformType(uniformType: GL): {format: UniformFormat, components: number, glType: GLType} {
+export function decodeUniformType(
+  uniformType: GL
+): {format: UniformFormat; components: number; glType: GLType} {
   const typeAndSize = COMPOSITE_GL_TYPES[uniformType];
   if (!typeAndSize) {
-    return null;
+    throw new Error('uniform');
   }
   const [glType, components, , format] = typeAndSize;
   return {format, components, glType};
 }
 
-export function decodeAttributeType(uniformType: GL): {format: VertexFormat, components: number, glType: GLType} {
-  const typeAndSize = COMPOSITE_GL_TYPES[uniformType];
+export function decodeAttributeType(attributeType: GL): {
+  format: VertexFormat;
+  components: number;
+  glType: GLType;
+} {
+  const typeAndSize = COMPOSITE_GL_TYPES[attributeType];
   if (!typeAndSize) {
-    return null;
+    throw new Error('attribute')
   }
   const [glType, components, , , format] = typeAndSize;
   return {format, components, glType};
 }
 
 /** Decomposes a composite type GL.VEC3 into a basic type (GL.FLOAT) and components (3) */
-export function decomposeCompositeGLType(compositeGLType: GLCompositeType): {type: GLType, components: number} | null {
+export function decomposeCompositeGLType(
+  compositeGLType: GLCompositeType
+): {type: GLType; components: number} | null {
   const typeAndSize = COMPOSITE_GL_TYPES[compositeGLType];
   if (!typeAndSize) {
     return null;
@@ -89,7 +100,7 @@ export function decomposeCompositeGLType(compositeGLType: GLCompositeType): {typ
   return {type, components};
 }
 
-export function getCompositeGLType(type: GL, components): {glType: GLType, name: string} | null {
+export function getCompositeGLType(type: GL, components): {glType: GLType; name: string} | null {
   switch (type) {
     case GL.BYTE:
     case GL.UNSIGNED_BYTE:

package/src/adapter/objects/webgl-vertex-array-object.ts

@@ -43,7 +43,7 @@ export default class WEBGLVertexArrayObject extends WebGLResource<VertexArrayObj
 
   // Set (bind) an elements buffer, for indexed rendering.
   // Must be a Buffer bound to GL.ELEMENT_ARRAY_BUFFER. Constants not supported
-  setElementBuffer(elementBuffer: Buffer = null, opts = {}) {
+  setElementBuffer(elementBuffer: Buffer | null = null, opts = {}) {
     assert(!elementBuffer || elementBuffer.target === GL.ELEMENT_ARRAY_BUFFER, ERR_ELEMENTS);
 
     // The GL.ELEMENT_ARRAY_BUFFER_BINDING is stored on the VertexArrayObject...

package/src/adapter/resources/webgl-buffer.ts

@@ -15,7 +15,7 @@ export default class WEBGLBuffer extends Buffer {
 
   byteLength: number;
   bytesUsed: number;
-  debugData: ArrayBuffer;
+  debugData: ArrayBuffer | null = null;
 
   webglUsage: number;
 
@@ -106,8 +106,8 @@ export default class WEBGLBuffer extends Buffer {
       this.removeStats();
       this.trackDeallocatedMemory();
       this.gl.deleteBuffer(this.handle);
-      // @ts-expect-error
-      this.handle = null;
+      // this.handle = null;
+      this.destroyed = true;
     }
   }
 

package/src/adapter/resources/webgl-framebuffer.ts

@@ -1,3 +1,5 @@
+// luma.gl, MIT license
+
 import type {FramebufferProps, DepthStencilTextureFormat, ColorTextureFormat} from '@luma.gl/api';
 import {Framebuffer, Texture, log, assert} from '@luma.gl/api';
 import GL from '@luma.gl/constants';
@@ -17,7 +19,7 @@ export default class WEBGLFramebuffer extends Framebuffer {
 
   get texture() { return this.colorAttachments[0]; }
   readonly colorAttachments: WebGLTexture[] = [];
-  readonly depthStencilAttachment: WebGLTexture | undefined = undefined;
+  readonly depthStencilAttachment: WebGLTexture | null = null;  d 
   protected _ownResources: (WebGLTexture | Renderbuffer)[] = [];
 
   constructor(device: WebGLDevice, props: FramebufferProps) {
@@ -66,7 +68,8 @@ export default class WEBGLFramebuffer extends Framebuffer {
         resource.destroy();
       }
       this.gl.deleteFramebuffer(this.handle);
-      this.handle = null;
+      // this.handle = null;
+      this.destroyed = true;
     }
   }
 
@@ -224,7 +227,7 @@ export default class WEBGLFramebuffer extends Framebuffer {
       case GL.TEXTURE_2D_ARRAY:
       case GL.TEXTURE_3D:
         this.device.assertWebGL2();
-        gl2.framebufferTextureLayer(GL.FRAMEBUFFER, attachment, texture.target, level, layer);
+        gl2?.framebufferTextureLayer(GL.FRAMEBUFFER, attachment, texture.target, level, layer);
         break;
 
       case GL.TEXTURE_CUBE_MAP:

package/src/adapter/resources/webgl-render-pass.ts

@@ -6,6 +6,7 @@ export default class WEBGLRenderPass extends RenderPass {
 
   constructor(device: WebGLDevice, props: RenderPassProps) {
     super(device, props);
+    this.device = device;
   }
 
   endPass(): void {}

package/src/adapter/resources/webgl-render-pipeline.ts

@@ -1,6 +1,5 @@
 import type {
   RenderPipelineProps,
-  RenderPipelineParameters,
   RenderPass,
   Buffer,
   Binding,
@@ -11,9 +10,11 @@ import type {
 } from '@luma.gl/api';
 import {RenderPipeline, cast, log, decodeVertexFormat} from '@luma.gl/api';
 import GL from '@luma.gl/constants';
+
+import type {GLParameters} from '../../types/webgl';
 import {getWebGLDataType} from '../converters/texture-formats';
 import {getShaderLayout} from '../helpers/get-shader-layout';
-import {withDeviceParameters} from '../converters/device-parameters';
+import {withDeviceParameters, withGLParameters} from '../converters/device-parameters';
 import {setUniform} from '../helpers/set-uniform';
 // import {copyUniform, checkUniformValues} from '../../classes/uniforms';
 
@@ -35,7 +36,7 @@ export default class WEBGLRenderPipeline extends RenderPipeline {
 
   // configuration: ProgramConfiguration;
   // Experimental flag to avoid deleting Program object while it is cached
-  varyings: string[];
+  varyings: string[] | null = null;
   vertexArrayObject: WEBGLVertexArrayObject;
   _indexBuffer?: Buffer;
   uniforms: Record<string, any> = {};
@@ -43,7 +44,7 @@ export default class WEBGLRenderPipeline extends RenderPipeline {
   _textureUniforms: Record<string, any> = {};
   _textureIndexCounter: number = 0;
   _uniformCount: number = 0;
-  _uniformSetters: Record<string, Function>;
+  _uniformSetters: Record<string, Function> = {}; // TODO are these used?
 
   constructor(device: WebGLDevice, props: RenderPipelineProps) {
     super(device, props);
@@ -64,7 +65,7 @@ export default class WEBGLRenderPipeline extends RenderPipeline {
     if (varyings && varyings.length > 0) {
       this.device.assertWebGL2();
       this.varyings = varyings;
-      this.device.gl2.transformFeedbackVaryings(this.handle, varyings, bufferMode);
+      this.device.gl2?.transformFeedbackVaryings(this.handle, varyings, bufferMode);
     }
 
     this._compileAndLink();
@@ -76,7 +77,8 @@ export default class WEBGLRenderPipeline extends RenderPipeline {
   destroy(): void {
     if (this.handle) {
       this.device.gl.deleteProgram(this.handle);
-      this.handle = null;
+      // this.handle = null;
+      this.destroyed = true;
     }
   }
 
@@ -121,6 +123,7 @@ export default class WEBGLRenderPipeline extends RenderPipeline {
       const binding = this.layout.bindings.find((binding) => binding.name === name);
       if (!binding) {
         log.warn(`Unknown binding ${name} in render pipeline ${this.id}`)();
+        continue;
       }
       if (!value) {
         log.warn(`Unsetting binding ${name} in render pipeline ${this.id}`)();
@@ -181,7 +184,7 @@ export default class WEBGLRenderPipeline extends RenderPipeline {
     const drawMode = getDrawMode(this.props.topology);
     const isIndexed: boolean = Boolean(this._indexBuffer);
     const indexType = this._indexBuffer?.props.indexType === 'uint16' ? GL.UNSIGNED_SHORT : GL.UNSIGNED_INT;
-    const isInstanced: boolean = options.instanceCount > 0;
+    const isInstanced: boolean = Number(options.instanceCount) > 0;
 
     // Avoid WebGL draw call when not rendering any data or values are incomplete
     // Note: async textures set as uniforms might still be loading.
@@ -195,8 +198,6 @@ export default class WEBGLRenderPipeline extends RenderPipeline {
     this.device.gl.useProgram(this.handle);
 
     this.vertexArrayObject.bind(() => {
-      const parameters = {...this.props.parameters, framebuffer: renderPass.props.framebuffer};
-
       const primitiveMode = getGLPrimitive(this.props.topology);
       const transformFeedback: any = null;
       if (transformFeedback) {
@@ -208,31 +209,33 @@ export default class WEBGLRenderPipeline extends RenderPipeline {
       this._applyUniforms();
 
       // TODO - double context push/pop
-      withDeviceParameters(this.device, parameters, () => {
-        // TODO - Use polyfilled WebGL2RenderingContext instead of ANGLE extension
-        if (isIndexed && isInstanced) {
-          // ANGLE_instanced_arrays extension
-          this.device.gl2.drawElementsInstanced(
-            drawMode,
-            vertexCount,
-            indexType,
-            firstVertex,
-            instanceCount
-          );
-          // } else if (isIndexed && this.device.isWebGL2 && !isNaN(start) && !isNaN(end)) {
-          //   this.device.gl2.drawRangeElements(drawMode, start, end, vertexCount, indexType, offset);
-        } else if (isIndexed) {
-          this.device.gl.drawElements(drawMode, vertexCount, indexType, firstVertex);
-        } else if (isInstanced) {
-          this.device.gl2.drawArraysInstanced(drawMode, firstVertex, vertexCount, instanceCount);
-        } else {
-          this.device.gl.drawArrays(drawMode, firstVertex, vertexCount);
+      withDeviceParameters(this.device, this.props.parameters, () => {
+        withGLParameters(this.device, {framebuffer: renderPass.props.framebuffer}, () => {
+          // TODO - Use polyfilled WebGL2RenderingContext instead of ANGLE extension
+          if (isIndexed && isInstanced) {
+            // ANGLE_instanced_arrays extension
+            this.device.gl2?.drawElementsInstanced(
+              drawMode,
+              vertexCount || 0, // indexCount?
+              indexType,
+              firstVertex,
+              instanceCount || 0
+            );
+            // } else if (isIndexed && this.device.isWebGL2 && !isNaN(start) && !isNaN(end)) {
+            //   this.device.gl2.drawRangeElements(drawMode, start, end, vertexCount, indexType, offset);
+          } else if (isIndexed) {
+            this.device.gl.drawElements(drawMode, vertexCount || 0, indexType, firstVertex); // indexCount?
+          } else if (isInstanced) {
+            this.device.gl2?.drawArraysInstanced(drawMode, firstVertex, vertexCount || 0, instanceCount || 0);
+          } else {
+            this.device.gl.drawArrays(drawMode, firstVertex, vertexCount || 0);
+          }
+        });
+
+        if (transformFeedback) {
+          transformFeedback.end();
         }
       });
-
-      if (transformFeedback) {
-        transformFeedback.end();
-      }
     });
 
     return true;
@@ -295,6 +298,9 @@ export default class WEBGLRenderPipeline extends RenderPipeline {
     this.device.gl.useProgram(this.handle);
 
     const {gl2} = this.device;
+    if (!gl2) {
+      throw new Error('bindings');
+    }
 
     let textureUnit = 0;
     let uniformBufferIndex = 0;
@@ -395,13 +401,15 @@ function getAttributesByLocation(
   const byLocation: Record<number, Buffer> = {};
   for (const [name, buffer] of Object.entries(attributes)) {
     const attribute = getAttributeLayout(layout, name);
-    byLocation[attribute.location] = buffer;
+    if (attribute) {
+      byLocation[attribute.location] = buffer;
+    }
   }
   return byLocation;
 }
 
-function getAttributeLayout(layout: ShaderLayout, name: string): AttributeLayout | undefined {
-  return layout.attributes.find((binding) => binding.name === name);
+function getAttributeLayout(layout: ShaderLayout, name: string): AttributeLayout | null {
+  return layout.attributes.find((binding) => binding.name === name) || null;
 }
 
 function getBindingLayout(layout: ShaderLayout, name: string): BindingLayout {

package/src/adapter/resources/webgl-sampler.ts

@@ -1,6 +1,8 @@
+// luma.gl, MIT license
+
 import {Sampler, SamplerProps} from '@luma.gl/api';
 import GL from '@luma.gl/constants';
-import type {WebGLSamplerParameters} from '../../types/webgl';
+import type {GLSamplerParameters} from '../../types/webgl';
 import {convertSamplerParametersToWebGL} from '../converters/sampler-parameters';
 import type WebGLDevice from '../webgl-device';
 
@@ -14,7 +16,7 @@ import type WebGLDevice from '../webgl-device';
 export default class WEBGLSampler extends Sampler {
   readonly device: WebGLDevice;
   readonly handle: WebGLSampler;
-  readonly parameters: WebGLSamplerParameters;
+  readonly parameters: GLSamplerParameters;
 
   constructor(device: WebGLDevice, props: SamplerProps) {
     super(device, props);
@@ -35,7 +37,7 @@ export default class WEBGLSampler extends Sampler {
   }
 
   /** Set sampler parameters on the sampler */
-  private _setSamplerParameters(parameters: WebGLSamplerParameters): void {
+  private _setSamplerParameters(parameters: GLSamplerParameters): void {
     for (const [pname, value] of Object.entries(parameters)) {
       // Apparently there are integer/float conversion issues requires two parameter setting functions in JavaScript.
       // For now, pick the float version for parameters specified as GLfloat.

package/src/adapter/resources/webgl-shader.ts

@@ -32,14 +32,14 @@ import WebGLDevice from '../webgl-device';
     if (this.handle) {
       this.removeStats();
       this.device.gl.deleteShader(this.handle);
-      // @ts-expect-error
-      this.handle = null;
+      // this.handle = null;
+      this.destroyed = true;
     }
   }
 
   async compilationInfo(): Promise<readonly CompilerMessage[]> {
     const log = this.device.gl.getShaderInfoLog(this.handle);
-    return parseShaderCompilerLog(log);
+    return log ? parseShaderCompilerLog(log) : [];
   }
 
   // PRIVATE METHODS
@@ -58,7 +58,8 @@ import WebGLDevice from '../webgl-device';
     const compileStatus = gl.getShaderParameter(this.handle, GL.COMPILE_STATUS);
     if (!compileStatus) {
       const shaderLog = gl.getShaderInfoLog(this.handle);
-      const messages = parseShaderCompilerLog(shaderLog).filter(message => message.type === 'error');
+      const parsedLog = shaderLog ? parseShaderCompilerLog(shaderLog) : [];
+      const messages = parsedLog.filter(message => message.type === 'error');
       const formattedLog = formatCompilerLog(messages, source);
       const shaderName: string = getShaderInfo(source).name;
       const shaderDescription = `${this.stage} shader ${shaderName}`;