Test using a pipeline created with null bind group layout

src/webgpu/api/validation/createPipelineLayout.spec.ts

@@ -218,26 +218,48 @@ g.test('bind_group_layouts,null_bind_group_layouts')
 g.test('bind_group_layouts,create_pipeline_with_null_bind_group_layouts')
   .desc(
     `
-  Tests that it is valid to create a render pipeline or compute pipeline with a pipeline layout
-  created with null bind group layouts as long as the pipeline layout matches the declarations in
-  the shaders.
+  Tests that it is valid to create and use a render pipeline or compute pipeline with a pipeline
+  layout created with null bind group layouts as long as the pipeline layout matches the
+  declarations in the shaders.
   `
   )
-  .params(u =>
+  .paramsSubcasesOnly(u =>
     u
       .combine('pipelineType', ['Render', 'Compute'] as const)
       .combine('emptyBindGroupLayoutType', ['Null', 'Undefined'] as const)
       .combine('emptyBindGroupLayoutIndex', [0, 1, 2, 3] as const)
       .combine('emptyBindGroupLayoutIndexMissedInShader', [true, false])
+      .combine('setBindGroupOnEmptyBindGroupLayoutIndex', [true, false])
+      .filter(p => {
+        // p.emptyBindGroupLayoutIndexMissedInShader === true will cause the failure of the pipeline
+        // creation so we don't need to test the behavior about the use of the pipeline.
+        return (
+          p.emptyBindGroupLayoutIndexMissedInShader || p.setBindGroupOnEmptyBindGroupLayoutIndex
+        );
+      })
   )
   .fn(t => {
     const {
       pipelineType,
       emptyBindGroupLayoutType,
       emptyBindGroupLayoutIndex,
       emptyBindGroupLayoutIndexMissedInShader,
+      setBindGroupOnEmptyBindGroupLayoutIndex,
     } = t.params;
 
+    const nonEmptyBindGroupLayout = t.device.createBindGroupLayout({
+      entries: [
+        {
+          binding: 0,
+          visibility: GPUConst.ShaderStage.COMPUTE | GPUConst.ShaderStage.FRAGMENT,
+          buffer: {
+            type: 'uniform',
+          },
+        },
+      ],
+    });
+
+    const bindGroups: GPUBindGroup[] = [];
     const bindGroupLayouts: (GPUBindGroupLayout | null | undefined)[] = [];
     for (let i = 0; i < 4; ++i) {
       if (i === emptyBindGroupLayoutIndex) {
@@ -250,19 +272,25 @@ g.test('bind_group_layouts,create_pipeline_with_null_bind_group_layouts')
             break;
         }
       } else {
-        const nonEmptyBindGroupLayout = t.device.createBindGroupLayout({
-          entries: [
-            {
-              binding: 0,
-              visibility: GPUConst.ShaderStage.COMPUTE | GPUConst.ShaderStage.FRAGMENT,
-              buffer: {
-                type: 'uniform',
-              },
-            },
-          ],
-        });
         bindGroupLayouts.push(nonEmptyBindGroupLayout);
       }
+
+      const buffer = t.createBufferTracked({
+        usage: GPUBufferUsage.COPY_DST | GPUBufferUsage.UNIFORM,
+        size: 4,
+      });
+      const bindGroup = t.device.createBindGroup({
+        layout: nonEmptyBindGroupLayout,
+        entries: [
+          {
+            binding: 0,
+            resource: {
+              buffer,
+            },
+          },
+        ],
+      });
+      bindGroups.push(bindGroup);
     }
     const layout = t.device.createPipelineLayout({ bindGroupLayouts });
 
@@ -297,8 +325,9 @@ g.test('bind_group_layouts,create_pipeline_with_null_bind_group_layouts')
           code,
         });
 
+        const format = 'rgba8unorm';
         t.expectValidationError(() => {
-          t.device.createRenderPipeline({
+          const renderPipeline = t.device.createRenderPipeline({
             layout,
             vertex: {
               module: shaderModule,
@@ -307,11 +336,38 @@ g.test('bind_group_layouts,create_pipeline_with_null_bind_group_layouts')
               module: shaderModule,
               targets: [
                 {
-                  format: 'rgba8unorm',
+                  format,
                 },
               ],
             },
           });
+
+          const renderTarget = t.createTextureTracked({
+            usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.COPY_SRC,
+            size: [4, 4, 1],
+            format,
+          });
+          const commandEncoder = t.device.createCommandEncoder();
+          const renderPassEncoder = commandEncoder.beginRenderPass({
+            colorAttachments: [
+              {
+                view: renderTarget.createView(),
+                loadOp: 'load',
+                storeOp: 'store',
+              },
+            ],
+          });
+          for (let i = 0; i < 4; ++i) {
+            if (!setBindGroupOnEmptyBindGroupLayoutIndex && i === emptyBindGroupLayoutIndex) {
+              continue;
+            }
+            renderPassEncoder.setBindGroup(i, bindGroups[i]);
+          }
+          renderPassEncoder.setPipeline(renderPipeline);
+          renderPassEncoder.draw(1);
+          renderPassEncoder.end();
+
+          t.queue.submit([commandEncoder.finish()]);
         }, shouldError);
         break;
       }
@@ -327,12 +383,26 @@ g.test('bind_group_layouts,create_pipeline_with_null_bind_group_layouts')
           code,
         });
         t.expectValidationError(() => {
-          t.device.createComputePipeline({
+          const computePipeline = t.device.createComputePipeline({
             layout,
             compute: {
               module: shaderModule,
             },
           });
+
+          const commandEncoder = t.device.createCommandEncoder();
+          const computePassEncoder = commandEncoder.beginComputePass();
+          for (let i = 0; i < 4; ++i) {
+            if (!setBindGroupOnEmptyBindGroupLayoutIndex && i === emptyBindGroupLayoutIndex) {
+              continue;
+            }
+            computePassEncoder.setBindGroup(i, bindGroups[i]);
+          }
+          computePassEncoder.setPipeline(computePipeline);
+          computePassEncoder.dispatchWorkgroups(1);
+          computePassEncoder.end();
+
+          t.queue.submit([commandEncoder.finish()]);
         }, shouldError);
         break;
       }