react-native-wgpu 0.2.10 → 0.3.0

package/src/__tests__/ComputeShader.spec.ts

@@ -1,375 +0,0 @@
-/* eslint-disable prefer-destructuring */
-import { client } from "./setup";
-
-const multiplyMatrices = (m1: number[], m2: number[]) => {
-  const rows1 = m1[0],
-    cols1 = m1[1];
-  const cols2 = m2[1];
-  const result: number[] = new Array(2 + rows1 * cols2);
-  result[0] = rows1;
-  result[1] = cols2;
-
-  for (let i = 0; i < rows1; i++) {
-    for (let j = 0; j < cols2; j++) {
-      let sum = 0;
-      for (let k = 0; k < cols1; k++) {
-        sum += m1[2 + i * cols1 + k] * m2[2 + k * cols2 + j];
-      }
-      result[2 + i * cols2 + j] = sum;
-    }
-  }
-  return result;
-};
-
-describe("Computer Shader", () => {
-  it("matrix multiplication", async () => {
-    // First Matrix
-    const rows = 16;
-    const columns = 16;
-    const m1: number[] = new Array(rows * columns + 2);
-    m1[0] = rows;
-    m1[1] = columns;
-    for (let i = 2; i < m1.length; i++) {
-      m1[i] = Math.random();
-    }
-
-    // Second Matrix
-    const m2: number[] = new Array(rows * columns + 2);
-    m2[0] = rows;
-    m2[1] = columns;
-    for (let i = 2; i < m2.length; i++) {
-      m2[i] = Math.random();
-    }
-
-    const result = await client.eval(
-      ({ device, firstMatrixRaw, secondMatrixRaw, rows1, columns1 }) => {
-        const firstMatrix = new Float32Array(firstMatrixRaw);
-        const secondMatrix = new Float32Array(secondMatrixRaw);
-        const gpuBufferFirstMatrix = device.createBuffer({
-          mappedAtCreation: true,
-          size: firstMatrix.byteLength,
-          usage: GPUBufferUsage.STORAGE,
-        });
-        const arrayBufferFirstMatrix = gpuBufferFirstMatrix.getMappedRange();
-        new Float32Array(arrayBufferFirstMatrix).set(firstMatrix);
-        gpuBufferFirstMatrix.unmap();
-
-        const gpuBufferSecondMatrix = device.createBuffer({
-          mappedAtCreation: true,
-          size: secondMatrix.byteLength,
-          usage: GPUBufferUsage.STORAGE,
-        });
-        const arrayBufferSecondMatrix = gpuBufferSecondMatrix.getMappedRange();
-        new Float32Array(arrayBufferSecondMatrix).set(secondMatrix);
-        gpuBufferSecondMatrix.unmap();
-
-        // Result Matrix
-        const resultMatrixBufferSize =
-          Float32Array.BYTES_PER_ELEMENT *
-          (2 + firstMatrix[0] * secondMatrix[1]);
-        const resultMatrixBuffer = device.createBuffer({
-          size: resultMatrixBufferSize,
-          usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_SRC,
-        });
-
-        // Compute shader code
-        const shaderModule = device.createShaderModule({
-          code: `
-      struct Matrix {
-        size : vec2<f32>,
-        numbers: array<f32>,
-      }
-
-      @group(0) @binding(0) var<storage, read> firstMatrix : Matrix;
-      @group(0) @binding(1) var<storage, read> secondMatrix : Matrix;
-      @group(0) @binding(2) var<storage, read_write> resultMatrix : Matrix;
-
-      @compute @workgroup_size(8, 8)
-      fn main(@builtin(global_invocation_id) global_id : vec3<u32>) {
-        // Guard against out-of-bounds work group sizes
-        if (global_id.x >= u32(firstMatrix.size.x) || global_id.y >= u32(secondMatrix.size.y)) {
-          return;
-        }
-
-        resultMatrix.size = vec2(firstMatrix.size.x, secondMatrix.size.y);
-
-        let resultCell = vec2(global_id.x, global_id.y);
-        var result = 0.0;
-        for (var i = 0u; i < u32(firstMatrix.size.y); i = i + 1u) {
-          let a = i + resultCell.x * u32(firstMatrix.size.y);
-          let b = resultCell.y + i * u32(secondMatrix.size.y);
-          result = result + firstMatrix.numbers[a] * secondMatrix.numbers[b];
-        }
-
-        let index = resultCell.y + resultCell.x * u32(secondMatrix.size.y);
-        resultMatrix.numbers[index] = result;
-      }
-    `,
-        });
-
-        // Pipeline setup
-        const computePipeline = device.createComputePipeline({
-          layout: "auto",
-          compute: {
-            module: shaderModule,
-            entryPoint: "main",
-          },
-        });
-
-        // Bind group
-        const bindGroup = device.createBindGroup({
-          layout: computePipeline.getBindGroupLayout(0 /* index */),
-          entries: [
-            {
-              binding: 0,
-              resource: {
-                buffer: gpuBufferFirstMatrix,
-              },
-            },
-            {
-              binding: 1,
-              resource: {
-                buffer: gpuBufferSecondMatrix,
-              },
-            },
-            {
-              binding: 2,
-              resource: {
-                buffer: resultMatrixBuffer,
-              },
-            },
-          ],
-        });
-
-        // Commands submission
-        const commandEncoder = device.createCommandEncoder();
-
-        const passEncoder = commandEncoder.beginComputePass();
-        passEncoder.setPipeline(computePipeline);
-        passEncoder.setBindGroup(0, bindGroup);
-        const workgroupCountX = Math.ceil(rows1 / 8);
-        const workgroupCountY = Math.ceil(columns1 / 8);
-        passEncoder.dispatchWorkgroups(workgroupCountX, workgroupCountY);
-        passEncoder.end();
-
-        // Get a GPU buffer for reading in an unmapped state.
-        const gpuReadBuffer = device.createBuffer({
-          size: resultMatrixBufferSize,
-          usage: GPUBufferUsage.COPY_DST | GPUBufferUsage.MAP_READ,
-        });
-
-        // Encode commands for copying buffer to buffer.
-        commandEncoder.copyBufferToBuffer(
-          resultMatrixBuffer /* source buffer */,
-          0 /* source offset */,
-          gpuReadBuffer /* destination buffer */,
-          0 /* destination offset */,
-          resultMatrixBufferSize /* size */,
-        );
-
-        // Submit GPU commands.
-        const gpuCommands = commandEncoder.finish();
-        device.queue.submit([gpuCommands]);
-
-        // Read buffer.
-        return gpuReadBuffer.mapAsync(GPUMapMode.READ).then(() => {
-          const arrayBuffer = gpuReadBuffer.getMappedRange();
-          const uint8Array = new Float32Array(arrayBuffer);
-          // At this point, uint8Array contains the pixel data of the rendered image
-          // You can process it further, save it, or send it somewhere else
-          const r = Array.from(uint8Array);
-          gpuReadBuffer.unmap();
-          return r;
-        });
-      },
-      {
-        firstMatrixRaw: m1,
-        secondMatrixRaw: m2,
-        rows1: rows,
-        columns1: columns,
-      },
-    );
-    expect(result.length).toBe(16 * 16 + 2);
-    expect(result.some((x) => x !== 0)).toBe(true);
-    const referenceResult = multiplyMatrices(m1, m2);
-    for (let i = 0; i < result.length; i++) {
-      expect(result[i]).toBeCloseTo(referenceResult[i], 5); // Using 5 decimal places for floating-point comparison
-    }
-  });
-  it("async matrix multiplication", async () => {
-    // First Matrix
-    const rows = 16;
-    const columns = 16;
-    const m1: number[] = new Array(rows * columns + 2);
-    m1[0] = rows;
-    m1[1] = columns;
-    for (let i = 2; i < m1.length; i++) {
-      m1[i] = Math.random();
-    }
-
-    // Second Matrix
-    const m2: number[] = new Array(rows * columns + 2);
-    m2[0] = rows;
-    m2[1] = columns;
-    for (let i = 2; i < m2.length; i++) {
-      m2[i] = Math.random();
-    }
-
-    const result = await client.eval(
-      ({ device, firstMatrixRaw, secondMatrixRaw, rows1, columns1 }) => {
-        const firstMatrix = new Float32Array(firstMatrixRaw);
-        const secondMatrix = new Float32Array(secondMatrixRaw);
-        const gpuBufferFirstMatrix = device.createBuffer({
-          mappedAtCreation: true,
-          size: firstMatrix.byteLength,
-          usage: GPUBufferUsage.STORAGE,
-        });
-        const arrayBufferFirstMatrix = gpuBufferFirstMatrix.getMappedRange();
-        new Float32Array(arrayBufferFirstMatrix).set(firstMatrix);
-        gpuBufferFirstMatrix.unmap();
-
-        const gpuBufferSecondMatrix = device.createBuffer({
-          mappedAtCreation: true,
-          size: secondMatrix.byteLength,
-          usage: GPUBufferUsage.STORAGE,
-        });
-        const arrayBufferSecondMatrix = gpuBufferSecondMatrix.getMappedRange();
-        new Float32Array(arrayBufferSecondMatrix).set(secondMatrix);
-        gpuBufferSecondMatrix.unmap();
-
-        // Result Matrix
-        const resultMatrixBufferSize =
-          Float32Array.BYTES_PER_ELEMENT *
-          (2 + firstMatrix[0] * secondMatrix[1]);
-        const resultMatrixBuffer = device.createBuffer({
-          size: resultMatrixBufferSize,
-          usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_SRC,
-        });
-
-        // Compute shader code
-        const shaderModule = device.createShaderModule({
-          code: `
-      struct Matrix {
-        size : vec2<f32>,
-        numbers: array<f32>,
-      }
-
-      @group(0) @binding(0) var<storage, read> firstMatrix : Matrix;
-      @group(0) @binding(1) var<storage, read> secondMatrix : Matrix;
-      @group(0) @binding(2) var<storage, read_write> resultMatrix : Matrix;
-
-      @compute @workgroup_size(8, 8)
-      fn main(@builtin(global_invocation_id) global_id : vec3<u32>) {
-        // Guard against out-of-bounds work group sizes
-        if (global_id.x >= u32(firstMatrix.size.x) || global_id.y >= u32(secondMatrix.size.y)) {
-          return;
-        }
-
-        resultMatrix.size = vec2(firstMatrix.size.x, secondMatrix.size.y);
-
-        let resultCell = vec2(global_id.x, global_id.y);
-        var result = 0.0;
-        for (var i = 0u; i < u32(firstMatrix.size.y); i = i + 1u) {
-          let a = i + resultCell.x * u32(firstMatrix.size.y);
-          let b = resultCell.y + i * u32(secondMatrix.size.y);
-          result = result + firstMatrix.numbers[a] * secondMatrix.numbers[b];
-        }
-
-        let index = resultCell.y + resultCell.x * u32(secondMatrix.size.y);
-        resultMatrix.numbers[index] = result;
-      }
-    `,
-        });
-
-        // Pipeline setup
-        return device
-          .createComputePipelineAsync({
-            layout: "auto",
-            compute: {
-              module: shaderModule,
-              entryPoint: "main",
-            },
-          })
-          .then((computePipeline) => {
-            // Bind group
-            const bindGroup = device.createBindGroup({
-              layout: computePipeline.getBindGroupLayout(0 /* index */),
-              entries: [
-                {
-                  binding: 0,
-                  resource: {
-                    buffer: gpuBufferFirstMatrix,
-                  },
-                },
-                {
-                  binding: 1,
-                  resource: {
-                    buffer: gpuBufferSecondMatrix,
-                  },
-                },
-                {
-                  binding: 2,
-                  resource: {
-                    buffer: resultMatrixBuffer,
-                  },
-                },
-              ],
-            });
-
-            // Commands submission
-            const commandEncoder = device.createCommandEncoder();
-
-            const passEncoder = commandEncoder.beginComputePass();
-            passEncoder.setPipeline(computePipeline);
-            passEncoder.setBindGroup(0, bindGroup);
-            const workgroupCountX = Math.ceil(rows1 / 8);
-            const workgroupCountY = Math.ceil(columns1 / 8);
-            passEncoder.dispatchWorkgroups(workgroupCountX, workgroupCountY);
-            passEncoder.end();
-
-            // Get a GPU buffer for reading in an unmapped state.
-            const gpuReadBuffer = device.createBuffer({
-              size: resultMatrixBufferSize,
-              usage: GPUBufferUsage.COPY_DST | GPUBufferUsage.MAP_READ,
-            });
-
-            // Encode commands for copying buffer to buffer.
-            commandEncoder.copyBufferToBuffer(
-              resultMatrixBuffer /* source buffer */,
-              0 /* source offset */,
-              gpuReadBuffer /* destination buffer */,
-              0 /* destination offset */,
-              resultMatrixBufferSize /* size */,
-            );
-
-            // Submit GPU commands.
-            const gpuCommands = commandEncoder.finish();
-            device.queue.submit([gpuCommands]);
-
-            // Read buffer.
-            return gpuReadBuffer.mapAsync(GPUMapMode.READ).then(() => {
-              const arrayBuffer = gpuReadBuffer.getMappedRange();
-              const uint8Array = new Float32Array(arrayBuffer);
-              // At this point, uint8Array contains the pixel data of the rendered image
-              // You can process it further, save it, or send it somewhere else
-              const r = Array.from(uint8Array);
-              gpuReadBuffer.unmap();
-              return r;
-            });
-          });
-      },
-      {
-        firstMatrixRaw: m1,
-        secondMatrixRaw: m2,
-        rows1: rows,
-        columns1: columns,
-      },
-    );
-    expect(result.length).toBe(16 * 16 + 2);
-    expect(result.some((x) => x !== 0)).toBe(true);
-    const referenceResult = multiplyMatrices(m1, m2);
-    for (let i = 0; i < result.length; i++) {
-      expect(result[i]).toBeCloseTo(referenceResult[i], 5); // Using 5 decimal places for floating-point comparison
-    }
-  });
-});

