Deploying to gh-pages from @ 894db25 🚀

CHANGELIST.md

@@ -1,5 +1,13 @@
 # Change List
 
+### 1.5.1
+
+* handle empty bind groups.
+
+### 1.5.0
+
+* support other resource types, storageTextures, textures, samplers, externalTextures
+
 ### 1.4.0
 
 * Support `atomic`

README.md

@@ -93,19 +93,19 @@ const texture = createTextureFromSource(device, someCanvasVideoImageBitmap, {
 
 ### Load 6 images as a cubemap (with mips)
 
+```js
 import { createTextureFromImage } from 'webgpu-utils';
 
-```js
-  const texture = await createTextureFromImages(device, [
-    'images/yokohama/posx.jpg',
-    'images/yokohama/negx.jpg',
-    'images/yokohama/posy.jpg',
-    'images/yokohama/negy.jpg',
-    'images/yokohama/posz.jpg',
-    'images/yokohama/negz.jpg',
-  ], {
-    mips: true,
-  });
+const texture = await createTextureFromImages(device, [
+  'images/yokohama/posx.jpg',
+  'images/yokohama/negx.jpg',
+  'images/yokohama/posy.jpg',
+  'images/yokohama/negy.jpg',
+  'images/yokohama/posz.jpg',
+  'images/yokohama/negz.jpg',
+], {
+  mips: true,
+});
 ```
 
 ### Load data as a texture

dist/1.x/test.d.ts

@@ -0,0 +1 @@
+export {};

docs/index.html

@@ -29,8 +29,7 @@ <h2>webgpu-utils</h2></div>
 </code><button>Copy</button></pre>
 <a id="md:load-a-canvasvideoimagebitmap-as-a-texture-with-mips" class="tsd-anchor"></a><h3><a href="#md:load-a-canvasvideoimagebitmap-as-a-texture-with-mips">Load a canvas/video/ImageBitmap as a texture (with mips)</a></h3><pre><code class="language-js"><span class="hl-0">import</span><span class="hl-1"> { </span><span class="hl-2">createTextureFromSource</span><span class="hl-1"> } </span><span class="hl-0">from</span><span class="hl-1"> </span><span class="hl-3">&#39;webgpu-utils&#39;</span><span class="hl-1">;</span><br/><br/><span class="hl-4">const</span><span class="hl-1"> </span><span class="hl-5">texture</span><span class="hl-1"> = </span><span class="hl-6">createTextureFromSource</span><span class="hl-1">(</span><span class="hl-2">device</span><span class="hl-1">, </span><span class="hl-2">someCanvasVideoImageBitmap</span><span class="hl-1">, {</span><br/><span class="hl-1">  </span><span class="hl-2">mips:</span><span class="hl-1"> </span><span class="hl-4">true</span><span class="hl-1">,</span><br/><span class="hl-1">  </span><span class="hl-2">flipY:</span><span class="hl-1"> </span><span class="hl-4">true</span><span class="hl-1">,</span><br/><span class="hl-1">});</span>
 </code><button>Copy</button></pre>
-<a id="md:load-6-images-as-a-cubemap-with-mips" class="tsd-anchor"></a><h3><a href="#md:load-6-images-as-a-cubemap-with-mips">Load 6 images as a cubemap (with mips)</a></h3><p>import { createTextureFromImage } from &#39;webgpu-utils&#39;;</p>
-<pre><code class="language-js"><span class="hl-1">  </span><span class="hl-4">const</span><span class="hl-1"> </span><span class="hl-5">texture</span><span class="hl-1"> = </span><span class="hl-0">await</span><span class="hl-1"> </span><span class="hl-6">createTextureFromImages</span><span class="hl-1">(</span><span class="hl-2">device</span><span class="hl-1">, [</span><br/><span class="hl-1">    </span><span class="hl-3">&#39;images/yokohama/posx.jpg&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">    </span><span class="hl-3">&#39;images/yokohama/negx.jpg&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">    </span><span class="hl-3">&#39;images/yokohama/posy.jpg&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">    </span><span class="hl-3">&#39;images/yokohama/negy.jpg&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">    </span><span class="hl-3">&#39;images/yokohama/posz.jpg&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">    </span><span class="hl-3">&#39;images/yokohama/negz.jpg&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">  ], {</span><br/><span class="hl-1">    </span><span class="hl-2">mips:</span><span class="hl-1"> </span><span class="hl-4">true</span><span class="hl-1">,</span><br/><span class="hl-1">  });</span>
+<a id="md:load-6-images-as-a-cubemap-with-mips" class="tsd-anchor"></a><h3><a href="#md:load-6-images-as-a-cubemap-with-mips">Load 6 images as a cubemap (with mips)</a></h3><pre><code class="language-js"><span class="hl-0">import</span><span class="hl-1"> { </span><span class="hl-2">createTextureFromImage</span><span class="hl-1"> } </span><span class="hl-0">from</span><span class="hl-1"> </span><span class="hl-3">&#39;webgpu-utils&#39;</span><span class="hl-1">;</span><br/><br/><span class="hl-4">const</span><span class="hl-1"> </span><span class="hl-5">texture</span><span class="hl-1"> = </span><span class="hl-0">await</span><span class="hl-1"> </span><span class="hl-6">createTextureFromImages</span><span class="hl-1">(</span><span class="hl-2">device</span><span class="hl-1">, [</span><br/><span class="hl-1">  </span><span class="hl-3">&#39;images/yokohama/posx.jpg&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">  </span><span class="hl-3">&#39;images/yokohama/negx.jpg&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">  </span><span class="hl-3">&#39;images/yokohama/posy.jpg&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">  </span><span class="hl-3">&#39;images/yokohama/negy.jpg&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">  </span><span class="hl-3">&#39;images/yokohama/posz.jpg&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">  </span><span class="hl-3">&#39;images/yokohama/negz.jpg&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">], {</span><br/><span class="hl-1">  </span><span class="hl-2">mips:</span><span class="hl-1"> </span><span class="hl-4">true</span><span class="hl-1">,</span><br/><span class="hl-1">});</span>
 </code><button>Copy</button></pre>
 <a id="md:load-data-as-a-texture" class="tsd-anchor"></a><h3><a href="#md:load-data-as-a-texture">Load data as a texture</a></h3><pre><code class="language-js"><span class="hl-0">import</span><span class="hl-1"> { </span><span class="hl-2">createTextureFromSource</span><span class="hl-1"> } </span><span class="hl-0">from</span><span class="hl-1"> </span><span class="hl-3">&#39;webgpu-utils&#39;</span><span class="hl-1">;</span><br/><br/><span class="hl-4">const</span><span class="hl-1"> </span><span class="hl-5">r</span><span class="hl-1"> = [</span><span class="hl-8">255</span><span class="hl-1">,   </span><span class="hl-8">0</span><span class="hl-1">,   </span><span class="hl-8">0</span><span class="hl-1">, </span><span class="hl-8">255</span><span class="hl-1">];</span><br/><span class="hl-4">const</span><span class="hl-1"> </span><span class="hl-5">g</span><span class="hl-1"> = [  </span><span class="hl-8">0</span><span class="hl-1">, </span><span class="hl-8">255</span><span class="hl-1">,   </span><span class="hl-8">0</span><span class="hl-1">, </span><span class="hl-8">255</span><span class="hl-1">];</span><br/><span class="hl-4">const</span><span class="hl-1"> </span><span class="hl-5">b</span><span class="hl-1"> = [  </span><span class="hl-8">0</span><span class="hl-1">,   </span><span class="hl-8">0</span><span class="hl-1">, </span><span class="hl-8">255</span><span class="hl-1">, </span><span class="hl-8">255</span><span class="hl-1">];</span><br/><span class="hl-4">const</span><span class="hl-1"> </span><span class="hl-5">y</span><span class="hl-1"> = [</span><span class="hl-8">255</span><span class="hl-1">, </span><span class="hl-8">255</span><span class="hl-1">,   </span><span class="hl-8">0</span><span class="hl-1">, </span><span class="hl-8">255</span><span class="hl-1">];</span><br/><br/><span class="hl-7">// if no width or height is passed, then assumes data is rgba8unorm</span><br/><span class="hl-7">// if sqrt(numPixels) is in then makes a square. Otherwise Nx1</span><br/><span class="hl-4">const</span><span class="hl-1"> </span><span class="hl-5">data2x2</span><span class="hl-1"> = [ </span><span class="hl-2">r</span><span class="hl-1">, </span><span class="hl-2">g</span><span class="hl-1">, </span><span class="hl-2">b</span><span class="hl-1">, </span><span class="hl-2">y</span><span class="hl-1"> ].</span><span class="hl-6">flat</span><span class="hl-1">();</span><br/><span class="hl-4">const</span><span class="hl-1"> </span><span class="hl-5">texture2x2</span><span class="hl-1"> = </span><span class="hl-6">createTextureFromSource</span><span class="hl-1">(</span><span class="hl-2">device</span><span class="hl-1">, </span><span class="hl-2">data2x2</span><span class="hl-1">, {</span><br/><span class="hl-1">  </span><span class="hl-2">mips:</span><span class="hl-1"> </span><span class="hl-4">true</span><span class="hl-1">,</span><br/><span class="hl-1">});</span>
 </code><button>Copy</button></pre>

index.html

@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <!-- this file is auto-generated from README.md. Do not edited directly -->
 <!--
-@license webgpu-utils 1.5.0 Copyright (c) 2023, Gregg Tavares All Rights Reserved.
+@license webgpu-utils 1.5.1 Copyright (c) 2023, Gregg Tavares All Rights Reserved.
 Available via the MIT license.
 see: http://github.com/greggman/webgpu-utils for details
 -->
@@ -121,17 +121,18 @@ <h3>Load a canvas/video/ImageBitmap as a texture (with mips)</h3>
 });
 </code></pre>
 <h3>Load 6 images as a cubemap (with mips)</h3>
-<p>import { createTextureFromImage } from ‘webgpu-utils’;</p>
-<pre><code class="lang-js">  const texture = await createTextureFromImages(device, [
-    'images/yokohama/posx.jpg',
-    'images/yokohama/negx.jpg',
-    'images/yokohama/posy.jpg',
-    'images/yokohama/negy.jpg',
-    'images/yokohama/posz.jpg',
-    'images/yokohama/negz.jpg',
-  ], {
-    mips: true,
-  });
+<pre><code class="lang-js">import { createTextureFromImage } from 'webgpu-utils';
+
+const texture = await createTextureFromImages(device, [
+  'images/yokohama/posx.jpg',
+  'images/yokohama/negx.jpg',
+  'images/yokohama/posy.jpg',
+  'images/yokohama/negy.jpg',
+  'images/yokohama/posz.jpg',
+  'images/yokohama/negz.jpg',
+], {
+  mips: true,
+});
 </code></pre>
 <h3>Load data as a texture</h3>
 <pre><code class="lang-js">import { createTextureFromSource } from 'webgpu-utils';

package.json

@@ -1,6 +1,6 @@
 {
   "name": "webgpu-utils",
-  "version": "1.5.0",
+  "version": "1.5.1",
   "description": "webgpu utilities",
   "main": "dist/1.x/webgpu-utils.module.js",
   "module": "dist/1.x/webgpu-utils.module.js",

src/data-definitions.ts

@@ -173,7 +173,13 @@ export function makeBindGroupLayoutDescriptors(
             visibility: resource.entry.visibility | (entry?.visibility || 0),
         });
     }
-    return bindGroupLayoutDescriptorsByGroupByBinding.map(v => ({entries: [...v.values()].sort(byBinding) }));
+    const descriptors = bindGroupLayoutDescriptorsByGroupByBinding.map(v => ({entries: [...v.values()].sort(byBinding) }));
+    for (let i = 0; i < descriptors.length; ++i) {
+        if (!descriptors[i]) {
+            descriptors[i] = { entries: [] };
+        }
+    }
+    return descriptors;
 }
 
 function getNamedVariables(reflect: WgslReflect, variables: VariableInfo[]): VariableDefinitions {

test/tests/data-definition-test.js

@@ -655,7 +655,9 @@ describe('data-definition-tests', () => {
               },
             ],
           },
-          undefined,
+          {
+            entries: [],
+          },
           {
             entries: [
               {
@@ -737,7 +739,7 @@ describe('data-definition-tests', () => {
         assertDeepEqual(layouts, expected);
       });
 
-      it('handles merges stages', () => {
+      it('handles merged stages', () => {
         const code = `
         @group(0) @binding(1) var tex2d: texture_2d<f32>;
         @group(0) @binding(2) var samp: sampler;
@@ -785,6 +787,127 @@ describe('data-definition-tests', () => {
         assertDeepEqual(layouts, expected);
       });
 
+      it('handles empty groups', () => {
+        const code = `
+        @group(3) @binding(1) var<uniform> u: vec4f;
+        @compute fn cs() {
+          _ = u;
+        }
+        `;
+        const d = makeShaderDataDefinitions(code);
+        const layouts = makeBindGroupLayoutDescriptors(d, {
+          compute: {
+            entryPoint: 'cs',
+          },
+        });
+        const expected = [
+          {
+            entries: [],
+          },
+          {
+            entries: [],
+          },
+          {
+            entries: [],
+          },
+          {
+            entries: [
+              {
+                binding: 1,
+                visibility: 4,
+                buffer: {
+                },
+              },
+            ],
+          },
+        ];
+        assertDeepEqual(layouts, expected);
+      });
+
+      it('handles unnamed entrypoints', () => {
+        const code = `
+        @group(0) @binding(1) var tex2d: texture_2d<f32>;
+        @group(0) @binding(2) var samp: sampler;
+        @group(0) @binding(3) var<uniform> u1: vec4f;
+        @group(0) @binding(4) var<uniform> u2: vec4f;
+        @vertex fn vs() -> @builtin(position) vec4f {
+          _ = tex2d;
+          _ = samp;
+          _ = u1;
+        }
+        @fragment fn fs() -> @location(0) vec4f {
+          _ = tex2d;
+          _ = samp;
+          return vec4f(0);
+        }
+        @compute fn cs() {
+          _ = u1;
+          _ = u2;
+        }
+
+        `;
+        const d = makeShaderDataDefinitions(code);
+        {
+          const layouts = makeBindGroupLayoutDescriptors(d, {
+            compute: { },
+          });
+          const expected = [
+            {
+              entries: [
+                {
+                  binding: 3,
+                  visibility: 4,
+                  buffer: {
+                  },
+                },
+                {
+                  binding: 4,
+                  visibility: 4,
+                  buffer: {
+                  },
+                },
+              ],
+            },
+          ];
+          assertDeepEqual(layouts, expected);
+        }
+        {
+          const layouts = makeBindGroupLayoutDescriptors(d, {
+            vertex: { },
+            fragment: { },
+          });
+          const expected = [
+            {
+              entries: [
+                {
+                  binding: 1,
+                  visibility: 3,
+                  texture: {
+                    sampleType: 'float',
+                    viewDimension: '2d',
+                    multisampled: false,
+                  },
+                },
+                {
+                  binding: 2,
+                  visibility: 3,
+                  sampler: {
+                    type: 'filtering',
+                  },
+                },
+                {
+                  binding: 3,
+                  visibility: 1,
+                  buffer: {
+                  },
+                },
+              ],
+            },
+          ];
+          assertDeepEqual(layouts, expected);
+        }
+      });
+
     });
 
 });