@flighthq/render-wgpu 0.3.1-next.975.01aea94 → 0.4.0-edge.1908.751021c

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flighthq/render-wgpu",
-  "version": "0.3.1-next.975.01aea94",
+  "version": "0.4.0-edge.1908.751021c",
   "author": "Joshua Granick and other contributors",
   "license": "MIT",
   "repository": {
@@ -38,17 +38,17 @@
     "clean:dist": "tsx ../../scripts/clean-package-dist.ts"
   },
   "dependencies": {
-    "@flighthq/color": "0.3.1-next.975.01aea94",
-    "@flighthq/entity": "0.3.1-next.975.01aea94",
-    "@flighthq/scene2d": "0.3.1-next.975.01aea94",
-    "@flighthq/geometry": "0.3.1-next.975.01aea94",
-    "@flighthq/log": "0.3.1-next.975.01aea94",
-    "@flighthq/render": "0.3.1-next.975.01aea94",
-    "@flighthq/registry": "0.3.1-next.975.01aea94",
-    "@flighthq/signals": "0.3.1-next.975.01aea94",
-    "@flighthq/bitmap": "0.3.1-next.975.01aea94",
-    "@flighthq/texture": "0.3.1-next.975.01aea94",
-    "@flighthq/types": "0.3.1-next.975.01aea94"
+    "@flighthq/color": "0.4.0-edge.1908.751021c",
+    "@flighthq/entity": "0.4.0-edge.1908.751021c",
+    "@flighthq/scene2d": "0.4.0-edge.1908.751021c",
+    "@flighthq/geometry": "0.4.0-edge.1908.751021c",
+    "@flighthq/log": "0.4.0-edge.1908.751021c",
+    "@flighthq/render": "0.4.0-edge.1908.751021c",
+    "@flighthq/registry": "0.4.0-edge.1908.751021c",
+    "@flighthq/signals": "0.4.0-edge.1908.751021c",
+    "@flighthq/bitmap": "0.4.0-edge.1908.751021c",
+    "@flighthq/texture": "0.4.0-edge.1908.751021c",
+    "@flighthq/types": "0.4.0-edge.1908.751021c"
   },
   "peerDependencies": {
     "@webgpu/types": "^0.1.70"

package/src/enableWgpuTextureResolverGuards.test.ts

@@ -6,6 +6,8 @@ import {
   areWgpuTextureResolverGuardsEnabled,
   enableWgpuTextureResolverGuards,
 } from './enableWgpuTextureResolverGuards';
+import { bindWgpuTexture } from './wgpuDraw';
+import { getWgpuRenderStateRuntime } from './wgpuRenderState';
 import { createWgpuRenderStateForTest, installWgpuMock } from './wgpuTestHelper';
 import { registerWgpuTextureResolver, resolveWgpuTexture } from './wgpuTextureResolver';
 
@@ -55,6 +57,34 @@ describe('enableWgpuTextureResolverGuards', () => {
       removeLogSink(sink.sink);
     }
   });