package/src/__tests__/Constants.spec.ts

@@ -1,89 +0,0 @@
-import { client } from "./setup";
-
-describe("WebGPUConstants", () => {
-  it("GPUBufferUsage", async () => {
-    const result = await client.eval(() => {
-      return GPUBufferUsage;
-    });
-    expect(result).toEqual({
-      MAP_READ: 1,
-      MAP_WRITE: 2,
-      COPY_SRC: 4,
-      COPY_DST: 8,
-      INDEX: 16,
-      VERTEX: 32,
-      UNIFORM: 64,
-      STORAGE: 128,
-      INDIRECT: 256,
-      QUERY_RESOLVE: 512,
-    });
-  });
-  it("GPUColorWrite", async () => {
-    const result = await client.eval(() => {
-      return GPUColorWrite;
-    });
-    expect(result).toEqual({
-      RED: 1,
-      GREEN: 2,
-      BLUE: 4,
-      ALPHA: 8,
-      ALL: 15,
-    });
-  });
-  it("GPUMapMode", async () => {
-    const result = await client.eval(() => {
-      return GPUMapMode;
-    });
-    expect(result).toEqual({
-      READ: 1,
-      WRITE: 2,
-    });
-  });
-  it("GPUShaderStage", async () => {
-    const result = await client.eval(() => {
-      return GPUShaderStage;
-    });
-    expect(result).toEqual({
-      VERTEX: 1,
-      FRAGMENT: 2,
-      COMPUTE: 4,
-    });
-  });
-  it("GPUTextureUsage", async () => {
-    const result = await client.eval(() => {
-      return GPUTextureUsage;
-    });
-    expect(result).toEqual({
-      COPY_SRC: 1,
-      COPY_DST: 2,
-      TEXTURE_BINDING: 4,
-      STORAGE_BINDING: 8,
-      RENDER_ATTACHMENT: 16,
-    });
-  });
-  it("GPUAdapter", async () => {
-    const result = await client.eval(({ device, gpu }) => {
-      return [
-        gpu instanceof GPU,
-        device instanceof GPUDevice,
-        device instanceof GPUAdapter,
-      ];
-    });
-    expect(result).toEqual([true, true, false]);
-  });
-  it("instanceof", async () => {
-    const result = await client.eval(
-      ({ device, shaders: { triangleVertWGSL } }) => {
-        const buffer = device.createBuffer({
-          size: 16,
-          usage: GPUBufferUsage.COPY_SRC | GPUBufferUsage.COPY_DST,
-        });
-        const module = device.createShaderModule({
-          code: triangleVertWGSL,
-        });
-        return [buffer instanceof GPUBuffer, module instanceof GPUShaderModule];
-      },
-    );
-    expect(result).toEqual([true, true]);
-  });
-});

