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

package/dist/adapter/resources/webgl-render-pipeline.js

@@ -1,245 +1,395 @@
+// luma.gl, MIT license
+// Copyright (c) vis.gl contributors
 import { RenderPipeline, cast, splitUniformsAndBindings, log } from '@luma.gl/core';
 import { mergeShaderLayout } from '@luma.gl/core';
-import { getShaderLayout } from "../helpers/get-shader-layout.js";
-import { withDeviceAndGLParameters } from "../converters/device-parameters.js";
-import { setUniform } from "../helpers/set-uniform.js";
-import { WEBGLBuffer } from "./webgl-buffer.js";
-import { WEBGLFramebuffer } from "./webgl-framebuffer.js";
-import { WEBGLTexture } from "./webgl-texture.js";
-import { getGLDrawMode } from "../helpers/webgl-topology-utils.js";
+// import {mergeShaderLayout, getAttributeInfosFromLayouts} from '@luma.gl/core';
+import { GL } from '@luma.gl/constants';
+import { getShaderLayout } from '../helpers/get-shader-layout';
+import { withDeviceAndGLParameters } from '../converters/device-parameters';
+import { setUniform } from '../helpers/set-uniform';
+import { WEBGLBuffer } from './webgl-buffer';
+import { WEBGLFramebuffer } from './webgl-framebuffer';
+import { WEBGLTexture } from './webgl-texture';
+import { getGLDrawMode } from '../helpers/webgl-topology-utils';
 const LOG_PROGRAM_PERF_PRIORITY = 4;
