From 494b3d03f1ce76573d27b51a823f137431e0fe69 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fran=C3=A7ois=20Beaufort?= <beaufort.francois@gmail.com>
Date: Tue, 9 Dec 2025 14:48:32 +0100
Subject: [PATCH] Add transient attachment usage to MSAA sample

---
 sample/helloTriangleMSAA/main.ts | 28 ++++++++++++++++++++--------
 1 file changed, 20 insertions(+), 8 deletions(-)

diff --git a/sample/helloTriangleMSAA/main.ts b/sample/helloTriangleMSAA/main.ts
index f59e34d0..b22d2739 100644
--- a/sample/helloTriangleMSAA/main.ts
+++ b/sample/helloTriangleMSAA/main.ts
@@ -1,3 +1,4 @@
+import { GUI } from 'dat.gui';
 import triangleVertWGSL from '../../shaders/triangle.vert.wgsl';
 import redFragWGSL from '../../shaders/red.frag.wgsl';
 import { quitIfWebGPUNotAvailable } from '../util';
@@ -9,6 +10,12 @@ const adapter = await navigator.gpu?.requestAdapter({
 const device = await adapter?.requestDevice();
 quitIfWebGPUNotAvailable(adapter, device);
 
+const settings = { transientAttachment: false };
+if ('TRANSIENT_ATTACHMENT' in GPUTextureUsage) {
+  const gui = new GUI();
+  gui.add(settings, 'transientAttachment');
+}
+
 const context = canvas.getContext('webgpu');
 
 const devicePixelRatio = window.devicePixelRatio;
@@ -48,15 +55,20 @@ const pipeline = device.createRenderPipeline({
   },
 });
 
-const texture = device.createTexture({
-  size: [canvas.width, canvas.height],
-  sampleCount,
-  format: presentationFormat,
-  usage: GPUTextureUsage.RENDER_ATTACHMENT,
-});
-const view = texture.createView();
-
 function frame() {
+  let usage = GPUTextureUsage.RENDER_ATTACHMENT;
+  if (settings.transientAttachment) {
+    usage |= GPUTextureUsage.TRANSIENT_ATTACHMENT;
+  }
+
+  const texture = device.createTexture({
+    size: [canvas.width, canvas.height],
+    sampleCount,
+    format: presentationFormat,
+    usage,
+  });
+  const view = texture.createView();
+
   const commandEncoder = device.createCommandEncoder();
 
   const renderPassDescriptor: GPURenderPassDescriptor = {