package/src/__tests__/Device.spec.ts

@@ -1,84 +0,0 @@
-import { client } from "./setup";
-
-describe("Device", () => {
-  it("request device (1)", async () => {
-    const result = await client.eval(({ gpu }) =>
-      gpu
-        .requestAdapter()
-        .then((adapter) =>
-          adapter!.requestDevice().then((device) => device !== null),
-        ),
-    );
-    expect(result).toBe(true);
-  });
-
-  it("request device (2)", async () => {
-    const result = await client.eval(({ gpu }) =>
-      gpu
-        .requestAdapter()
-        .then((adapter) =>
-          adapter!.requestDevice(undefined).then((device) => device.label),
-        ),
-    );
-    expect(result).toBe("");
-  });
-  it("request device (3)", async () => {
-    const result = await client.eval(({ gpu }) =>
-      gpu
-        .requestAdapter()
-        .then((adapter) =>
-          adapter!
-            .requestDevice({ label: "MyGPU" })
-            .then((device) => device.label),
-        ),
-    );
-    expect(result).toBe("MyGPU");
-  });
-  it("destroy device (3)", async () => {
-    const result = await client.eval(({ gpu }) =>
-      gpu.requestAdapter().then((adapter) =>
-        adapter!.requestDevice({ label: "MyGPU" }).then((device) => {
-          device.destroy();
-          return device.lost.then((r) => ({
-            reason: r.reason,
-            message: r.message,
-          }));
-        }),
-      ),
-    );
-    expect(["unknown", "destroyed"].includes(result.reason)).toBe(true);
-  });
-
-  it("times out device.lost if the device has not been destroyed", async () => {
-    const isDeviceLost = await client.eval(({ device }) => {
-      const timeout = new Promise((resolve) => {
-        setTimeout(() => {
-          resolve(false);
-        }, 50);
-      });
-
-      return Promise.race([device.lost.then(() => true), timeout]);
-    });
-
-    expect(isDeviceLost).toBeFalsy();
-  });
-
-  it("resolves an awaited device.lost when device.destroy is called", async () => {
-    const result = await client.eval(({ gpu }) =>
-      gpu.requestAdapter().then((adapter) =>
-        adapter!.requestDevice({ label: "myGPU2" }).then((device) => {
-          setTimeout(() => {
-            device.destroy();
-          }, 50);
-
-          return device.lost.then((r) => ({
-            reason: r.reason,
-            message: r.message,
-          }));
-        }),
-      ),
-    );
-
-    expect(["unknown", "destroyed"].includes(result.reason)).toBeTruthy();
-  });
-});