+
+  it('installs the mipmap-degraded guard on the runtime', async () => {
+    const state = await createWgpuRenderStateForTest();
+    expect(getWgpuRenderStateRuntime(state).mipmapDegradedGuard).toBeNull();
+    enableWgpuTextureResolverGuards(state);
+    expect(getWgpuRenderStateRuntime(state).mipmapDegradedGuard).not.toBeNull();
+  });
+
+  it('logs a warning when mipmaps are requested without a registered generator', async () => {
+    const state = await createWgpuRenderStateForTest();
+    const sink = createMemoryLogSink(4);
+    addLogSink(sink.sink);
+    enableWgpuTextureResolverGuards(state);
+    try {
+      const canvas = document.createElement('canvas');
+      canvas.width = 8;
+      canvas.height = 8;
+      bindWgpuTexture(state, canvas, true);
+
+      const entries = getMemoryLogSinkEntries(sink);
+      expect(entries).toHaveLength(1);
+      expect(entries[0]?.data).toMatchObject({
+        message: expect.stringContaining('no WGPU mipmap generator registered'),
+      });
+    } finally {
+      removeLogSink(sink.sink);
+    }
+  });
 });
 
 function textureWithKind(kind: string) {

package/src/wgpuAntialias.test.ts

@@ -0,0 +1,217 @@
+import type { WgpuRenderTarget } from '@flighthq/types/contract';
+
+import {
+  acquireWgpuSurfaceAntialiasView,
+  clearWgpuSurfacePresentation,
+  encodeWgpuSurfaceAntialiasResolve,
+  getWgpuSurfaceRenderExtent,
+  getWgpuSurfaceRenderScale,
+} from './wgpuAntialias';
+import { renderWgpuBackground, submitWgpuRenderPass } from './wgpuBackground';
+import { getWgpuRenderStateRuntime } from './wgpuRenderState';
+import { setWgpuRenderPassScissorRect } from './wgpuScissor';
+import { enableWgpuFrameCapture } from './wgpuSurface';
+import { createWgpuRenderStateForTest, installWgpuMock } from './wgpuTestHelper';
+
+beforeAll(() => {
+  installWgpuMock();
+});
+
+describe('acquireWgpuSurfaceAntialiasView', () => {
+  it('returns and retains a 2x render view when the option is enabled', async () => {
+    const state = await createWgpuRenderStateForTest({ antialias: true });
+    const presentationView = state.context.getCurrentTexture().createView();
+
+    const view = acquireWgpuSurfaceAntialiasView(state, presentationView);
+
+    expect(view).toBe(getWgpuRenderStateRuntime(state).surfaceAntialiasView);
+    expect(getWgpuRenderStateRuntime(state).surfacePresentationView).toBe(presentationView);
+  });
+});
+
+describe('clearWgpuSurfacePresentation', () => {
+  it('drops the per-frame presentation view without destroying reusable resolve resources', async () => {
+    const state = await createWgpuRenderStateForTest({ antialias: true });
+    acquireWgpuSurfaceAntialiasView(state, state.context.getCurrentTexture().createView());
+    const runtime = getWgpuRenderStateRuntime(state);
+    const texture = runtime.surfaceAntialiasTexture;
+
+    clearWgpuSurfacePresentation(state);
+
+    expect(runtime.surfacePresentationView).toBeNull();
+    expect(runtime.surfaceAntialiasTexture).toBe(texture);
+  });
+});
+
+describe('encodeWgpuSurfaceAntialiasResolve', () => {
+  it('draws one fullscreen triangle into the retained presentation view', async () => {
+    const state = await createWgpuRenderStateForTest({ antialias: true });
+    acquireWgpuSurfaceAntialiasView(state, state.context.getCurrentTexture().createView());
+    const draw = vi.fn();
+    const beginRenderPass = vi.fn(() => ({
+      draw,
+      end: () => {},
+      setBindGroup: () => {},
+      setPipeline: () => {},
+    }));
+
+    encodeWgpuSurfaceAntialiasResolve(state, { beginRenderPass } as unknown as GPUCommandEncoder);
+
+    expect(beginRenderPass).toHaveBeenCalledOnce();
+    expect(draw).toHaveBeenCalledWith(3);
+  });
+});
+
+describe('getWgpuSurfaceRenderExtent', () => {
+  it('switches from the logical canvas extent to the acquired supersample extent', async () => {
+    const state = await createWgpuRenderStateForTest({ antialias: true });
+    expect(getWgpuSurfaceRenderExtent(state)).toEqual({ width: 800, height: 600 });
+
+    acquireWgpuSurfaceAntialiasView(state, state.context.getCurrentTexture().createView());
+
+    expect(getWgpuSurfaceRenderExtent(state)).toEqual({ width: 1600, height: 1200 });
+  });
+});
+
+describe('getWgpuSurfaceRenderScale', () => {
+  it('scales only the acquired main surface', async () => {
+    const state = await createWgpuRenderStateForTest({ antialias: true });
+    acquireWgpuSurfaceAntialiasView(state, state.context.getCurrentTexture().createView());
+    const runtime = getWgpuRenderStateRuntime(state);
+
+    expect(getWgpuSurfaceRenderScale(state)).toBe(2);
+    runtime.currentRenderTarget = {} as WgpuRenderTarget;
+    expect(getWgpuSurfaceRenderScale(state)).toBe(1);
+  });
+});
+
+describe('WgpuRenderOptions.antialias', () => {
+  it('leaves the direct presentation path and all resolve resources off by default', async () => {
+    const state = await createWgpuRenderStateForTest();
+    const runtime = getWgpuRenderStateRuntime(state);
+    const { encoder, setViewport } = installRecordingEncoder(state);
+
+    renderWgpuBackground(state);
+
+    expect(runtime.surfaceAntialiasEnabled).toBe(false);
+    expect(runtime.surfaceAntialiasTexture).toBeNull();
+    expect(runtime.surfaceAntialiasResolvePipeline).toBeNull();
+    expect(runtime.surfacePresentationView).toBeNull();
+    expect(setViewport).toHaveBeenCalledWith(0, 0, 800, 600, 0, 1);
+    expect(encoder.beginRenderPass).toHaveBeenCalledTimes(1);
+  });
+
+  it('renders the main pass into a 2x surface while preserving logical canvas coordinates', async () => {
+    const state = await createWgpuRenderStateForTest({ antialias: true });
+    const runtime = getWgpuRenderStateRuntime(state);
+    const { setViewport } = installRecordingEncoder(state);
+
+    renderWgpuBackground(state);
+
+    expect(runtime.surfaceAntialiasTexture?.width).toBe(1600);
+    expect(runtime.surfaceAntialiasTexture?.height).toBe(1200);
+    expect(runtime.depthStencilWidth).toBe(1600);
+    expect(runtime.depthStencilHeight).toBe(1200);
+    expect(runtime.renderTargetViewport).toBeNull();
+    expect(runtime.surfacePresentationView).not.toBeNull();
+    expect(setViewport).toHaveBeenCalledWith(0, 0, 1600, 1200, 0, 1);
+  });
+
+  it('encodes one fullscreen resolve before frame-capture readback', async () => {
+    const state = await createWgpuRenderStateForTest({ antialias: true });
+    const events: string[] = [];
+    let passIndex = 0;
+    const encoder = {
+      beginRenderPass: vi.fn(() => {
+        const name = passIndex++ === 0 ? 'main' : 'resolve';
+        events.push(`${name}:begin`);
+        return {
+          draw: (vertices: number) => events.push(`${name}:draw:${vertices}`),
+          end: () => events.push(`${name}:end`),
+          setBindGroup: () => {},
+          setPipeline: () => {},
+          setScissorRect: () => {},
+          setStencilReference: () => {},
+          setViewport: () => {},
+        } as unknown as GPURenderPassEncoder;
+      }),
+      copyTextureToBuffer: () => events.push('capture:copy'),
+      finish: () => {
+        events.push('encoder:finish');
+        return {} as GPUCommandBuffer;
+      },
+    } as unknown as GPUCommandEncoder;
+    vi.spyOn(state.device, 'createCommandEncoder').mockReturnValue(encoder);
+    enableWgpuFrameCapture(state);
+
+    renderWgpuBackground(state);
+    submitWgpuRenderPass(state);
+
+    expect(events).toEqual([
+      'main:begin',
+      'main:end',
+      'resolve:begin',
+      'resolve:draw:3',
+      'resolve:end',
+      'capture:copy',
+      'encoder:finish',
+    ]);
+    expect(getWgpuRenderStateRuntime(state).surfacePresentationView).toBeNull();
+  });
+
+  it('reallocates the supersample surface when the canvas size changes', async () => {
+    const state = await createWgpuRenderStateForTest({ antialias: true });
+    renderWgpuBackground(state);
+    const runtime = getWgpuRenderStateRuntime(state);
+    const first = runtime.surfaceAntialiasTexture!;
+    const destroy = vi.spyOn(first, 'destroy');
+    submitWgpuRenderPass(state);
+
+    state.canvas.width = 400;
+    state.canvas.height = 300;
+    renderWgpuBackground(state);
+
+    expect(destroy).toHaveBeenCalledOnce();
+    expect(runtime.surfaceAntialiasTexture).not.toBe(first);
+    expect(runtime.surfaceAntialiasTexture?.width).toBe(800);
+    expect(runtime.surfaceAntialiasTexture?.height).toBe(600);
+  });
+
+  it('scales main-surface scissors but leaves offscreen-target scissors unchanged', async () => {
+    const state = await createWgpuRenderStateForTest({ antialias: true });
+    renderWgpuBackground(state);
+    const runtime = getWgpuRenderStateRuntime(state);
+    const setScissorRect = vi.fn();
+    const pass = { setScissorRect } as unknown as GPURenderPassEncoder;
+
+    setWgpuRenderPassScissorRect(state, pass, 3, 5, 7, 11);
+    expect(setScissorRect).toHaveBeenLastCalledWith(6, 10, 14, 22);
+
+    runtime.currentRenderTarget = {} as WgpuRenderTarget;
+    setWgpuRenderPassScissorRect(state, pass, 3, 5, 7, 11);
+    expect(setScissorRect).toHaveBeenLastCalledWith(3, 5, 7, 11);
+  });
+});
+
+function installRecordingEncoder(state: { device: GPUDevice }): {
+  encoder: GPUCommandEncoder & { beginRenderPass: ReturnType<typeof vi.fn> };
+  setViewport: ReturnType<typeof vi.fn>;
+} {
+  const setViewport = vi.fn();
+  const pass = {
+    draw: () => {},
+    end: () => {},
+    setBindGroup: () => {},
+    setPipeline: () => {},
+    setScissorRect: () => {},
+    setStencilReference: () => {},
+    setViewport,
+  } as unknown as GPURenderPassEncoder;
+  const beginRenderPass = vi.fn(() => pass);
+  const encoder = {
+    beginRenderPass,
+    finish: () => ({}) as GPUCommandBuffer,
+  } as unknown as GPUCommandEncoder & { beginRenderPass: ReturnType<typeof vi.fn> };
+  vi.spyOn(state.device, 'createCommandEncoder').mockReturnValue(encoder);
+  return { encoder, setViewport };
+}

package/src/wgpuDraw.test.ts

@@ -30,6 +30,7 @@ import {
   updateWgpuTextureEntry,
   warmWgpuPipelines,
 } from './wgpuDraw';
+import { registerWgpuMipmapGeneration } from './wgpuMipmap';
 import { getWgpuRenderStateRuntime } from './wgpuRenderState';
 import { createWgpuRenderStateForTest, installWgpuMock } from './wgpuTestHelper';
 
@@ -228,6 +229,7 @@ describe('bindWgpuTexture', () => {
 
   it('allocates a full mip chain and generates it when generateMips is true', async () => {
     const state = await createWgpuRenderStateForTest();
+    registerWgpuMipmapGeneration(state);
     const createTexture = vi.spyOn(state.device, 'createTexture');
     const submit = vi.spyOn(state.device.queue, 'submit');
     const canvas = document.createElement('canvas');
@@ -238,6 +240,39 @@ describe('bindWgpuTexture', () => {
     expect(createTexture).toHaveBeenCalledWith(expect.objectContaining({ mipLevelCount: 4 }));
     expect(submit).toHaveBeenCalled();
   });
+
+  it('degrades to a single mip level when generateMips is true but no generator is registered', async () => {
+    const state = await createWgpuRenderStateForTest();
+    const createTexture = vi.spyOn(state.device, 'createTexture');
+    const canvas = document.createElement('canvas');
+    canvas.width = 8;
+    canvas.height = 8;
+    bindWgpuTexture(state, canvas, true);
+    expect(createTexture).toHaveBeenCalledWith(expect.objectContaining({ mipLevelCount: 1 }));
+  });
+
+  it('invokes the mipmapDegradedGuard when degrading', async () => {
+    const state = await createWgpuRenderStateForTest();
+    const guard = vi.fn();
+    getWgpuRenderStateRuntime(state).mipmapDegradedGuard = guard;
+    const canvas = document.createElement('canvas');
+    canvas.width = 8;
+    canvas.height = 8;
+    bindWgpuTexture(state, canvas, true);
+    expect(guard).toHaveBeenCalledWith(state);
+  });
+
+  it('does not invoke the mipmapDegradedGuard when the generator is registered', async () => {
+    const state = await createWgpuRenderStateForTest();
+    registerWgpuMipmapGeneration(state);
+    const guard = vi.fn();
+    getWgpuRenderStateRuntime(state).mipmapDegradedGuard = guard;
+    const canvas = document.createElement('canvas');
+    canvas.width = 8;
+    canvas.height = 8;
+    bindWgpuTexture(state, canvas, true);
+    expect(guard).not.toHaveBeenCalled();
+  });
 });
 
 describe('bindWgpuVideoTexture', () => {

package/src/wgpuMipmap.test.ts

@@ -1,6 +1,6 @@
 import type { WgpuRenderState } from '@flighthq/types/contract';
 
-import { generateWgpuMipmaps, getWgpuMipLevelCount } from './wgpuMipmap';
+import { generateWgpuMipmaps, getWgpuMipLevelCount, registerWgpuMipmapGeneration } from './wgpuMipmap';
 import { getWgpuRenderStateRuntime } from './wgpuRenderState';
 import { createWgpuRenderStateForTest, installWgpuMock } from './wgpuTestHelper';
 
@@ -79,3 +79,13 @@ describe('getWgpuMipLevelCount', () => {
     expect(getWgpuMipLevelCount(5, 3)).toBe(3);
   });
 });
+
+describe('registerWgpuMipmapGeneration', () => {
+  it('installs generateWgpuMipmaps on the runtime slot', async () => {
+    const state = await createWgpuRenderStateForTest();
+    const runtime = getWgpuRenderStateRuntime(state);
+    expect(runtime.mipmapGenerator).toBeNull();
+    registerWgpuMipmapGeneration(state);
+    expect(runtime.mipmapGenerator).toBe(generateWgpuMipmaps);
+  });
+});

package/src/wgpuRenderTarget.test.ts

@@ -1,8 +1,10 @@
 import { createMatrix } from '@flighthq/geometry/contract';
+import type { WgpuRenderTarget } from '@flighthq/types/contract';
 
 import { renderWgpuBackground, submitWgpuRenderPass } from './wgpuBackground';
 import { getWgpuRenderStateRuntime } from './wgpuRenderState';
 import {
+  getWgpuRenderTargetSupersampleScale,
   beginWgpuRenderPass,
   createWgpuRenderTarget,
   declareWgpuRenderTargetColorSpace,
@@ -70,6 +72,16 @@ describe('createWgpuRenderTarget', () => {
     expect(createWgpuRenderTarget(state, 16, 16).colorSpace).toBe('srgb');
     expect(createWgpuRenderTarget(state, 16, 16, state.format, 'linear').colorSpace).toBe('linear');
   });
+
+  it('realizes four coverage samples as a 2x extent in each axis', async () => {
+    const state = await createWgpuRenderStateForTest();
+    const target = createWgpuRenderTarget(state, 64, 48, state.format, 'srgb', 4);
+    expect(target.width).toBe(128);
+    expect(target.height).toBe(96);
+    expect(target.sampleCount).toBe(4);
+    expect(target.texture.width).toBe(128);
+    expect(target.texture.height).toBe(96);
+  });
 });
 
 describe('declareWgpuRenderTargetColorSpace', () => {
@@ -154,6 +166,34 @@ describe('endWgpuRenderPass', () => {
   });
 });
 
+describe('getWgpuRenderTargetSupersampleScale', () => {
+  // ★ THE ALLOCATOR AND THE PROJECTION HAVE TO AGREE. A sampleCount-4 target is allocated at 2x per axis;
+  // if the 2D projection divides by that physical width it maps logical x = 800 to NDC 0, and the scene
+  // fills a quarter of its own target. Measured on effect-sepia before the repair: the WebGPU frame
+  // equalled the WebGL frame sampled at (2x, 2y) on 12 of 12 grid points; after, 48 of 48 matched 1:1.
+  it('reports 2 for a supersampled target and 1 for a single-sample one', () => {
+    expect(getWgpuRenderTargetSupersampleScale({ sampleCount: 4 } as WgpuRenderTarget)).toBe(2);
+    expect(getWgpuRenderTargetSupersampleScale({ sampleCount: 1 } as WgpuRenderTarget)).toBe(1);
+  });
+
+  // Dividing the physical extent by the scale has to land back on the logical extent exactly, or the
+  // projection drifts by a pixel at odd sizes. The allocator ceils BEFORE scaling, which is what makes
+  // this exact rather than approximately right.
+  it('inverts the allocator exactly, including at an odd logical size', () => {
+    for (const [logical, sampleCount] of [
+      [801, 4],
+      [599, 4],
+      [800, 1],
+      [1, 4],
+    ] as const) {
+      const physical = Math.max(1, Math.ceil(logical)) * (sampleCount === 4 ? 2 : 1);
+      const scale = getWgpuRenderTargetSupersampleScale({ sampleCount } as WgpuRenderTarget);
+
+      expect(physical / scale).toBe(logical);
+    }
+  });
+});
+
 describe('resizeWgpuRenderTarget', () => {
   it('preserves the allocation when dimensions are unchanged', async () => {
     const state = await createWgpuRenderStateForTest();
@@ -179,6 +219,19 @@ describe('resizeWgpuRenderTarget', () => {
     expect(target.bindGroup).toBeDefined();
     expect(target.bindGroup).not.toBe(previousBindGroup);
   });
+
+  it('reallocates when the effective sample count changes', async () => {
+    const state = await createWgpuRenderStateForTest();
+    const target = createWgpuRenderTarget(state, 64, 48);
+    const previousTexture = target.texture;
+
+    resizeWgpuRenderTarget(state, target, 64, 48, 4);
+
+    expect(target.width).toBe(128);
+    expect(target.height).toBe(96);
+    expect(target.sampleCount).toBe(4);
+    expect(target.texture).not.toBe(previousTexture);
+  });
 });
 
 describe('setWgpuRenderTransform2D', () => {

package/src/wgpuRenderTargetPool.test.ts

@@ -30,6 +30,22 @@ describe('acquireWgpuRenderTarget', () => {
     expect(hdr.format).toBe('rgba16float');
   });
 
+  it('realizes and pools a four-sample request at twice the extent in each axis', async () => {
+    const state = await createWgpuRenderStateForTest();
+    const pool = createWgpuRenderTargetPool();
+    const supersampled = acquireWgpuRenderTarget(state, pool, { width: 64, height: 48, sampleCount: 4 });
+    expect(supersampled.width).toBe(128);
+    expect(supersampled.height).toBe(96);
+    expect(supersampled.sampleCount).toBe(4);
+
+    releaseWgpuRenderTarget(pool, supersampled);
+    const singleSampled = acquireWgpuRenderTarget(state, pool, { width: 128, height: 96 });
+    expect(singleSampled).not.toBe(supersampled);
+
+    const reused = acquireWgpuRenderTarget(state, pool, { width: 64, height: 48, sampleCount: 4 });
+    expect(reused).toBe(supersampled);
+  });
+
   it('re-stamps the logical color space when reusing storage', async () => {
     const state = await createWgpuRenderStateForTest();
     const pool = createWgpuRenderTargetPool();

package/src/wgpuRenderTexture.test.ts

@@ -162,4 +162,17 @@ describe('writeWgpuRenderTextureTarget', () => {
     expect(renderTexture.version).toBe(1);
     expect(isWgpuRenderTextureReady(state, renderTexture)).toBe(true);
   });
+
+  it('realizes a four-sample render texture at twice its logical extent', async () => {
+    const state = await createWgpuRenderStateForTest();
+    const renderTexture = texture();
+    renderTexture.source.sampleCount = 4;
+
+    writeWgpuRenderTextureTarget(state, renderTexture, () => {});
+
+    const target = getWgpuRenderTextureTarget(state, renderTexture)!;
+    expect(target.width).toBe(16);
+    expect(target.height).toBe(16);
+    expect(target.sampleCount).toBe(4);
+  });
 });

package/src/wgpuScissor.test.ts

@@ -1,6 +1,11 @@
 import { renderWgpuBackground } from './wgpuBackground';
 import { getWgpuRenderStateRuntime } from './wgpuRenderState';
-import { applyWgpuScissorRect, popWgpuScissorRect, pushWgpuScissorRect } from './wgpuScissor';
+import {
+  applyWgpuScissorRect,
+  popWgpuScissorRect,
+  pushWgpuScissorRect,
+  setWgpuRenderPassScissorRect,
+} from './wgpuScissor';
 import { createWgpuRenderStateForTest, installWgpuMock } from './wgpuTestHelper';
 
 beforeAll(() => {
@@ -95,3 +100,15 @@ describe('pushWgpuScissorRect', () => {
     expect(getWgpuRenderStateRuntime(state).currentScissorRect?.width).toBe(50);
   });
 });
+
+describe('setWgpuRenderPassScissorRect', () => {
+  it('scales logical coordinates on the acquired supersample surface', async () => {
+    const state = await createWgpuRenderStateForTest({ antialias: true });
+    renderWgpuBackground(state);
+    const setScissorRect = vi.fn();
+
+    setWgpuRenderPassScissorRect(state, { setScissorRect } as unknown as GPURenderPassEncoder, 3, 5, 7, 11);
+
+    expect(setScissorRect).toHaveBeenCalledWith(6, 10, 14, 22);
+  });
+});