fix(9.1): Minor fixes to unblock WebGPU in deck.gl (#2335)

visgl · Feb 17, 2025 · 4a994a4 · 4a994a4
1 parent d6198ca
commit 4a994a4
Show file tree

Hide file tree

Showing 8 changed files with 29 additions and 15 deletions.
diff --git a/modules/core/src/adapter/canvas-context.ts b/modules/core/src/adapter/canvas-context.ts
@@ -293,7 +293,7 @@ export abstract class CanvasContext {
     const gl = this.device.gl;
     if (!gl) {
       // use default device pixel ratio
-      throw new Error('canvas size');
+      return this.getPixelSize();
     }
     return [gl.drawingBufferWidth, gl.drawingBufferHeight];
   }

diff --git a/modules/core/src/adapter/resources/vertex-array.ts b/modules/core/src/adapter/resources/vertex-array.ts
@@ -72,6 +72,6 @@ export abstract class VertexArray extends Resource<VertexArrayProps> {
 
   /** @deprecated Set constant attributes (WebGL only) */
   setConstantWebGL(location: number, value: TypedArray | null): void {
-    throw new Error('constant attributes not supported');
+    this.device.reportError(new Error('constant attributes not supported'));
   }
 }
diff --git a/modules/shadertools/test/modules/math/fp64-arithmetic-transform.spec.ts b/modules/shadertools/test/modules/math/fp64-arithmetic-transform.spec.ts
@@ -94,9 +94,6 @@ function getTestCasesFor(device, glslFunc) {
 }
 
 test('fp64#sum_fp64', async t => {
-  console.log('start');
-  console.log('device');
-
   const glslFunc = 'sum_fp64';
   const testCases = getTestCasesFor(webglDevice, glslFunc);
   await runTests(webglDevice, {glslFunc, binary: true, op: (a, b) => a + b, testCases, t});

diff --git a/modules/webgl/test/context/state-tracker/webgl-state-tracker.spec.ts b/modules/webgl/test/context/state-tracker/webgl-state-tracker.spec.ts
@@ -11,8 +11,7 @@ import {
   getGLParameters,
   setGLParameters,
   resetGLParameters,
-  WebGLStateTracker,
-  webgl2Adapter
+  WebGLStateTracker
 } from '@luma.gl/webgl';
 
 import {

diff --git a/modules/webgpu/src/adapter/helpers/get-vertex-buffer-layout.ts b/modules/webgpu/src/adapter/helpers/get-vertex-buffer-layout.ts
@@ -37,7 +37,7 @@ export function getVertexBufferLayout(
     let stepMode: 'vertex' | 'instance' = 'vertex';
     let byteStride = 0;
     // @ts-ignore
-    const format: VertexFormat = mapping.format;
+    let format: VertexFormat = mapping.format;
 
     // interleaved mapping {..., attributes: [{...}, ...]}
     if (mapping.attributes) {
@@ -48,12 +48,13 @@ export function getVertexBufferLayout(
 
         // @ts-ignore
         const location: number = attributeLayout?.location;
+        format = attributeMapping.format || mapping.format;
 
         stepMode =
           attributeLayout?.stepMode ||
           (attributeLayout?.name.startsWith('instance') ? 'instance' : 'vertex');
         vertexAttributes.push({
-          format: getWebGPUVertexFormat(attributeMapping.format || mapping.format),
+          format: getWebGPUVertexFormat(format),
           offset: attributeMapping.byteOffset,
           shaderLocation: location
         });

diff --git a/modules/webgpu/src/adapter/helpers/webgpu-parameters.ts b/modules/webgpu/src/adapter/helpers/webgpu-parameters.ts
@@ -2,7 +2,7 @@
 // SPDX-License-Identifier: MIT
 // Copyright (c) vis.gl contributors
 
-import {Parameters} from '@luma.gl/core';
+import {Parameters, log} from '@luma.gl/core';
 
 function addDepthStencil(descriptor: GPURenderPipelineDescriptor): GPUDepthStencilState {
   descriptor.depthStencil = descriptor.depthStencil || {
@@ -297,19 +297,22 @@ function setParameters(
   for (const [key, value] of Object.entries(parameters)) {
     const setterFunction = PARAMETER_TABLE[key as keyof Parameters];
     if (!setterFunction) {
-      throw new Error(`Illegal parameter ${key}`);
+      log.warn(`Illegal parameter ${key}`)();
+      continue;
     }
     setterFunction(key, value, pipelineDescriptor);
   }
 }
 
 function addColorState(descriptor: GPURenderPipelineDescriptor): GPUColorTargetState[] {
-  // @ts-ignore
+  // @ts-ignore GPU types as iterator
   descriptor.fragment.targets = descriptor.fragment?.targets || [];
   if (!Array.isArray(descriptor.fragment?.targets)) {
-    throw new Error('colorstate');
+    log.warn('parameters: no targets array')();
   }
+  // @ts-expect-error GPU types as iterator
   if (descriptor.fragment?.targets?.length === 0) {
+    // @ts-expect-error GPU types as iterator
     descriptor.fragment.targets?.push({});
   }
   return descriptor.fragment?.targets as GPUColorTargetState[];

diff --git a/modules/webgpu/src/adapter/resources/webgpu-render-pass.ts b/modules/webgpu/src/adapter/resources/webgpu-render-pass.ts
@@ -2,6 +2,7 @@
 // SPDX-License-Identifier: MIT
 // Copyright (c) vis.gl contributors
 
+import type {TypedArray, NumberArray4} from '@math.gl/types';
 import type {RenderPassProps, RenderPassParameters, Binding} from '@luma.gl/core';
 import {Buffer, RenderPass, RenderPipeline, log} from '@luma.gl/core';
 import {WebGPUDevice} from '../webgpu-device';
@@ -182,8 +183,9 @@ export class WebGPURenderPass extends RenderPass {
       (colorAttachment, index) => ({
         // clear values
         loadOp: this.props.clearColor !== false ? 'clear' : 'load',
-        colorClearValue:
-          this.props.clearColors?.[index] || this.props.clearColor || RenderPass.defaultClearColor,
+        clearValue: convertColor(
+          this.props.clearColors?.[index] || this.props.clearColor || RenderPass.defaultClearColor
+        ),
         storeOp: this.props.discard ? 'discard' : 'store',
         // ...colorAttachment,
         view: colorAttachment.handle
@@ -226,3 +228,7 @@ export class WebGPURenderPass extends RenderPass {
     return renderPassDescriptor;
   }
 }
+
+function convertColor(color: TypedArray | NumberArray4): GPUColor {
+  return {r: color[0], g: color[1], b: color[2], a: color[3]};
+}
diff --git a/modules/webgpu/src/adapter/resources/webgpu-render-pipeline.ts b/modules/webgpu/src/adapter/resources/webgpu-render-pipeline.ts
@@ -178,6 +178,14 @@ export class WebGPURenderPipeline extends RenderPipeline {
       layout: 'auto'
     };
 
+    if (this.props.parameters.depthWriteEnabled && this.props.parameters.depthCompare) {
+      descriptor.depthStencil = {
+        format: 'depth24plus',
+        depthWriteEnabled: this.props.parameters.depthWriteEnabled,
+        depthCompare: this.props.parameters.depthCompare
+      };
+    }
+
     // Set parameters on the descriptor
     applyParametersToRenderPipelineDescriptor(descriptor, this.props.parameters);