@luma.gl/webgpu 9.2.0-alpha.1 → 9.2.0-alpha.2

package/dist/dist.dev.js

@@ -49,9 +49,6 @@ var __exports__ = (() => {
   });
 
   // src/adapter/resources/webgpu-buffer.ts
-  function getByteLength(props) {
-    return props.byteLength || props.data?.byteLength || 0;
-  }
   var import_core, WebGPUBuffer;
   var init_webgpu_buffer = __esm({
     "src/adapter/resources/webgpu-buffer.ts"() {
@@ -64,76 +61,151 @@ var __exports__ = (() => {
         constructor(device, props) {
           super(device, props);
           this.device = device;
-          this.byteLength = getByteLength(props);
-          const mapBuffer = Boolean(props.data);
+          this.byteLength = props.byteLength || props.data?.byteLength || 0;
+          const mappedAtCreation = Boolean(this.props.onMapped || props.data);
           const size = Math.ceil(this.byteLength / 4) * 4;
-          this.device.handle.pushErrorScope("out-of-memory");
-          this.device.handle.pushErrorScope("validation");
+          this.device.pushErrorScope("out-of-memory");
+          this.device.pushErrorScope("validation");
           this.handle = this.props.handle || this.device.handle.createBuffer({
-            size,
+            label: this.props.id,
             // usage defaults to vertex
             usage: this.props.usage || GPUBufferUsage.VERTEX | GPUBufferUsage.COPY_DST,
-            mappedAtCreation: this.props.mappedAtCreation || mapBuffer,
-            label: this.props.id
+            mappedAtCreation,
+            size
           });
-          this.device.handle.popErrorScope().then((error) => {
-            if (error) {
-              this.device.reportError(new Error(`Buffer validation failed: ${error.message}`), this);
-            }
+          this.device.popErrorScope((error) => {
+            this.device.reportError(new Error(`${this} creation failed ${error.message}`), this)();
+            this.device.debug();
           });
-          this.device.handle.popErrorScope().then((error) => {
-            if (error) {
-              this.device.reportError(new Error(`Buffer out of memory: ${error.message}`), this);
-            }
+          this.device.popErrorScope((error) => {
+            this.device.reportError(new Error(`${this} out of memory: ${error.message}`), this)();
+            this.device.debug();
           });
-          if (props.data) {
-            this._writeMapped(props.data);
-          }
-          if (mapBuffer && !props.mappedAtCreation) {
-            this.handle.unmap();
+          this.device.pushErrorScope("validation");
+          if (props.data || props.onMapped) {
+            try {
+              const arrayBuffer = this.handle.getMappedRange();
+              if (props.data) {
+                const typedArray = props.data;
+                new typedArray.constructor(arrayBuffer).set(typedArray);
+              } else {
+                props.onMapped?.(arrayBuffer, "mapped");
+              }
+            } finally {
+              this.handle.unmap();
+            }
           }
+          this.device.popErrorScope((error) => {
+            this.device.reportError(new Error(`${this} creation failed ${error.message}`), this)();
+            this.device.debug();
+          });
         }
         destroy() {
           this.handle?.destroy();
           this.handle = null;
         }
-        // WebGPU provides multiple ways to write a buffer...
         write(data, byteOffset = 0) {
+          const arrayBuffer = ArrayBuffer.isView(data) ? data.buffer : data;
+          const dataByteOffset = ArrayBuffer.isView(data) ? data.byteOffset : 0;
+          this.device.pushErrorScope("validation");
           this.device.handle.queue.writeBuffer(
             this.handle,
             byteOffset,
-            data.buffer,
-            data.byteOffset,
+            arrayBuffer,
+            dataByteOffset,
             data.byteLength
           );
+          this.device.popErrorScope((error) => {
+            this.device.reportError(new Error(`${this}.write() ${error.message}`), this)();
+            this.device.debug();
+          });
+        }
+        async mapAndWriteAsync(callback, byteOffset = 0, byteLength = this.byteLength - byteOffset) {
+          const isMappable = (this.usage & import_core.Buffer.MAP_WRITE) !== 0;
+          const mappableBuffer = !isMappable ? this._getMappableBuffer(import_core.Buffer.MAP_WRITE | import_core.Buffer.COPY_SRC, 0, this.byteLength) : null;
+          const writeBuffer = mappableBuffer || this;
+          this.device.pushErrorScope("validation");
+          try {
+            await this.device.handle.queue.onSubmittedWorkDone();
+            await writeBuffer.handle.mapAsync(GPUMapMode.WRITE, byteOffset, byteLength);
+            const arrayBuffer = writeBuffer.handle.getMappedRange(byteOffset, byteLength);
+            await callback(arrayBuffer, "mapped");
+            writeBuffer.handle.unmap();
+            if (mappableBuffer) {
+              this._copyBuffer(mappableBuffer, byteOffset, byteLength);
+            }
+          } finally {
+            this.device.popErrorScope((error) => {
+              this.device.reportError(new Error(`${this}.mapAndWriteAsync() ${error.message}`), this)();
+              this.device.debug();
+            });
+            mappableBuffer?.destroy();
+          }
         }
-        async readAsync(byteOffset = 0, byteLength = this.byteLength) {
-          const tempBuffer = new WebGPUBuffer(this.device, {
-            usage: import_core.Buffer.MAP_READ | import_core.Buffer.COPY_DST,
+        async readAsync(byteOffset = 0, byteLength = this.byteLength - byteOffset) {
+          return this.mapAndReadAsync(
+            (arrayBuffer) => new Uint8Array(arrayBuffer.slice(0)),
+            byteOffset,
             byteLength
-          });
-          const commandEncoder = this.device.handle.createCommandEncoder();
-          commandEncoder.copyBufferToBuffer(this.handle, byteOffset, tempBuffer.handle, 0, byteLength);
-          this.device.handle.queue.submit([commandEncoder.finish()]);
-          await tempBuffer.handle.mapAsync(GPUMapMode.READ, byteOffset, byteLength);
-          const arrayBuffer = tempBuffer.handle.getMappedRange().slice(0);
-          tempBuffer.handle.unmap();
-          tempBuffer.destroy();
-          return new Uint8Array(arrayBuffer);
+          );
         }
-        _writeMapped(typedArray) {
-          const arrayBuffer = this.handle.getMappedRange();
-          new typedArray.constructor(arrayBuffer).set(typedArray);
+        async mapAndReadAsync(callback, byteOffset = 0, byteLength = this.byteLength - byteOffset) {
+          if (byteOffset % 8 !== 0 || byteLength % 4 !== 0) {
+            throw new Error("byteOffset must be multiple of 8 and byteLength multiple of 4");
+          }
+          if (byteOffset + byteLength > this.handle.size) {
+            throw new Error("Mapping range exceeds buffer size");
+          }
+          const isMappable = (this.usage & import_core.Buffer.MAP_READ) !== 0;
+          const mappableBuffer = !isMappable ? this._getMappableBuffer(import_core.Buffer.MAP_READ | import_core.Buffer.COPY_DST, 0, this.byteLength) : null;
+          const readBuffer = mappableBuffer || this;
+          this.device.pushErrorScope("validation");
+          try {
+            await this.device.handle.queue.onSubmittedWorkDone();
+            if (mappableBuffer) {
+              mappableBuffer._copyBuffer(this);
+            }
+            await readBuffer.handle.mapAsync(GPUMapMode.READ, byteOffset, byteLength);
+            const arrayBuffer = readBuffer.handle.getMappedRange(byteOffset, byteLength);
+            const result = await callback(arrayBuffer, "mapped");
+            readBuffer.handle.unmap();
+            return result;
+          } finally {
+            this.device.popErrorScope((error) => {
+              this.device.reportError(new Error(`${this}.mapAndReadAsync() ${error.message}`), this)();
+              this.device.debug();
+            });
+            mappableBuffer?.destroy();
+          }
         }
-        // WEBGPU API
-        mapAsync(mode, offset = 0, size) {
-          return this.handle.mapAsync(mode, offset, size);
+        readSyncWebGL(byteOffset, byteLength) {
+          throw new Error("Not implemented");
         }
-        getMappedRange(offset = 0, size) {
-          return this.handle.getMappedRange(offset, size);
+        // INTERNAL METHODS
+        /**
+         * @todo - A small set of mappable buffers could be cached on the device,
+         * however this goes against the goal of keeping core as a thin GPU API layer.
+         */
+        _getMappableBuffer(usage, byteOffset, byteLength) {
+          import_core.log.warn(`${this} is not readable, creating a temporary Buffer`);
+          const readableBuffer = new WebGPUBuffer(this.device, { usage, byteLength });
+          return readableBuffer;
         }
-        unmap() {
-          this.handle.unmap();
+        _copyBuffer(sourceBuffer, byteOffset = 0, byteLength = this.byteLength) {
+          this.device.pushErrorScope("validation");
+          const commandEncoder = this.device.handle.createCommandEncoder();
+          commandEncoder.copyBufferToBuffer(
+            sourceBuffer.handle,
+            byteOffset,
+            this.handle,
+            byteOffset,
+            byteLength
+          );
+          this.device.handle.queue.submit([commandEncoder.finish()]);
+          this.device.popErrorScope((error) => {
+            this.device.reportError(new Error(`${this}._getReadableBuffer() ${error.message}`), this)();
+            this.device.debug();
+          });
         }
       };
     }
@@ -209,10 +281,9 @@ var __exports__ = (() => {
             baseArrayLayer: this.props.baseArrayLayer,
             arrayLayerCount: this.props.arrayLayerCount
           });
-          this.device.handle.popErrorScope().then((error) => {
-            if (error) {
-              this.device.reportError(new Error(`TextureView validation failed: ${error.message}`), this);
-            }
+          this.device.popErrorScope((error) => {
+            this.device.reportError(new Error(`TextureView constructor: ${error.message}`), this)();
+            this.device.debug();
           });
           this.handle.label = this.props.id;
         }
@@ -243,8 +314,8 @@ var __exports__ = (() => {
           if (this.dimension === "cube") {
             this.depth = 6;
           }
-          this.device.handle.pushErrorScope("out-of-memory");
-          this.device.handle.pushErrorScope("validation");
+          this.device.pushErrorScope("out-of-memory");
+          this.device.pushErrorScope("validation");
           this.handle = this.props.handle || this.device.handle.createTexture({
             label: this.id,
             size: {
@@ -258,15 +329,13 @@ var __exports__ = (() => {
             mipLevelCount: this.mipLevels,
             sampleCount: this.props.samples
           });
-          this.device.handle.popErrorScope().then((error) => {
-            if (error) {
-              this.device.reportError(new Error(`Texture validation failed: ${error.message}`), this);
-            }
+          this.device.popErrorScope((error) => {
+            this.device.reportError(new Error(`${this} constructor: ${error.message}`), this)();
+            this.device.debug();
           });
-          this.device.handle.popErrorScope().then((error) => {
-            if (error) {
-              this.device.reportError(new Error(`Texture out of memory: ${error.message}`), this);
-            }
+          this.device.popErrorScope((error) => {
+            this.device.reportError(new Error(`${this} out of memory: ${error.message}`), this)();
+            this.device.debug();
           });
           if (this.props.handle) {
             this.handle.label ||= this.id;
@@ -278,7 +347,8 @@ var __exports__ = (() => {
             ...this.props,
             texture: this,
             mipLevelCount: this.mipLevels,
-            arrayLayerCount: this.depth
+            // Note: arrayLayerCount controls the view of array textures, but does not apply to 3d texture depths
+            arrayLayerCount: this.dimension !== "3d" ? this.depth : 1
           });
           this._initializeData(props.data);
         }
@@ -292,7 +362,7 @@ var __exports__ = (() => {
         copyImageData(options_) {
           const { width, height, depth } = this;
           const options = this._normalizeCopyImageDataOptions(options_);
-          this.device.handle.pushErrorScope("validation");
+          this.device.pushErrorScope("validation");
           this.device.handle.queue.writeTexture(
             // destination: GPUImageCopyTexture
             {
@@ -314,15 +384,14 @@ var __exports__ = (() => {
             // size: GPUExtent3D - extents of the content to write
             [width, height, depth]
           );
-          this.device.handle.popErrorScope().then((error) => {
-            if (error) {
-              this.device.reportError(new Error(`copyImageData validation failed: ${error.message}`));
-            }
+          this.device.popErrorScope((error) => {
+            this.device.reportError(new Error(`copyImageData: ${error.message}`), this)();
+            this.device.debug();
           });
         }
         copyExternalImage(options_) {
           const options = this._normalizeCopyExternalImageOptions(options_);
-          this.device.handle.pushErrorScope("validation");
+          this.device.pushErrorScope("validation");
           this.device.handle.queue.copyExternalImageToTexture(
             // source: GPUImageCopyExternalImage
             {
@@ -333,7 +402,8 @@ var __exports__ = (() => {
             // destination: GPUImageCopyTextureTagged
             {
               texture: this.handle,
-              origin: [options.x, options.y, options.depth],
+              origin: [options.x, options.y, 0],
+              // options.depth],
               mipLevel: options.mipLevel,
               aspect: options.aspect,
               colorSpace: options.colorSpace,
@@ -342,10 +412,9 @@ var __exports__ = (() => {
             // copySize: GPUExtent3D
             [options.width, options.height, 1]
           );
-          this.device.handle.popErrorScope().then((error) => {
-            if (error) {
-              this.device.reportError(new Error(`copyExternalImage validation failed: ${error.message}`));
-            }
+          this.device.popErrorScope((error) => {
+            this.device.reportError(new Error(`copyExternalImage: ${error.message}`), this)();
+            this.device.debug();
           });
           return { width: options.width, height: options.height };
         }
@@ -370,7 +439,7 @@ var __exports__ = (() => {
             device.submit([encoder.finish()]);
         
             // Get the data on the CPU.
-            await buffer.mapAsync(GPUMapMode.READ);
+            await buffer.mapAndReadAsync(GPUMapMode.READ);
             saveScreenshot(buffer.getMappedRange());
             buffer.unmap();
           }
@@ -471,13 +540,16 @@ var __exports__ = (() => {
           if (this.props.language === "glsl" || isGLSL) {
             throw new Error("GLSL shaders are not supported in WebGPU");
           }
-          this.device.handle.pushErrorScope("validation");
+          this.device.pushErrorScope("validation");
           this.handle = this.props.handle || this.device.handle.createShaderModule({ code: props.source });
-          this.device.handle.popErrorScope().then((error) => {
-            if (error) {
-              import_core6.log.error(`${this} creation failed:
-"${error.message}"`, this, this.props.source)();
-            }
+          this.device.popErrorScope((error) => {
+            this.device.reportError(
+              new Error(`${this} creation failed:
+"${error.message}"`),
+              this,
+              this.props.source
+            )();
+            this.device.debug();
           });
           this.handle.label = this.props.id;
           this._checkCompilationError();
@@ -491,7 +563,8 @@ var __exports__ = (() => {
           this.compilationStatus = hasErrors ? "error" : "success";
           this.debugShader();
           if (this.compilationStatus === "error") {
-            import_core6.log.error(`Shader compilation error`, shaderLog)();
+            this.device.reportError(new Error(`Shader compilation error`), this, shaderLog)();
+            this.device.debug();
           }
         }
         destroy() {
@@ -527,6 +600,9 @@ var __exports__ = (() => {
     const depthStencil = addDepthStencil(descriptor);
     return depthStencil.stencilBack;
   }
+  function notSupported(key, value, descriptor) {
+    import_core7.log.warn(`${key} parameter not supported in WebGPU`)();
+  }
   function applyParametersToRenderPipelineDescriptor(pipelineDescriptor, parameters = {}) {
     Object.assign(pipelineDescriptor, { ...DEFAULT_PIPELINE_DESCRIPTOR, ...pipelineDescriptor });
     setParameters(pipelineDescriptor, parameters);
@@ -534,31 +610,33 @@ var __exports__ = (() => {
   function setParameters(pipelineDescriptor, parameters) {
     for (const [key, value] of Object.entries(parameters)) {
       const setterFunction = PARAMETER_TABLE[key];
-      if (!setterFunction) {
-        throw new Error(`Illegal parameter ${key}`);
+      if (setterFunction) {
+        setterFunction(key, value, pipelineDescriptor);
+      } else {
+        import_core7.log.error(`Illegal parameter ${key} in WebGPU`)();
       }
-      setterFunction(key, value, pipelineDescriptor);
     }
   }
   function addColorState(descriptor, attachment) {
     descriptor.fragment.targets = descriptor.fragment?.targets || [];
     if (!Array.isArray(descriptor.fragment?.targets)) {
-      throw new Error("colorstate");
+      import_core7.log.warn("parameters: no targets array")();
     }
     if (descriptor.fragment?.targets?.length === 0) {
       descriptor.fragment.targets?.push({});
     }
-    return descriptor.fragment?.targets[0];
+    return descriptor.fragment?.targets?.[0];
   }
   function addBlendState(descriptor, attachment) {
     const target = addColorState(descriptor, attachment);
     target.blend = target.blend || { color: {}, alpha: {} };
     return target.blend;
   }
-  var PARAMETER_TABLE, DEFAULT_PIPELINE_DESCRIPTOR;
+  var import_core7, PARAMETER_TABLE, DEFAULT_PIPELINE_DESCRIPTOR;
   var init_webgpu_parameters = __esm({
     "src/adapter/helpers/webgpu-parameters.ts"() {
       "use strict";
+      import_core7 = __toESM(require_core(), 1);
       PARAMETER_TABLE = {
         // RASTERIZATION PARAMETERS
         cullMode: (_, value, descriptor) => {
@@ -680,7 +758,19 @@ var __exports__ = (() => {
           const blend = addBlendState(descriptor, 0);
           blend.alpha = blend.alpha || {};
           blend.alpha.dstFactor = value;
-        }
+        },
+        unclippedDepth: notSupported,
+        provokingVertex: notSupported,
+        polygonMode: notSupported,
+        polygonOffsetLine: notSupported,
+        clipDistance0: notSupported,
+        clipDistance1: notSupported,
+        clipDistance2: notSupported,
+        clipDistance3: notSupported,
+        clipDistance4: notSupported,
+        clipDistance5: notSupported,
+        clipDistance6: notSupported,
+        clipDistance7: notSupported
       };
       DEFAULT_PIPELINE_DESCRIPTOR = {
         // depthStencil: {
@@ -720,17 +810,17 @@ var __exports__ = (() => {
     });
     device.popErrorScope().then((error) => {
       if (error) {
-        import_core7.log.error(`createBindGroup validation failed: ${error.message}`)();
+        import_core8.log.error(`bindGroup creation: ${error.message}`, bindGroup)();
       }
     });
     return bindGroup;
   }
   function getShaderLayoutBinding(shaderLayout, bindingName, options) {
     const bindingLayout = shaderLayout.bindings.find(
-      (binding) => binding.name === bindingName || `${binding.name}uniforms` === bindingName.toLocaleLowerCase()
+      (binding) => binding.name === bindingName || `${binding.name.toLocaleLowerCase()}uniforms` === bindingName.toLocaleLowerCase()
     );
     if (!bindingLayout && !options?.ignoreWarnings) {
-      import_core7.log.warn(`Binding ${bindingName} not set: Not found in shader layout.`)();
+      import_core8.log.warn(`Binding ${bindingName} not set: Not found in shader layout.`)();
     }
     return bindingLayout || null;
   }
@@ -744,7 +834,7 @@ var __exports__ = (() => {
           entries.push(entry);
         }
       }
-      if (value instanceof import_core7.Texture) {
+      if (value instanceof import_core8.Texture) {
         bindingLayout = getShaderLayoutBinding(shaderLayout, `${bindingName}Sampler`, {
           ignoreWarnings: true
         });
@@ -759,7 +849,7 @@ var __exports__ = (() => {
     return entries;
   }
   function getBindGroupEntry(binding, index, options) {
-    if (binding instanceof import_core7.Buffer) {
+    if (binding instanceof import_core8.Buffer) {
       return {
         binding: index,
         resource: {
@@ -767,13 +857,13 @@ var __exports__ = (() => {
         }
       };
     }
-    if (binding instanceof import_core7.Sampler) {
+    if (binding instanceof import_core8.Sampler) {
       return {
         binding: index,
         resource: binding.handle
       };
     }
-    if (binding instanceof import_core7.Texture) {
+    if (binding instanceof import_core8.Texture) {
       if (options?.sampler) {
         return {
           binding: index,
@@ -785,14 +875,14 @@ var __exports__ = (() => {
         resource: binding.view.handle
       };
     }
-    import_core7.log.warn(`invalid binding ${name}`, binding);
+    import_core8.log.warn(`invalid binding ${name}`, binding);
     return null;
   }
-  var import_core7;
+  var import_core8;
   var init_get_bind_group = __esm({
     "src/adapter/helpers/get-bind-group.ts"() {
       "use strict";
-      import_core7 = __toESM(require_core(), 1);
+      import_core8 = __toESM(require_core(), 1);
     }
   });
 
@@ -810,26 +900,27 @@ var __exports__ = (() => {
       const vertexAttributes = [];
       let stepMode = "vertex";
       let byteStride = 0;
-      const format = mapping.format;
+      let format = mapping.format;
       if (mapping.attributes) {
         for (const attributeMapping of mapping.attributes) {
           const attributeName = attributeMapping.attribute;
           const attributeLayout = findAttributeLayout(shaderLayout, attributeName, usedAttributes);
           const location = 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
           });
-          byteStride += (0, import_core8.getVertexFormatInfo)(format).byteLength;
+          byteStride += (0, import_core9.getVertexFormatInfo)(format).byteLength;
         }
       } else {
         const attributeLayout = findAttributeLayout(shaderLayout, mapping.name, usedAttributes);
         if (!attributeLayout) {
           continue;
         }
-        byteStride = (0, import_core8.getVertexFormatInfo)(format).byteLength;
+        byteStride = (0, import_core9.getVertexFormatInfo)(format).byteLength;
         stepMode = attributeLayout.stepMode || (attributeLayout.name.startsWith("instance") ? "instance" : "vertex");
         vertexAttributes.push({
           format: getWebGPUVertexFormat(format),
@@ -847,7 +938,7 @@ var __exports__ = (() => {
     for (const attribute of shaderLayout.attributes) {
       if (!usedAttributes.has(attribute.name)) {
         vertexBufferLayouts.push({
-          arrayStride: (0, import_core8.getVertexFormatInfo)("float32x3").byteLength,
+          arrayStride: (0, import_core9.getVertexFormatInfo)("float32x3").byteLength,
           stepMode: attribute.stepMode || (attribute.name.startsWith("instance") ? "instance" : "vertex"),
           attributes: [
             {
@@ -859,39 +950,46 @@ var __exports__ = (() => {
         });
       }
     }
+    vertexBufferLayouts.sort((a, b) => {
+      const minLocationA = Math.min(...Array.from(a.attributes, (attr) => attr.shaderLocation));
+      const minLocationB = Math.min(...Array.from(b.attributes, (attr) => attr.shaderLocation));
+      return minLocationA - minLocationB;
+    });
     return vertexBufferLayouts;
   }
   function findAttributeLayout(shaderLayout, name2, attributeNames) {
     const attribute = shaderLayout.attributes.find((attribute_) => attribute_.name === name2);
     if (!attribute) {
-      import_core8.log.warn(`Supplied attribute not present in shader layout: ${name2}`)();
+      import_core9.log.warn(`Supplied attribute not present in shader layout: ${name2}`)();
       return null;
     }
-    if (attributeNames.has(name2)) {
-      throw new Error(`Found multiple entries for attribute: ${name2}`);
+    if (attributeNames) {
+      if (attributeNames.has(name2)) {
+        throw new Error(`Found multiple entries for attribute: ${name2}`);
+      }
+      attributeNames.add(name2);
     }
-    attributeNames.add(name2);
     return attribute;
   }
-  var import_core8;
+  var import_core9;
   var init_get_vertex_buffer_layout = __esm({
     "src/adapter/helpers/get-vertex-buffer-layout.ts"() {
       "use strict";
-      import_core8 = __toESM(require_core(), 1);
+      import_core9 = __toESM(require_core(), 1);
     }
   });
 
   // src/adapter/resources/webgpu-render-pipeline.ts
-  var import_core9, WebGPURenderPipeline;
+  var import_core10, WebGPURenderPipeline;
   var init_webgpu_render_pipeline = __esm({
     "src/adapter/resources/webgpu-render-pipeline.ts"() {
       "use strict";
-      import_core9 = __toESM(require_core(), 1);
+      import_core10 = __toESM(require_core(), 1);
       init_webgpu_parameters();
       init_convert_texture_format();
       init_get_bind_group();
       init_get_vertex_buffer_layout();
-      WebGPURenderPipeline = class extends import_core9.RenderPipeline {
+      WebGPURenderPipeline = class extends import_core10.RenderPipeline {
         device;
         handle;
         vs;
@@ -909,16 +1007,15 @@ var __exports__ = (() => {
           this.handle = this.props.handle;
           if (!this.handle) {
             const descriptor = this._getRenderPipelineDescriptor();
-            import_core9.log.groupCollapsed(1, `new WebGPURenderPipeline(${this.id})`)();
-            import_core9.log.probe(1, JSON.stringify(descriptor, null, 2))();
-            import_core9.log.groupEnd(1)();
-            this.device.handle.pushErrorScope("validation");
+            import_core10.log.groupCollapsed(1, `new WebGPURenderPipeline(${this.id})`)();
+            import_core10.log.probe(1, JSON.stringify(descriptor, null, 2))();
+            import_core10.log.groupEnd(1)();
+            this.device.pushErrorScope("validation");
             this.handle = this.device.handle.createRenderPipeline(descriptor);
-            this.device.handle.popErrorScope().then((error) => {
-              if (error) {
-                import_core9.log.error(`${this} creation failed:
-"${error.message}"`, this, this.props.vs?.source)();
-              }
+            this.device.popErrorScope((error) => {
+              this.device.reportError(new Error(`${this} creation failed:
+"${error.message}"`), this)();
+              this.device.debug();
             });
           }
           this.handle.label = this.props.id;
@@ -944,13 +1041,12 @@ var __exports__ = (() => {
         /** @todo - should this be moved to renderpass? */
         draw(options) {
           const webgpuRenderPass = options.renderPass;
-          this.device.handle.pushErrorScope("validation");
+          this.device.pushErrorScope("validation");
           webgpuRenderPass.handle.setPipeline(this.handle);
-          this.device.handle.popErrorScope().then((error) => {
-            if (error) {
-              import_core9.log.error(`${this} setPipeline failed:
-"${error.message}"`, this)();
-            }
+          this.device.popErrorScope((error) => {
+            this.device.reportError(new Error(`${this} setPipeline failed:
+"${error.message}"`), this)();
+            this.device.debug();
           });
           const bindGroup = this._getBindGroup();
           if (bindGroup) {
@@ -1007,13 +1103,16 @@ var __exports__ = (() => {
             entryPoint: this.props.fragmentEntryPoint || "main",
             targets
           };
+          const layout = this.device.createPipelineLayout({
+            shaderLayout: this.shaderLayout
+          });
           const descriptor = {
             vertex,
             fragment,
             primitive: {
               topology: this.props.topology
             },
-            layout: "auto"
+            layout: layout.handle
           };
           const depthFormat = this.props.depthStencilAttachmentFormat || this.device.preferredDepthFormat;
           if (this.props.parameters.depthWriteEnabled) {
@@ -1029,13 +1128,14 @@ var __exports__ = (() => {
   });
 
   // src/adapter/resources/webgpu-framebuffer.ts
-  var import_core10, WebGPUFramebuffer;
+  var import_core11, WebGPUFramebuffer;
   var init_webgpu_framebuffer = __esm({
     "src/adapter/resources/webgpu-framebuffer.ts"() {
       "use strict";
-      import_core10 = __toESM(require_core(), 1);
-      WebGPUFramebuffer = class extends import_core10.Framebuffer {
+      import_core11 = __toESM(require_core(), 1);
+      WebGPUFramebuffer = class extends import_core11.Framebuffer {
         device;
+        handle = null;
         colorAttachments = [];
         depthStencilAttachment = null;
         constructor(device, props) {
@@ -1050,13 +1150,13 @@ var __exports__ = (() => {
   });
 
   // src/adapter/resources/webgpu-compute-pipeline.ts
-  var import_core11, WebGPUComputePipeline;
+  var import_core12, WebGPUComputePipeline;
   var init_webgpu_compute_pipeline = __esm({
     "src/adapter/resources/webgpu-compute-pipeline.ts"() {
       "use strict";
-      import_core11 = __toESM(require_core(), 1);
+      import_core12 = __toESM(require_core(), 1);
       init_get_bind_group();
-      WebGPUComputePipeline = class extends import_core11.ComputePipeline {
+      WebGPUComputePipeline = class extends import_core12.ComputePipeline {
         device;
         handle;
         /** For internal use to create BindGroups */
@@ -1176,13 +1276,13 @@ var __exports__ = (() => {
   });
 
   // src/adapter/resources/webgpu-vertex-array.ts
-  var import_core12, WebGPUVertexArray;
+  var import_core13, WebGPUVertexArray;
   var init_webgpu_vertex_array = __esm({
     "src/adapter/resources/webgpu-vertex-array.ts"() {
       "use strict";
-      import_core12 = __toESM(require_core(), 1);
+      import_core13 = __toESM(require_core(), 1);
       init_dist();
-      WebGPUVertexArray = class extends import_core12.VertexArray {
+      WebGPUVertexArray = class extends import_core13.VertexArray {
         get [Symbol.toStringTag]() {
           return "WebGPUVertexArray";
         }
@@ -1211,7 +1311,7 @@ var __exports__ = (() => {
           const webgpuRenderPass = renderPass;
           const webgpuIndexBuffer = this.indexBuffer;
           if (webgpuIndexBuffer?.handle) {
-            import_core12.log.info(
+            import_core13.log.info(
               3,
               "setting index buffer",
               webgpuIndexBuffer?.handle,
@@ -1226,7 +1326,7 @@ var __exports__ = (() => {
           for (let location = 0; location < this.maxVertexAttributes; location++) {
             const webgpuBuffer = this.attributes[location];
             if (webgpuBuffer?.handle) {
-              import_core12.log.info(3, `setting vertex buffer ${location}`, webgpuBuffer?.handle)();
+              import_core13.log.info(3, `setting vertex buffer ${location}`, webgpuBuffer?.handle)();
               webgpuRenderPass.handle.setVertexBuffer(location, webgpuBuffer?.handle);
             }
           }
@@ -1246,13 +1346,13 @@ var __exports__ = (() => {
   });
 
   // src/adapter/webgpu-canvas-context.ts
-  var import_core13, WebGPUCanvasContext;
+  var import_core14, WebGPUCanvasContext;
   var init_webgpu_canvas_context = __esm({
     "src/adapter/webgpu-canvas-context.ts"() {
       "use strict";
-      import_core13 = __toESM(require_core(), 1);
+      import_core14 = __toESM(require_core(), 1);
       init_webgpu_framebuffer();
-      WebGPUCanvasContext = class extends import_core13.CanvasContext {
+      WebGPUCanvasContext = class extends import_core14.CanvasContext {
         device;
         handle;
         depthStencilAttachment = null;
@@ -1273,6 +1373,7 @@ var __exports__ = (() => {
         /** Destroy any textures produced while configured and remove the context configuration. */
         destroy() {
           this.handle.unconfigure();
+          super.destroy();
         }
         /** Update framebuffer with properly resized "swap chain" texture views */
         getCurrentFramebuffer(options = {
@@ -1283,7 +1384,7 @@ var __exports__ = (() => {
             const [oldWidth, oldHeight] = this.getDrawingBufferSize();
             this.drawingBufferWidth = currentColorAttachment.width;
             this.drawingBufferHeight = currentColorAttachment.height;
-            import_core13.log.log(
+            import_core14.log.log(
               1,
               `${this}: Resized to compensate for initial canvas size mismatch ${oldWidth}x${oldHeight} => ${this.drawingBufferWidth}x${this.drawingBufferHeight}px`
             )();
@@ -1327,7 +1428,7 @@ var __exports__ = (() => {
           if (!this.depthStencilAttachment) {
             this.depthStencilAttachment = this.device.createTexture({
               id: `${this.id}#depth-stencil-texture`,
-              usage: import_core13.Texture.RENDER_ATTACHMENT,
+              usage: import_core14.Texture.RENDER_ATTACHMENT,
               format: depthStencilFormat,
               width: this.drawingBufferWidth,
               height: this.drawingBufferHeight
@@ -1340,12 +1441,12 @@ var __exports__ = (() => {
   });
 
   // src/adapter/resources/webgpu-command-buffer.ts
-  var import_core14, WebGPUCommandBuffer;
+  var import_core15, WebGPUCommandBuffer;
   var init_webgpu_command_buffer = __esm({
     "src/adapter/resources/webgpu-command-buffer.ts"() {
       "use strict";
-      import_core14 = __toESM(require_core(), 1);
-      WebGPUCommandBuffer = class extends import_core14.CommandBuffer {
+      import_core15 = __toESM(require_core(), 1);
+      WebGPUCommandBuffer = class extends import_core15.CommandBuffer {
         device;
         handle;
         constructor(commandEncoder, props) {
@@ -1360,12 +1461,15 @@ var __exports__ = (() => {
   });
 
   // src/adapter/resources/webgpu-render-pass.ts
-  var import_core15, WebGPURenderPass;
+  function convertColor(color) {
+    return { r: color[0], g: color[1], b: color[2], a: color[3] };
+  }
+  var import_core16, WebGPURenderPass;
   var init_webgpu_render_pass = __esm({
     "src/adapter/resources/webgpu-render-pass.ts"() {
       "use strict";
-      import_core15 = __toESM(require_core(), 1);
-      WebGPURenderPass = class extends import_core15.RenderPass {
+      import_core16 = __toESM(require_core(), 1);
+      WebGPURenderPass = class extends import_core16.RenderPass {
         device;
         handle;
         /** Active pipeline */
@@ -1390,18 +1494,17 @@ var __exports__ = (() => {
           if (!device.commandEncoder) {
             throw new Error("commandEncoder not available");
           }
-          this.device.handle.pushErrorScope("validation");
+          this.device.pushErrorScope("validation");
           this.handle = this.props.handle || device.commandEncoder.handle.beginRenderPass(renderPassDescriptor);
-          this.device.handle.popErrorScope().then((error) => {
-            if (error) {
-              import_core15.log.error(`${this} creation failed:
-"${error.message}"`, this)();
-            }
+          this.device.popErrorScope((error) => {
+            this.device.reportError(new Error(`${this} creation failed:
+"${error.message}"`), this)();
+            this.device.debug();
           });
           this.handle.label = this.props.id;
-          import_core15.log.groupCollapsed(3, `new WebGPURenderPass(${this.id})`)();
-          import_core15.log.probe(3, JSON.stringify(renderPassDescriptor, null, 2))();
-          import_core15.log.groupEnd(3)();
+          import_core16.log.groupCollapsed(3, `new WebGPURenderPass(${this.id})`)();
+          import_core16.log.probe(3, JSON.stringify(renderPassDescriptor, null, 2))();
+          import_core16.log.groupEnd(3)();
         }
         destroy() {
         }
@@ -1410,7 +1513,13 @@ var __exports__ = (() => {
         }
         setPipeline(pipeline) {
           this.pipeline = pipeline;
+          this.device.pushErrorScope("validation");
           this.handle.setPipeline(this.pipeline.handle);
+          this.device.popErrorScope((error) => {
+            this.device.reportError(new Error(`${this} setPipeline failed:
+"${error.message}"`), this)();
+            this.device.debug();
+          });
         }
         /** Sets an array of bindings (uniform buffers, samplers, textures, ...) */
         setBindings(bindings) {
@@ -1463,8 +1572,8 @@ var __exports__ = (() => {
               viewport[1],
               viewport[2],
               viewport[3],
-              viewport[4],
-              viewport[5]
+              viewport[4] ?? 0,
+              viewport[5] ?? 1
             );
           }
         }
@@ -1497,7 +1606,9 @@ var __exports__ = (() => {
             (colorAttachment, index) => ({
               // clear values
               loadOp: this.props.clearColor !== false ? "clear" : "load",
-              colorClearValue: this.props.clearColors?.[index] || this.props.clearColor || import_core15.RenderPass.defaultClearColor,
+              clearValue: convertColor(
+                this.props.clearColors?.[index] || this.props.clearColor || import_core16.RenderPass.defaultClearColor
+              ),
               storeOp: this.props.discard ? "discard" : "store",
               // ...colorAttachment,
               view: colorAttachment.handle
@@ -1532,12 +1643,12 @@ var __exports__ = (() => {
   });
 
   // src/adapter/resources/webgpu-compute-pass.ts
-  var import_core16, WebGPUComputePass;
+  var import_core17, WebGPUComputePass;
   var init_webgpu_compute_pass = __esm({
     "src/adapter/resources/webgpu-compute-pass.ts"() {
       "use strict";
-      import_core16 = __toESM(require_core(), 1);
-      WebGPUComputePass = class extends import_core16.ComputePass {
+      import_core17 = __toESM(require_core(), 1);
+      WebGPUComputePass = class extends import_core17.ComputePass {
         device;
         handle;
         _webgpuPipeline = null;
@@ -1614,15 +1725,15 @@ var __exports__ = (() => {
   });
 
   // src/adapter/resources/webgpu-command-encoder.ts
-  var import_core17, WebGPUCommandEncoder;
+  var import_core18, WebGPUCommandEncoder;
   var init_webgpu_command_encoder = __esm({
     "src/adapter/resources/webgpu-command-encoder.ts"() {
       "use strict";
-      import_core17 = __toESM(require_core(), 1);
+      import_core18 = __toESM(require_core(), 1);
       init_webgpu_command_buffer();
       init_webgpu_render_pass();
       init_webgpu_compute_pass();
-      WebGPUCommandEncoder = class extends import_core17.CommandEncoder {
+      WebGPUCommandEncoder = class extends import_core18.CommandEncoder {
         device;
         handle;
         constructor(device, props = {}) {
@@ -1638,9 +1749,16 @@ var __exports__ = (() => {
         destroy() {
         }
         finish(props) {
-          return new WebGPUCommandBuffer(this, {
+          this.device.pushErrorScope("validation");
+          const commandBuffer = new WebGPUCommandBuffer(this, {
             id: props?.id || "unnamed-command-buffer"
           });
+          this.device.popErrorScope((error) => {
+            const message = `${this} command encoding: ${error.message}. Maybe add depthWriteEnabled to your Model?`;
+            this.device.reportError(new Error(message), this)();
+            this.device.debug();
+          });
+          return commandBuffer;
         }
         /**
          * Allows a render pass to begin against a canvas context
@@ -1718,12 +1836,12 @@ var __exports__ = (() => {
   });
 
   // src/adapter/resources/webgpu-query-set.ts
-  var import_core18, WebGPUQuerySet;
+  var import_core19, WebGPUQuerySet;
   var init_webgpu_query_set = __esm({
     "src/adapter/resources/webgpu-query-set.ts"() {
       "use strict";
-      import_core18 = __toESM(require_core(), 1);
-      WebGPUQuerySet = class extends import_core18.QuerySet {
+      import_core19 = __toESM(require_core(), 1);
+      WebGPUQuerySet = class extends import_core19.QuerySet {
         device;
         handle;
         constructor(device, props) {
@@ -1743,16 +1861,119 @@ var __exports__ = (() => {
     }
   });
 
+  // src/adapter/resources/webgpu-pipeline-layout.ts
+  var import_core20, WebGPUPipelineLayout, isStorageTextureBindingLayout;
+  var init_webgpu_pipeline_layout = __esm({
+    "src/adapter/resources/webgpu-pipeline-layout.ts"() {
+      "use strict";
+      import_core20 = __toESM(require_core(), 1);
+      WebGPUPipelineLayout = class extends import_core20.PipelineLayout {
+        device;
+        handle;
+        constructor(device, props) {
+          super(device, props);
+          this.device = device;
+          const bindGroupEntries = this.mapShaderLayoutToBindGroupEntries();
+          this.handle = this.device.handle.createPipelineLayout({
+            label: props?.id ?? "unnamed-pipeline-layout",
+            bindGroupLayouts: [
+              // TODO (kaapp): We can cache these to re-use them across
+              // layers, particularly if using a separate group for injected
+              // bindings (e.g. project/lighting)
+              this.device.handle.createBindGroupLayout({
+                label: "bind-group-layout",
+                entries: bindGroupEntries
+              })
+            ]
+          });
+        }
+        destroy() {
+          this.handle = null;
+        }
+        mapShaderLayoutToBindGroupEntries() {
+          const bindGroupEntries = [];
+          for (let i = 0; i < this.props.shaderLayout.bindings.length; i++) {
+            const binding = this.props.shaderLayout.bindings[i];
+            const bindingTypeInfo = {};
+            switch (binding.type) {
+              case "uniform": {
+                bindingTypeInfo.buffer = {
+                  type: "uniform",
+                  hasDynamicOffset: binding.hasDynamicOffset,
+                  minBindingSize: binding.minBindingSize
+                };
+                break;
+              }
+              case "read-only-storage": {
+                bindingTypeInfo.buffer = {
+                  type: "read-only-storage",
+                  hasDynamicOffset: binding.hasDynamicOffset,
+                  minBindingSize: binding.minBindingSize
+                };
+                break;
+              }
+              case "sampler": {
+                bindingTypeInfo.sampler = {
+                  type: binding.samplerType
+                };
+                break;
+              }
+              case "storage": {
+                if (isStorageTextureBindingLayout(binding)) {
+                  bindingTypeInfo.storageTexture = {
+                    // TODO (kaapp): Not all formats in the binding layout are supported
+                    // by WebGPU, but at least it will provide a clear error for now.
+                    format: binding.format,
+                    access: binding.access,
+                    viewDimension: binding.viewDimension
+                  };
+                } else {
+                  bindingTypeInfo.buffer = {
+                    type: "storage",
+                    hasDynamicOffset: binding.hasDynamicOffset,
+                    minBindingSize: binding.minBindingSize
+                  };
+                }
+                break;
+              }
+              case "texture": {
+                bindingTypeInfo.texture = {
+                  multisampled: binding.multisampled,
+                  sampleType: binding.sampleType,
+                  viewDimension: binding.viewDimension
+                };
+                break;
+              }
+              default: {
+                import_core20.log.warn("unhandled binding type when creating pipeline descriptor")();
+              }
+            }
+            const VISIBILITY_ALL = GPUShaderStage.VERTEX | GPUShaderStage.FRAGMENT | GPUShaderStage.COMPUTE;
+            bindGroupEntries.push({
+              binding: binding.location,
+              visibility: binding.visibility || VISIBILITY_ALL,
+              ...bindingTypeInfo
+            });
+          }
+          return bindGroupEntries;
+        }
+      };
+      isStorageTextureBindingLayout = (maybe) => {
+        return maybe.format !== void 0;
+      };
+    }
+  });
+
   // src/adapter/webgpu-device.ts
   var webgpu_device_exports = {};
   __export(webgpu_device_exports, {
     WebGPUDevice: () => WebGPUDevice
   });
-  var import_core19, WebGPUDevice;
+  var import_core21, WebGPUDevice;
   var init_webgpu_device = __esm({
     "src/adapter/webgpu-device.ts"() {
       "use strict";
-      import_core19 = __toESM(require_core(), 1);
+      import_core21 = __toESM(require_core(), 1);
       init_webgpu_buffer();
       init_webgpu_texture();
       init_webgpu_external_texture();
@@ -1765,9 +1986,14 @@ var __exports__ = (() => {
       init_webgpu_canvas_context();
       init_webgpu_command_encoder();
       init_webgpu_query_set();
-      WebGPUDevice = class extends import_core19.Device {
+      init_webgpu_pipeline_layout();
+      WebGPUDevice = class extends import_core21.Device {
         /** The underlying WebGPU device */
         handle;
+        /* The underlying WebGPU adapter */
+        adapter;
+        /* The underlying WebGPU adapter's info */
+        adapterInfo;
         /** type of this device */
         type = "webgpu";
         preferredColorFormat = navigator.gpu.getPreferredCanvasFormat();
@@ -1779,10 +2005,12 @@ var __exports__ = (() => {
         canvasContext = null;
         _isLost = false;
         commandEncoder;
-        /* The underlying WebGPU adapter */
-        adapter;
-        /* The underlying WebGPU adapter's info */
-        adapterInfo;
+        get [Symbol.toStringTag]() {
+          return "WebGPUDevice";
+        }
+        toString() {
+          return `WebGPUDevice(${this.id})`;
+        }
         constructor(props, device, adapter, adapterInfo) {
           super({ ...props, id: props.id || "webgpu-device" });
           this.handle = device;
@@ -1794,18 +2022,16 @@ var __exports__ = (() => {
           device.addEventListener("uncapturederror", (event) => {
             event.preventDefault();
             const errorMessage = event instanceof GPUUncapturedErrorEvent ? event.error.message : "Unknown WebGPU error";
-            this.reportError(new Error(errorMessage));
-            if (this.props.debug) {
-              debugger;
-            }
+            this.reportError(new Error(errorMessage), this)();
+            this.debug();
           });
           this.lost = new Promise(async (resolve) => {
             const lostInfo = await this.handle.lost;
             this._isLost = true;
             resolve({ reason: "destroyed", message: lostInfo.message });
           });
-          if (props.createCanvasContext) {
-            const canvasContextProps = props.createCanvasContext === true ? {} : props.createCanvasContext;
+          const canvasContextProps = import_core21.Device._getCanvasContextProps(props);
+          if (canvasContextProps) {
             this.canvasContext = new WebGPUCanvasContext(this, this.adapter, canvasContextProps);
           }
           this.commandEncoder = this.createCommandEncoder({});
@@ -1820,6 +2046,13 @@ var __exports__ = (() => {
         get isLost() {
           return this._isLost;
         }
+        isVertexFormatSupported(format) {
+          const info = this.getVertexFormatInfo(format);
+          return !info.webglOnly;
+        }
+        getTextureByteAlignment() {
+          return 1;
+        }
         createBuffer(props) {
           const newProps = this._normalizeBufferProps(props);
           return new WebGPUBuffer(this, newProps);
@@ -1861,18 +2094,20 @@ var __exports__ = (() => {
         createCanvasContext(props) {
           return new WebGPUCanvasContext(this, this.adapter, props);
         }
+        createPipelineLayout(props) {
+          return new WebGPUPipelineLayout(this, props);
+        }
         submit(commandBuffer) {
           if (!commandBuffer) {
             commandBuffer = this.commandEncoder.finish();
             this.commandEncoder.destroy();
             this.commandEncoder = this.createCommandEncoder({ id: `${this.id}-default-encoder` });
           }
-          this.handle.pushErrorScope("validation");
+          this.pushErrorScope("validation");
           this.handle.queue.submit([commandBuffer.handle]);
-          this.handle.popErrorScope().then((error) => {
-            if (error) {
-              this.reportError(new Error(`WebGPU command submission failed: ${error.message}`));
-            }
+          this.popErrorScope((error) => {
+            this.reportError(new Error(`${this} command submission: ${error.message}`), this)();
+            this.debug();
           });
         }
         // WebGPU specific
@@ -1882,7 +2117,7 @@ var __exports__ = (() => {
         popErrorScope(handler) {
           this.handle.popErrorScope().then((error) => {
             if (error) {
-              handler(error.message);
+              handler(error);
             }
           });
         }
@@ -1930,7 +2165,7 @@ var __exports__ = (() => {
           for (const feature of WEBGPU_ALWAYS_FEATURES) {
             features.add(feature);
           }
-          return new import_core19.DeviceFeatures(Array.from(features), this.props._disabledFeatures);
+          return new import_core21.DeviceFeatures(Array.from(features), this.props._disabledFeatures);
         }
         _getDeviceSpecificTextureFormatCapabilities(capabilities) {
           const { format } = capabilities;
@@ -1956,8 +2191,8 @@ var __exports__ = (() => {
   __reExport(bundle_exports, __toESM(require_core(), 1));
 
   // src/adapter/webgpu-adapter.ts
-  var import_core20 = __toESM(require_core(), 1);
-  var WebGPUAdapter = class extends import_core20.Adapter {
+  var import_core22 = __toESM(require_core(), 1);
+  var WebGPUAdapter = class extends import_core22.Adapter {
     /** type of device's created by this adapter */
     type = "webgpu";
     isSupported() {
@@ -1976,46 +2211,49 @@ var __exports__ = (() => {
       if (!navigator.gpu) {
         throw new Error("WebGPU not available. Recent Chrome browsers should work.");
       }
-      import_core20.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 = adapter.info || // @ts-ignore
-      await adapter.requestAdapterInfo?.();
-      import_core20.log.probe(2, "Adapter available", adapterInfo)();
-      const requiredFeatures = [];
-      const requiredLimits = {};
-      if (props._requestMaxLimits) {
-        requiredFeatures.push(...Array.from(adapter.features));
-        const limits = Object.keys(adapter.limits).filter(
-          (key) => !["minSubgroupSize", "maxSubgroupSize"].includes(key)
-        );
-        for (const key of limits) {
-          const limit = key;
-          const value = adapter.limits[limit];
-          if (typeof value === "number") {
-            requiredLimits[limit] = value;
+      import_core22.log.groupCollapsed(1, "WebGPUDevice created")();
+      try {
+        const adapter = await navigator.gpu.requestAdapter({
+          powerPreference: "high-performance"
+          // forceSoftware: false
+        });
+        if (!adapter) {
+          throw new Error("Failed to request WebGPU adapter");
+        }
+        const adapterInfo = adapter.info || // @ts-ignore
+        await adapter.requestAdapterInfo?.();
+        import_core22.log.probe(2, "Adapter available", adapterInfo)();
+        const requiredFeatures = [];
+        const requiredLimits = {};
+        if (props._requestMaxLimits) {
+          requiredFeatures.push(...Array.from(adapter.features));
+          const limits = Object.keys(adapter.limits).filter(
+            (key) => !["minSubgroupSize", "maxSubgroupSize"].includes(key)
+          );
+          for (const key of limits) {
+            const limit = key;
+            const value = adapter.limits[limit];
+            if (typeof value === "number") {
+              requiredLimits[limit] = value;
+            }
           }
         }
+        const gpuDevice = await adapter.requestDevice({
+          requiredFeatures,
+          requiredLimits
+        });
+        import_core22.log.probe(1, "GPUDevice available")();
+        const { WebGPUDevice: WebGPUDevice2 } = await Promise.resolve().then(() => (init_webgpu_device(), webgpu_device_exports));
+        const device = new WebGPUDevice2(props, gpuDevice, adapter, adapterInfo);
+        import_core22.log.probe(
+          1,
+          "Device created. For more info, set chrome://flags/#enable-webgpu-developer-features"
+        )();
+        import_core22.log.table(1, device.info)();
+        return device;
+      } finally {
+        import_core22.log.groupEnd(1)();
       }
-      const gpuDevice = await adapter.requestDevice({
-        requiredFeatures,
-        requiredLimits
-      });
-      import_core20.log.probe(1, "GPUDevice available")();
-      const { WebGPUDevice: WebGPUDevice2 } = await Promise.resolve().then(() => (init_webgpu_device(), webgpu_device_exports));
-      const device = new WebGPUDevice2(props, gpuDevice, adapter, adapterInfo);
-      import_core20.log.probe(
-        1,
-        "Device created. For more info, set chrome://flags/#enable-webgpu-developer-features"
-      )();
-      import_core20.log.table(1, device.info)();
-      import_core20.log.groupEnd(1)();
-      return device;
     }
     async attach(handle) {
       throw new Error("WebGPUAdapter.attach() not implemented");