+/** Creates a new render pipeline */
 export class WEBGLRenderPipeline extends RenderPipeline {
-  constructor(device, props) {
-    super(device, props);
-    this.device = void 0;
-    this.handle = void 0;
-    this.vs = void 0;
-    this.fs = void 0;
-    this.introspectedLayout = void 0;
-    this.uniforms = {};
-    this.bindings = {};
-    this.varyings = null;
-    this._uniformCount = 0;
-    this._uniformSetters = {};
-    this.device = device;
-    this.handle = this.props.handle || this.device.gl.createProgram();
-    this.device.setSpectorMetadata(this.handle, {
-      id: this.props.id
-    });
-    this.vs = cast(props.vs);
-    this.fs = cast(props.fs);
-    const {
-      varyings,
-      bufferMode = 35981
-    } = props;
-    if (varyings && varyings.length > 0) {
-      var _this$device$gl;
-      this.device.assertWebGL2();
-      this.varyings = varyings;
-      (_this$device$gl = this.device.gl2) === null || _this$device$gl === void 0 ? void 0 : _this$device$gl.transformFeedbackVaryings(this.handle, varyings, bufferMode);
+    /** The WebGL device that created this render pipeline */
+    device;
+    /** Handle to underlying WebGL program */
+    handle;
+    /** vertex shader */
+    vs;
+    /** fragment shader */
+    fs;
+    /** The layout extracted from shader by WebGL introspection APIs */
+    introspectedLayout;
+    /** Uniforms set on this model */
+    uniforms = {};
+    /** Bindings set on this model */
+    bindings = {};
+    /** WebGL varyings */
+    varyings = null;
+    _uniformCount = 0;
+    _uniformSetters = {}; // TODO are these used?
+    constructor(device, props) {
+        super(device, props);
+        this.device = device;
+        this.handle = this.props.handle || this.device.gl.createProgram();
+        this.device.setSpectorMetadata(this.handle, { id: this.props.id });
+        // Create shaders if needed
+        this.vs = cast(props.vs);
+        this.fs = cast(props.fs);
+        // assert(this.vs.stage === 'vertex');
+        // assert(this.fs.stage === 'fragment');
+        // Setup varyings if supplied
+        // @ts-expect-error WebGL only
+        const { varyings, bufferMode = GL.SEPARATE_ATTRIBS } = props;
+        if (varyings && varyings.length > 0) {
+            this.varyings = varyings;
+            this.device.gl.transformFeedbackVaryings(this.handle, varyings, bufferMode);
+        }
+        this._linkShaders();
+        this.introspectedLayout = getShaderLayout(this.device.gl, this.handle);
+        // Merge provided layout with introspected layout
+        this.shaderLayout = mergeShaderLayout(this.introspectedLayout, props.shaderLayout);
+        // WebGPU has more restrictive topology support than WebGL
+        switch (this.props.topology) {
+            case 'triangle-fan-webgl':
+            case 'line-loop-webgl':
+                log.warn(`Primitive topology ${this.props.topology} is deprecated and will be removed in v9.1`);
+                break;
+            default:
+        }
     }
-    this._compileAndLink();
-    this.introspectedLayout = getShaderLayout(this.device.gl, this.handle);
-    this.shaderLayout = mergeShaderLayout(this.introspectedLayout, props.shaderLayout);
-    switch (this.props.topology) {
-      case 'triangle-fan-webgl':
-      case 'line-loop-webgl':
-        log.warn(`Primitive topology ${this.props.topology} is deprecated and will be removed in v9.1`);
-        break;
-      default:
+    destroy() {
+        if (this.handle) {
+            this.device.gl.deleteProgram(this.handle);
+            // this.handle = null;
+            this.destroyed = true;
+        }
     }
-  }
-  destroy() {
-    if (this.handle) {
-      this.device.gl.deleteProgram(this.handle);
-      this.destroyed = true;
+    /**
+     * Bindings include: textures, samplers and uniform buffers
+     * @todo needed for portable model
+     */
+    setBindings(bindings) {
+        // if (log.priority >= 2) {
+        //   checkUniformValues(uniforms, this.id, this._uniformSetters);
+        // }
+        for (const [name, value] of Object.entries(bindings)) {
+            // Accept both `xyz` and `xyzUniforms` as valid names for `xyzUniforms` uniform block
+            // This convention allows shaders to name uniform blocks as `uniform appUniforms {} app;`
+            // and reference them as `app` from both GLSL and JS.
+            // TODO - this is rather hacky - we could also remap the name directly in the shader layout.
+            const binding = this.shaderLayout.bindings.find(binding => binding.name === name) ||
+                this.shaderLayout.bindings.find(binding => binding.name === `${name}Uniforms`);
+            if (!binding) {
+                const validBindings = this.shaderLayout.bindings
+                    .map(binding => `"${binding.name}"`)
+                    .join(', ');
+                log.warn(`Unknown binding "${name}" in render pipeline "${this.id}", expected one of ${validBindings}`)();
+                continue; // eslint-disable-line no-continue
+            }
+            if (!value) {
+                log.warn(`Unsetting binding "${name}" in render pipeline "${this.id}"`)();
+            }
+            switch (binding.type) {
+                case 'uniform':
+                    // @ts-expect-error
+                    if (!(value instanceof WEBGLBuffer) && !(value.buffer instanceof WEBGLBuffer)) {
+                        throw new Error('buffer value');
+                    }
+                    break;
+                case 'texture':
+                    if (!(value instanceof WEBGLTexture || value instanceof WEBGLFramebuffer)) {
+                        throw new Error('texture value');
+                    }
+                    break;
+                case 'sampler':
+                    log.warn(`Ignoring sampler ${name}`)();
+                    break;
+                default:
+                    throw new Error(binding.type);
+            }
+            this.bindings[name] = value;
+        }
     }
-  }
-  setBindings(bindings) {
-    for (const [name, value] of Object.entries(bindings)) {
-      const binding = this.shaderLayout.bindings.find(binding => binding.name === name) || this.shaderLayout.bindings.find(binding => binding.name === `${name}Uniforms`);
-      if (!binding) {
-        const validBindings = this.shaderLayout.bindings.map(binding => `"${binding.name}"`).join(', ');
-        log.warn(`Unknown binding "${name}" in render pipeline "${this.id}", expected one of ${validBindings}`)();
-        continue;
-      }
-      if (!value) {
-        log.warn(`Unsetting binding "${name}" in render pipeline "${this.id}"`)();
-      }
-      switch (binding.type) {
-        case 'uniform':
-          if (!(value instanceof WEBGLBuffer) && !(value.buffer instanceof WEBGLBuffer)) {
-            throw new Error('buffer value');
-          }
-          break;
-        case 'texture':
-          if (!(value instanceof WEBGLTexture || value instanceof WEBGLFramebuffer)) {
-            throw new Error('texture value');
-          }
-          break;
-        case 'sampler':
-          log.warn(`Ignoring sampler ${name}`)();
-          break;
-        default:
-          throw new Error(binding.type);
-      }
-      this.bindings[name] = value;
+    /** This function is @deprecated, use uniform buffers */
+    setUniforms(uniforms) {
+        const { bindings } = splitUniformsAndBindings(uniforms);
+        Object.keys(bindings).forEach(name => {
+            log.warn(`Unsupported value "${JSON.stringify(bindings[name])}" used in setUniforms() for key ${name}. Use setBindings() instead?`)();
+        });
+        // TODO - check against layout
+        Object.assign(this.uniforms, uniforms);
     }
-  }
-  setUniforms(uniforms) {
-    const {
-      bindings
-    } = splitUniformsAndBindings(uniforms);
-    Object.keys(bindings).forEach(name => {
-      log.warn(`Unsupported value "${JSON.stringify(bindings[name])}" used in setUniforms() for key ${name}. Use setBindings() instead?`)();
-    });
-    Object.assign(this.uniforms, uniforms);
-  }
-  draw(options) {
-    var _vertexArray$indexBuf;
-    const {
-      renderPass,
-      vertexArray,
-      vertexCount,
-      instanceCount,
-      firstVertex = 0,
-      transformFeedback
-    } = options;
-    const glDrawMode = getGLDrawMode(this.props.topology);
-    const isIndexed = Boolean(vertexArray.indexBuffer);
-    const glIndexType = (_vertexArray$indexBuf = vertexArray.indexBuffer) === null || _vertexArray$indexBuf === void 0 ? void 0 : _vertexArray$indexBuf.glIndexType;
-    const isInstanced = Number(instanceCount) > 0;
-    if (!this._areTexturesRenderable() || vertexCount === 0) {
-      return false;
+    /** @todo needed for portable model
+     * @note The WebGL API is offers many ways to draw things
+     * This function unifies those ways into a single call using common parameters with sane defaults
+     */
+    draw(options) {
+        // If we are using async linking, we need to wait until linking completes
+        if (this.linkStatus !== 'success') {
+            return false;
+        }
+        const { renderPass, vertexArray, vertexCount, 
+        // indexCount,
+        instanceCount, firstVertex = 0, 
+        // firstIndex,
+        // firstInstance,
+        // baseVertex,
+        transformFeedback } = options;
+        const glDrawMode = getGLDrawMode(this.props.topology);
+        const isIndexed = Boolean(vertexArray.indexBuffer);
+        const glIndexType = vertexArray.indexBuffer?.glIndexType;
+        const isInstanced = Number(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.
+        // Now that all uniforms have been updated, check if any texture
+        // in the uniforms is not yet initialized, then we don't draw
+        if (!this._areTexturesRenderable() || vertexCount === 0) {
+            // (isInstanced && instanceCount === 0)
+            return false;
+        }
+        this.device.gl.useProgram(this.handle);
+        // Note: Rebinds constant attributes before each draw call
+        vertexArray.bindBeforeRender(renderPass);
+        if (transformFeedback) {
+            transformFeedback.begin(this.props.topology);
+        }
+        // We have to apply bindings before every draw call since other draw calls will overwrite
+        this._applyBindings();
+        this._applyUniforms();
+        const webglRenderPass = renderPass;
+        //     // TODO - Use polyfilled WebGL2RenderingContext instead of ANGLE extension
+        //     if (isIndexed && isInstanced) {
+        //       // ANGLE_instanced_arrays extension
+        //       this.device.gl.drawElementsInstanced(
+        //         drawMode,
+        //         vertexCount || 0, // indexCount?
+        //         indexType,
+        //         firstVertex,
+        //         instanceCount || 0
+        //       );
+        //       // } else if (isIndexed && this.device.isWebGL2 && !isNaN(start) && !isNaN(end)) {
+        //       //   this.device.gldrawRangeElements(drawMode, start, end, vertexCount, indexType, offset);
+        //     } else if (isIndexed) {
+        //       this.device.gl.drawElements(drawMode, vertexCount || 0, indexType, firstVertex); // indexCount?
+        //     } else if (isInstanced) {
+        //       this.device.gl.drawArraysInstanced(
+        //         drawMode,
+        //         firstVertex,
+        //         vertexCount || 0,
+        //         instanceCount || 0
+        //       );
+        //     } else {
+        //       this.device.gl.drawArrays(drawMode, firstVertex, vertexCount || 0);
+        //     }
+        //   });
+        withDeviceAndGLParameters(this.device, this.props.parameters, webglRenderPass.glParameters, () => {
+            if (isIndexed && isInstanced) {
+                // ANGLE_instanced_arrays extension
+                this.device.gl.drawElementsInstanced(glDrawMode, vertexCount || 0, // indexCount?
+                glIndexType, firstVertex, instanceCount || 0);
+                // } else if (isIndexed && this.device.isWebGL2 && !isNaN(start) && !isNaN(end)) {
+                //   this.device.gldrawRangeElements(glDrawMode, start, end, vertexCount, glIndexType, offset);
+            }
+            else if (isIndexed) {
+                this.device.gl.drawElements(glDrawMode, vertexCount || 0, glIndexType, firstVertex); // indexCount?
+            }
+            else if (isInstanced) {
+                this.device.gl.drawArraysInstanced(glDrawMode, firstVertex, vertexCount || 0, instanceCount || 0);
+            }
+            else {
+                this.device.gl.drawArrays(glDrawMode, firstVertex, vertexCount || 0);
+            }
+            if (transformFeedback) {
+                transformFeedback.end();
+            }
+        });
+        vertexArray.unbindAfterRender(renderPass);
+        return true;
     }
-    this.device.gl.useProgram(this.handle);
-    vertexArray.bindBeforeRender(renderPass);
-    if (transformFeedback) {
-      transformFeedback.begin(this.props.topology);
+    // PRIVATE METHODS
+    // setAttributes(attributes: Record<string, Buffer>): void {}
+    // setBindings(bindings: Record<string, Binding>): void {}
+    async _linkShaders() {
+        const { gl } = this.device;
+        gl.attachShader(this.handle, this.vs.handle);
+        gl.attachShader(this.handle, this.fs.handle);
+        log.time(LOG_PROGRAM_PERF_PRIORITY, `linkProgram for ${this.id}`)();
+        gl.linkProgram(this.handle);
+        log.timeEnd(LOG_PROGRAM_PERF_PRIORITY, `linkProgram for ${this.id}`)();
+        // TODO Avoid checking program linking error in production
+        if (log.level === 0) {
+            // return;
+        }
+        if (!this.device.features.has('shader-status-async-webgl')) {
+            const status = this._getLinkStatus();
+            this._reportLinkStatus(status);
+            return;
+        }
+        // async case
+        log.once(1, 'RenderPipeline linking is asynchronous')();
+        await this._waitForLinkComplete();
+        log.info(2, `RenderPipeline ${this.id} - async linking complete: ${this.linkStatus}`)();
+        const status = this._getLinkStatus();
+        this._reportLinkStatus(status);
     }
-    this._applyBindings();
-    this._applyUniforms();
-    const webglRenderPass = renderPass;
-    withDeviceAndGLParameters(this.device, this.props.parameters, webglRenderPass.glParameters, () => {
-      if (isIndexed && isInstanced) {
-        var _this$device$gl2;
-        (_this$device$gl2 = this.device.gl2) === null || _this$device$gl2 === void 0 ? void 0 : _this$device$gl2.drawElementsInstanced(glDrawMode, vertexCount || 0, glIndexType, firstVertex, instanceCount || 0);
-      } else if (isIndexed) {
-        this.device.gl.drawElements(glDrawMode, vertexCount || 0, glIndexType, firstVertex);
-      } else if (isInstanced) {
-        var _this$device$gl3;
-        (_this$device$gl3 = this.device.gl2) === null || _this$device$gl3 === void 0 ? void 0 : _this$device$gl3.drawArraysInstanced(glDrawMode, firstVertex, vertexCount || 0, instanceCount || 0);
-      } else {
-        this.device.gl.drawArrays(glDrawMode, firstVertex, vertexCount || 0);
-      }
-      if (transformFeedback) {
-        transformFeedback.end();
-      }
-    });
-    vertexArray.unbindAfterRender(renderPass);
-    return true;
-  }
-  _compileAndLink() {
-    const {
-      gl
-    } = this.device;
-    gl.attachShader(this.handle, this.vs.handle);
-    gl.attachShader(this.handle, this.fs.handle);
-    log.time(LOG_PROGRAM_PERF_PRIORITY, `linkProgram for ${this.id}`)();
-    gl.linkProgram(this.handle);
-    log.timeEnd(LOG_PROGRAM_PERF_PRIORITY, `linkProgram for ${this.id}`)();
-    if (!gl.debug && log.level === 0) {}
-    const linked = gl.getProgramParameter(this.handle, 35714);
-    if (!linked) {
-      throw new Error(`Error linking: ${gl.getProgramInfoLog(this.handle)}`);
+    /** Report link status. First, check for shader compilation failures if linking fails */
+    _reportLinkStatus(status) {
+        switch (status) {
+            case 'success':
+                return;
+            default:
+                // First check for shader compilation failures if linking fails
+                if (this.vs.compilationStatus === 'error') {
+                    this.vs.debugShader();
+                    throw new Error(`Error during compilation of shader ${this.vs.id}`);
+                }
+                if (this.fs?.compilationStatus === 'error') {
+                    this.vs.debugShader();
+                    throw new Error(`Error during compilation of shader ${this.fs.id}`);
+                }
+                throw new Error(`Error during ${status}: ${this.device.gl.getProgramInfoLog(this.handle)}`);
+        }
     }
-    gl.validateProgram(this.handle);
-    const validated = gl.getProgramParameter(this.handle, 35715);
-    if (!validated) {
-      throw new Error(`Error validating: ${gl.getProgramInfoLog(this.handle)}`);
+    /**
+     * Get the shader compilation status
+     * TODO - Load log even when no error reported, to catch warnings?
+     * https://gamedev.stackexchange.com/questions/30429/how-to-detect-glsl-warnings
+     */
+    _getLinkStatus() {
+        const { gl } = this.device;
+        const linked = gl.getProgramParameter(this.handle, gl.LINK_STATUS);
+        if (!linked) {
+            this.linkStatus = 'error';
+            return 'linking';
+        }
+        gl.validateProgram(this.handle);
+        const validated = gl.getProgramParameter(this.handle, gl.VALIDATE_STATUS);
+        if (!validated) {
+            this.linkStatus = 'error';
+            return 'validation';
+        }
+        this.linkStatus = 'success';
+        return 'success';
     }
-  }
-  _areTexturesRenderable() {
-    let texturesRenderable = true;
-    for (const [, texture] of Object.entries(this.bindings)) {
-      if (texture instanceof WEBGLTexture) {
-        texture.update();
-        texturesRenderable = texturesRenderable && texture.loaded;
-      }
+    /** Use KHR_parallel_shader_compile extension if available */
+    async _waitForLinkComplete() {
+        const waitMs = async (ms) => await new Promise(resolve => setTimeout(resolve, ms));
+        const DELAY_MS = 10; // Shader compilation is typically quite fast (with some exceptions)
+        // If status polling is not available, we can't wait for completion. Just wait a little to minimize blocking
+        if (!this.device.features.has('shader-status-async-webgl')) {
+            await waitMs(DELAY_MS);
+            return;
+        }
+        const { gl } = this.device;
+        for (;;) {
+            const complete = gl.getProgramParameter(this.handle, GL.COMPLETION_STATUS);
+            if (complete) {
+                return;
+            }
+            await waitMs(DELAY_MS);
+        }
     }
-    return texturesRenderable;
-  }
-  _applyBindings() {
-    this.device.gl.useProgram(this.handle);
-    const {
-      gl2
-    } = this.device;
-    if (!gl2) {
-      throw new Error('bindings');
+    /**
+     * Checks if all texture-values uniforms are renderable (i.e. loaded)
+     * Update a texture if needed (e.g. from video)
+     * Note: This is currently done before every draw call
+     */
+    _areTexturesRenderable() {
+        let texturesRenderable = true;
+        for (const [, texture] of Object.entries(this.bindings)) {
+            if (texture instanceof WEBGLTexture) {
+                texture.update();
+                texturesRenderable = texturesRenderable && texture.loaded;
+            }
+        }
+        return texturesRenderable;
     }
-    let textureUnit = 0;
-    let uniformBufferIndex = 0;
-    for (const binding of this.shaderLayout.bindings) {
-      const value = this.bindings[binding.name] || this.bindings[binding.name.replace(/Uniforms$/, '')];
-      if (!value) {
-        throw new Error(`No value for binding ${binding.name} in ${this.id}`);
-      }
-      switch (binding.type) {
-        case 'uniform':
-          const {
-            name
-          } = binding;
-          const location = gl2.getUniformBlockIndex(this.handle, name);
-          if (location === 4294967295) {
-            throw new Error(`Invalid uniform block name ${name}`);
-          }
-          gl2.uniformBlockBinding(this.handle, uniformBufferIndex, location);
-          if (value instanceof WEBGLBuffer) {
-            gl2.bindBufferBase(35345, uniformBufferIndex, value.handle);
-          } else {
-            gl2.bindBufferRange(35345, uniformBufferIndex, value.buffer.handle, value.offset || 0, value.size || value.buffer.byteLength - value.offset);
-          }
-          uniformBufferIndex += 1;
-          break;
-        case 'texture':
-          if (!(value instanceof WEBGLTexture || value instanceof WEBGLFramebuffer)) {
-            throw new Error('texture');
-          }
-          let texture;
-          if (value instanceof WEBGLTexture) {
-            texture = value;
-          } else if (value instanceof WEBGLFramebuffer && value.colorAttachments[0] instanceof WEBGLTexture) {
-            log.warn('Passing framebuffer in texture binding may be deprecated. Use fbo.colorAttachments[0] instead')();
-            texture = value.colorAttachments[0];
-          } else {
-            throw new Error('No texture');
-          }
-          gl2.activeTexture(33984 + textureUnit);
-          gl2.bindTexture(texture.target, texture.handle);
-          textureUnit += 1;
-          break;
-        case 'sampler':
-          break;
-        case 'storage':
-        case 'read-only-storage':
-          throw new Error(`binding type '${binding.type}' not supported in WebGL`);
-      }
+    /** Apply any bindings (before each draw call) */
+    _applyBindings() {
+        // If we are using async linking, we need to wait until linking completes
+        if (this.linkStatus !== 'success') {
+            return;
+        }
+        const { gl } = this.device;
+        gl.useProgram(this.handle);
+        let textureUnit = 0;
+        let uniformBufferIndex = 0;
+        for (const binding of this.shaderLayout.bindings) {
+            // Accept both `xyz` and `xyzUniforms` as valid names for `xyzUniforms` uniform block
+            const value = this.bindings[binding.name] || this.bindings[binding.name.replace(/Uniforms$/, '')];
+            if (!value) {
+                throw new Error(`No value for binding ${binding.name} in ${this.id}`);
+            }
+            switch (binding.type) {
+                case 'uniform':
+                    // Set buffer
+                    const { name } = binding;
+                    const location = gl.getUniformBlockIndex(this.handle, name);
+                    if (location === GL.INVALID_INDEX) {
+                        throw new Error(`Invalid uniform block name ${name}`);
+                    }
+                    gl.uniformBlockBinding(this.handle, uniformBufferIndex, location);
+                    // console.debug(binding, location);
+                    if (value instanceof WEBGLBuffer) {
+                        gl.bindBufferBase(GL.UNIFORM_BUFFER, uniformBufferIndex, value.handle);
+                    }
+                    else {
+                        gl.bindBufferRange(GL.UNIFORM_BUFFER, uniformBufferIndex, 
+                        // @ts-expect-error
+                        value.buffer.handle, 
+                        // @ts-expect-error
+                        value.offset || 0, 
+                        // @ts-expect-error
+                        value.size || value.buffer.byteLength - value.offset);
+                    }
+                    uniformBufferIndex += 1;
+                    break;
+                case 'texture':
+                    if (!(value instanceof WEBGLTexture || value instanceof WEBGLFramebuffer)) {
+                        throw new Error('texture');
+                    }
+                    let texture;
+                    if (value instanceof WEBGLTexture) {
+                        texture = value;
+                    }
+                    else if (value instanceof WEBGLFramebuffer &&
+                        value.colorAttachments[0] instanceof WEBGLTexture) {
+                        log.warn('Passing framebuffer in texture binding may be deprecated. Use fbo.colorAttachments[0] instead')();
+                        texture = value.colorAttachments[0];
+                    }
+                    else {
+                        throw new Error('No texture');
+                    }
+                    gl.activeTexture(GL.TEXTURE0 + textureUnit);
+                    gl.bindTexture(texture.target, texture.handle);
+                    // gl.bindSampler(textureUnit, sampler.handle);
+                    textureUnit += 1;
+                    break;
+                case 'sampler':
+                    // ignore
+                    break;
+                case 'storage':
+                case 'read-only-storage':
+                    throw new Error(`binding type '${binding.type}' not supported in WebGL`);
+            }
+        }
     }
-  }
-  _applyUniforms() {
-    for (const uniformLayout of this.shaderLayout.uniforms || []) {
-      var _this$uniforms$name;
-      const {
-        name,
-        location,
-        type,
-        textureUnit
-      } = uniformLayout;
-      const value = (_this$uniforms$name = this.uniforms[name]) !== null && _this$uniforms$name !== void 0 ? _this$uniforms$name : textureUnit;
-      if (value !== undefined) {
-        setUniform(this.device.gl, location, type, value);
-      }
+    /**
+     * Due to program sharing, uniforms need to be reset before every draw call
+     * (though caching will avoid redundant WebGL calls)
+     */
+    _applyUniforms() {
+        for (const uniformLayout of this.shaderLayout.uniforms || []) {
+            const { name, location, type, textureUnit } = uniformLayout;
+            const value = this.uniforms[name] ?? textureUnit;
+            if (value !== undefined) {
+                setUniform(this.device.gl, location, type, value);
+            }
+        }
     }
-  }
 }
-//# sourceMappingURL=webgl-render-pipeline.js.map

package/dist/adapter/resources/webgl-sampler.d.ts

@@ -3,8 +3,6 @@ import { GLSamplerParameters } from '@luma.gl/constants';
 import type { WebGLDevice } from '../webgl-device';
 /**
  * Sampler object -
- * Under WebGL2 we create an actual WebGL sampler
- * Under WebGL1, we just store the sampler parameters
  * so that they can be set directly on the texture
  * https://github.com/WebGLSamples/WebGL2Samples/blob/master/samples/sampler_object.html
  */

package/dist/adapter/resources/webgl-sampler.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"webgl-sampler.d.ts","sourceRoot":"","sources":["../../../src/adapter/resources/webgl-sampler.ts"],"names":[],"mappings":"AAGA,OAAO,EAAC,OAAO,EAAE,YAAY,EAAC,MAAM,eAAe,CAAC;AACpD,OAAO,EAAK,mBAAmB,EAAC,MAAM,oBAAoB,CAAC;AAE3D,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,iBAAiB,CAAC;AAEjD;;;;;;GAMG;AACH,qBAAa,YAAa,SAAQ,OAAO;IACvC,QAAQ,CAAC,MAAM,EAAE,WAAW,CAAC;IAC7B,QAAQ,CAAC,MAAM,EAAE,YAAY,CAAC;IAC9B,QAAQ,CAAC,UAAU,EAAE,mBAAmB,CAAC;gBAE7B,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,YAAY;IAU3C,OAAO,IAAI,IAAI;IAQf,QAAQ,IAAI,MAAM;IAI3B,4CAA4C;IAC5C,OAAO,CAAC,qBAAqB;CAgB9B"}
+{"version":3,"file":"webgl-sampler.d.ts","sourceRoot":"","sources":["../../../src/adapter/resources/webgl-sampler.ts"],"names":[],"mappings":"AAGA,OAAO,EAAC,OAAO,EAAE,YAAY,EAAC,MAAM,eAAe,CAAC;AACpD,OAAO,EAAK,mBAAmB,EAAC,MAAM,oBAAoB,CAAC;AAE3D,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,iBAAiB,CAAC;AAEjD;;;;GAIG;AACH,qBAAa,YAAa,SAAQ,OAAO;IACvC,QAAQ,CAAC,MAAM,EAAE,WAAW,CAAC;IAC7B,QAAQ,CAAC,MAAM,EAAE,YAAY,CAAC;IAC9B,QAAQ,CAAC,UAAU,EAAE,mBAAmB,CAAC;gBAE7B,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,YAAY;IAQ3C,OAAO,IAAI,IAAI;IAQf,QAAQ,IAAI,MAAM;IAI3B,4CAA4C;IAC5C,OAAO,CAAC,qBAAqB;CAgB9B"}