package/src/__tests__/ErrorScope.spec.ts

@@ -1,92 +0,0 @@
-import { client } from "./setup";
-
-describe("Error Scope", () => {
-  it("should capture validation error when creating sampler with invalid maxAnisotropy", async () => {
-    const result = await client.eval(({ device }) => {
-      device.pushErrorScope("validation");
-      device.createSampler({
-        maxAnisotropy: 0, // Invalid, maxAnisotropy must be at least 1.
-      });
-      return device.popErrorScope().then((error) => {
-        if (error) {
-          return {
-            hasError: true,
-            message: error.message,
-            messageLength: error.message.length,
-            messageNotEmpty: error.message.length > 0,
-          };
-        } else {
-          return {
-            hasError: false,
-            message: "",
-            messageLength: 0,
-            messageNotEmpty: false,
-          };
-        }
-      });
-    });
-
-    expect(result.hasError).toBe(true);
-    expect(result.messageNotEmpty).toBe(true);
-    expect(result.messageLength).toBeGreaterThan(0);
-  });
-  it("should capture and return error messages from popErrorScope", async () => {
-    const result = await client.eval(({ device }) => {
-      // Invalid WGSL shader with syntax error (missing closing parenthesis)
-      const invalidShaderWGSL = `@fragment
-  fn main() -> @location(0) vec4f {
-    return vec4(1.0, 0.0, 0.0, 1.0;
-  }`;
-      device.pushErrorScope("validation");
-      // This should generate a validation error due to syntax error
-      device.createShaderModule({
-        code: invalidShaderWGSL,
-      });
-      return device.popErrorScope().then((error) => {
-        if (error) {
-          return {
-            hasError: true,
-            message: error.message,
-            messageLength: error.message.length,
-            messageNotEmpty: error.message.length > 0,
-            messageContainsExpected:
-              error.message.includes("expected") ||
-              error.message.includes("error") ||
-              error.message.includes("parsing"),
-          };
-        } else {
-          return {
-            hasError: false,
-            message: "",
-            messageLength: 0,
-            messageNotEmpty: false,
-            messageContainsExpected: false,
-          };
-        }
-      });
-    });
-    expect(result.hasError).toBe(true);
-    expect(result.messageNotEmpty).toBe(true);
-    expect(result.messageLength).toBeGreaterThan(0);
-    // The error message should contain some indication that it's a parsing error
-    expect(result.messageContainsExpected).toBe(true);
-  });
-
-  it("should return null when no error occurs", async () => {
-    const result = await client.eval(({ device, shaders: { redFragWGSL } }) => {
-      device.pushErrorScope("validation");
-      // This should not generate any errors
-      device.createShaderModule({
-        code: redFragWGSL,
-      });
-      return device.popErrorScope().then((error) => {
-        return {
-          hasError: error !== null,
-          error: error,
-        };
-      });
-    });
-    expect(result.hasError).toBe(false);
-    expect(result.error).toBe(null);
-  });
-});