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

package/src/adapter/resources/webgpu-vertex-array.ts

@@ -22,7 +22,7 @@ export class WebGPUVertexArray extends VertexArray {
   readonly handle: never;
 
   // Create a VertexArray
-  constructor(device: WebGPUDevice, props?: VertexArrayProps) {
+  constructor(device: WebGPUDevice, props: VertexArrayProps) {
     super(device, props);
     this.device = device;
   }
@@ -60,6 +60,7 @@ export class WebGPUVertexArray extends VertexArray {
       log.warn('setting index buffer', webgpuIndexBuffer?.handle, webgpuIndexBuffer?.indexType)();
       webgpuRenderPass.handle.setIndexBuffer(
         webgpuIndexBuffer?.handle,
+        // @ts-expect-error TODO - we must enforce type
         webgpuIndexBuffer?.indexType
       );
     }

package/src/adapter/webgpu-adapter.ts

@@ -0,0 +1,93 @@
+// luma.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
+import {Adapter, DeviceProps, CanvasContext, log} from '@luma.gl/core';
+import {WebGPUDevice} from './webgpu-device';
+
+// / <reference types="@webgpu/types" />
+
+export class WebGPUAdapter extends Adapter {
+  /** type of device's created by this adapter */
+  readonly type: WebGPUDevice['type'] = 'webgpu';
+
+  constructor() {
+    super();
+    // @ts-ignore For backwards compatibility luma.registerDevices
+    WebGPUDevice.adapter = this;
+  }
+
+  /** Check if WebGPU is available */
+  isSupported(): boolean {
+    return Boolean(typeof navigator !== 'undefined' && navigator.gpu);
+  }
+
+  async create(props: DeviceProps): Promise<WebGPUDevice> {
+    if (!navigator.gpu) {
+      throw new Error(
+        'WebGPU not available. Open in Chrome Canary and turn on chrome://flags/#enable-unsafe-webgpu'
+      );
+    }
+    log.groupCollapsed(1, 'WebGPUDevice created')();
+    const adapter = await navigator.gpu.requestAdapter({
+      powerPreference: 'high-performance'
+      // forceSoftware: false
+    });
+
+    if (!adapter) {
+      throw new Error('Failed to request WebGPU adapter');
+    }
+
+    const adapterInfo = await adapter.requestAdapterInfo();
+    log.probe(2, 'Adapter available', adapterInfo)();
+
+    const requiredFeatures: GPUFeatureName[] = [];
+    const requiredLimits: Record<string, number> = {};
+
+    if (props.requestMaxLimits) {
+      // Require all features
+      requiredFeatures.push(...(Array.from(adapter.features) as GPUFeatureName[]));
+
+      // Require all limits
+      // Filter out chrome specific keys (avoid crash)
+      const limits = Object.keys(adapter.limits).filter(
+        key => !['minSubgroupSize', 'maxSubgroupSize'].includes(key)
+      );
+      for (const key of limits) {
+        const limit = key as keyof GPUSupportedLimits;
+        const value = adapter.limits[limit];
+        if (typeof value === 'number') {
+          requiredLimits[limit] = value;
+        }
+      }
+    }
+
+    const gpuDevice = await adapter.requestDevice({
+      requiredFeatures,
+      requiredLimits
+    });
+
+    log.probe(1, 'GPUDevice available')();
+
+    if (typeof props.canvas === 'string') {
+      await CanvasContext.pageLoaded;
+      log.probe(1, 'DOM is loaded')();
+    }
+
+    const device = new WebGPUDevice(props, gpuDevice, adapter, adapterInfo);
+
+    log.probe(
+      1,
+      'Device created. For more info, set chrome://flags/#enable-webgpu-developer-features'
+    )();
+    log.table(1, device.info)();
+    log.groupEnd(1)();
+    return device;
+  }
+
+  async attach(handle: GPUDevice): Promise<WebGPUDevice> {
+    throw new Error('WebGPUAdapter.attach() not implemented');
+  }
+}
+
+export const webgpuAdapter = new WebGPUAdapter();

package/src/adapter/webgpu-canvas-context.ts

@@ -22,7 +22,7 @@ export class WebGPUCanvasContext extends CanvasContext {
   /** Format of returned textures: "bgra8unorm", "rgba8unorm", "rgba16float". */
   readonly format: TextureFormat = navigator.gpu.getPreferredCanvasFormat() as TextureFormat;
   /** Default stencil format for depth textures */
-  depthStencilFormat: TextureFormat = 'depth24plus';
+  readonly depthStencilFormat: TextureFormat = 'depth24plus';
 
   private depthStencilAttachment: Texture | null = null;
 

package/src/adapter/webgpu-device.ts

@@ -30,7 +30,7 @@ import type {
   QuerySet,
   QuerySetProps
 } from '@luma.gl/core';
-import {Device, DeviceFeatures, CanvasContext, log, uid} from '@luma.gl/core';
+import {Device, DeviceFeatures} from '@luma.gl/core';
 import {WebGPUBuffer} from './resources/webgpu-buffer';
 import {WebGPUTexture} from './resources/webgpu-texture';
 import {WebGPUExternalTexture} from './resources/webgpu-external-texture';
@@ -49,8 +49,6 @@ import {WebGPUQuerySet} from './resources/webgpu-query-set';
 
 /** WebGPU Device implementation */
 export class WebGPUDevice extends Device {
-  static type: string = 'webgpu';
-
   /** type of this device */
   readonly type = 'webgpu';
 
@@ -72,71 +70,13 @@ export class WebGPUDevice extends Device {
   commandEncoder: GPUCommandEncoder | null = null;
   renderPass: WebGPURenderPass | null = null;
 
-  /** Check if WebGPU is available */
-  static isSupported(): boolean {
-    return Boolean(typeof navigator !== 'undefined' && navigator.gpu);
-  }
-
-  static async create(props: DeviceProps): Promise<WebGPUDevice> {
-    if (!navigator.gpu) {
-      throw new Error(
-        'WebGPU not available. Open in Chrome Canary and turn on chrome://flags/#enable-unsafe-webgpu'
-      );
-    }
-    log.groupCollapsed(1, 'WebGPUDevice created')();
-    const adapter = await navigator.gpu.requestAdapter({
-      powerPreference: 'high-performance'
-      // forceSoftware: false
-    });
-    if (!adapter) {
-      throw new Error('Failed to request WebGPU adapter');
-    }
-
-    const adapterInfo = await adapter.requestAdapterInfo();
-    log.probe(2, 'Adapter available', adapterInfo)();
-
-    const requiredFeatures: GPUFeatureName[] = [];
-    const requiredLimits: Record<string, number> = {};
-
-    if (props.requestMaxLimits) {
-      requiredFeatures.push(...(Array.from(adapter.features) as GPUFeatureName[]));
-      for (const key in adapter.limits) {
-        requiredLimits[key] = adapter.limits[key];
-      }
-      delete requiredLimits.minSubgroupSize;
-      delete requiredLimits.maxSubgroupSize;
-    }
-
-    const gpuDevice = await adapter.requestDevice({
-      requiredFeatures,
-      requiredLimits
-    });
-
-    log.probe(1, 'GPUDevice available')();
-
-    if (typeof props.canvas === 'string') {
-      await CanvasContext.pageLoaded;
-      log.probe(1, 'DOM is loaded')();
-    }
-
-    const device = new WebGPUDevice(gpuDevice, adapter, adapterInfo, props);
-
-    log.probe(
-      1,
-      'Device created. For more info, set chrome://flags/#enable-webgpu-developer-features'
-    )();
-    log.table(1, device.info)();
-    log.groupEnd(1)();
-    return device;
-  }
-
   constructor(
+    props: DeviceProps,
     device: GPUDevice,
     adapter: GPUAdapter,
-    adapterInfo: GPUAdapterInfo,
-    props: DeviceProps
+    adapterInfo: GPUAdapterInfo
   ) {
-    super({...props, id: props.id || uid('webgpu-device')});
+    super({...props, id: props.id || 'webgpu-device'});
     this.handle = device;
     this.adapter = adapter;
     this.adapterInfo = adapterInfo;
@@ -145,6 +85,14 @@ export class WebGPUDevice extends Device {
     this.features = this._getFeatures();
     this.limits = this.handle.limits;
 
+    // Listen for uncaptured WebGPU errors
+    device.addEventListener('uncapturederror', (event: Event) => {
+      // TODO is this the right way to make sure the error is an Error instance?
+      const errorMessage =
+        event instanceof GPUUncapturedErrorEvent ? event.error.message : 'Unknown error';
+      this.error(new Error(errorMessage));
+    });
+
     // "Context" loss handling
     this.lost = new Promise<{reason: 'destroyed'; message: string}>(async resolve => {
       const lostInfo = await this.handle.lost;

package/src/index.ts

@@ -3,9 +3,11 @@
 // Copyright (c) vis.gl contributors
 
 // WEBGPU ADAPTER
-export {WebGPUDevice} from './adapter/webgpu-device';
+export type {WebGPUAdapter} from './adapter/webgpu-adapter';
+export {webgpuAdapter} from './adapter/webgpu-adapter';
 
 // WEBGPU CLASSES (typically not accessed directly)
+export {WebGPUDevice} from './adapter/webgpu-device';
 export {WebGPUBuffer} from './adapter/resources/webgpu-buffer';
 export {WebGPUTexture} from './adapter/resources/webgpu-texture';
 export {WebGPUSampler} from './adapter/resources/webgpu-sampler';