#wgsl-studio

VS Code extension for WESL/WGSL development with integrated test runner and live shader preview.

#Installation

Install from the VS Code Marketplace:

ext install webgpu-tools.wgsl-studio

#Quick Start

Create a fragment shader tagged with @toy:

@toy
fn main(@builtin(position) pos: vec4f) -> @location(0) vec4f {
  let uv = pos.xy / uniforms.size;
  return vec4f(uv, 0.5, 1.0);
}

Then run command “WGSL Studio: Preview Toy Shader” (or right-click the file).

#Built-in Uniforms

The preview provides these uniforms automatically:

See wgsl-play for full uniform documentation.

#GPU Test Runner

WGSL Studio includes a native test runner for GPU shader tests. Tag functions with @test and use expect from wgsl_test:

import wgsl_test::expect;

@test fn myTest() { expect(1 == 1); }

Tests are discovered automatically and appear in the VS Code Test Explorer. Run them from there, or use the command palette.

The native test runner can be disabled in settings (wgslStudio.nativeTestRunner.enabled) if you prefer using Vitest instead.

See wgsl-test for more on writing GPU tests.

#Links

• VS Code Marketplace
• GitHub