vitest-environment-webgpu-node
Classes
HeadlessCanvas
Enough of HTMLCanvasElement for three.js WebGPURenderer, Babylon Lite and friends.
Constructors
Constructor
new HeadlessCanvas(width?, height?): HeadlessCanvas;
Creates a canvas of the given size. createCanvas is the usual entry point.
Parameters
| Parameter | Type | Default value | Description |
|---|---|---|---|
width? | number | 300 | Canvas width in pixels. |
height? | number | 150 | Canvas height in pixels. |
Returns
Properties
height
height: number = 150;
Canvas height in pixels.
style
readonly style: Record<string, string> = {};
A plain object libraries can write CSS properties to; it has no effect on rendering.
width
width: number = 300;
Canvas width in pixels.
Accessors
clientHeight
Get Signature
get clientHeight(): number;
Same as height; there is no layout in Node.
Returns
number
clientWidth
Get Signature
get clientWidth(): number;
Same as width; there is no layout in Node.
Returns
number
Methods
addEventListener()
addEventListener(): void;
Does nothing; present so libraries that register listeners keep working.
Returns
void
asElement()
asElement<TElement>(): TElement;
This same object, cast to the element type a rendering library expects.
Type Parameters
| Type Parameter | Default type | Description |
|---|---|---|
TElement | HTMLCanvasElement | The element type to cast to. Defaults to HTMLCanvasElement when DOM types are available. |
Returns
TElement
dispatchEvent()
dispatchEvent(): boolean;
Does nothing and returns true.
Returns
boolean
getAttribute()
getAttribute(name): string | null;
Reads an attribute stored with setAttribute().
Parameters
| Parameter | Type | Description |
|---|---|---|
name | string | Attribute name. |
Returns
string | null
The stored value, or null if none was set.
getBoundingClientRect()
getBoundingClientRect(): object;
A rectangle at the origin with the canvas's width and height.
Returns
| Name | Type | Description |
|---|---|---|
height | number | The canvas height. |
left | number | Always 0. |
top | number | Always 0. |
width | number | The canvas width. |
x | number | Always 0. |
y | number | Always 0. |
getContext()
Call Signature
getContext(id): HeadlessCanvasContext;
Returns the canvas's GPUCanvasContext for 'webgpu'.
Parameters
| Parameter | Type | Description |
|---|---|---|
id | "webgpu" | The context type. Only 'webgpu' is supported. |
Returns
The context for 'webgpu', or null for any other type.
Call Signature
getContext(id): HeadlessCanvasContext | null;
Returns the canvas's GPUCanvasContext for 'webgpu'.
Parameters
| Parameter | Type | Description |
|---|---|---|
id | string | The context type. Only 'webgpu' is supported. |
Returns
HeadlessCanvasContext | null
The context for 'webgpu', or null for any other type.
readPixels()
readPixels(): Promise<RgbaImage>;
Reads the current texture back as RGBA8 pixels; see HeadlessCanvasContext.readPixels.
Returns
Promise<RgbaImage>
removeEventListener()
removeEventListener(): void;
Does nothing; present so libraries that remove listeners keep working.
Returns
void
setAttribute()
setAttribute(name, value): void;
Stores an attribute on the canvas.
Parameters
| Parameter | Type | Description |
|---|---|---|
name | string | Attribute name. |
value | string | Attribute value. |
Returns
void
HeadlessCanvasContext
Minimal GPUCanvasContext: getCurrentTexture() is a texture the size of the canvas, kept until reconfigured or resized.
Constructors
Constructor
new HeadlessCanvasContext(canvas): HeadlessCanvasContext;
Creates the context for a canvas. Canvases create their own; you rarely call this.
Parameters
| Parameter | Type | Description |
|---|---|---|
canvas | HeadlessCanvas | The canvas whose size this context's texture follows. |
Returns
Properties
canvas
readonly canvas: HeadlessCanvas;
The canvas this context belongs to.
Methods
configure()
configure(config): void;
Stores the configuration and discards any texture created under the previous one, as GPUCanvasContext.configure() does.
Parameters
| Parameter | Type | Description |
|---|---|---|
config | GPUCanvasConfiguration | Device, format and usage for the canvas texture. |
Returns
void
getConfiguration()
getConfiguration(): GPUCanvasConfiguration | null;
The configuration passed to configure(), or null before it is called or after unconfigure().
Returns
GPUCanvasConfiguration | null
getCurrentTexture()
getCurrentTexture(): GPUTexture;
The texture the canvas renders into. It is created on first use at the canvas size and reused until the context
is reconfigured or the canvas is resized. Throws if configure() has not been called.
Returns
GPUTexture
readPixels()
readPixels(): Promise<RgbaImage>;
Copies the current texture to the CPU. BGRA formats are swizzled to RGBA.
Returns
Promise<RgbaImage>
unconfigure()
unconfigure(): void;
Clears the configuration and discards the current texture.
Returns
void
Type Aliases
RgbaImage
type RgbaImage = object;
RGBA8 pixels, top row first. Feed it to vitest-screenshot's toMatchScreenshot.
Properties
data
data: Uint8Array;
RGBA8 bytes, four per pixel, row by row from the top.
height
height: number;
Height in pixels.
width
width: number;
Width in pixels.
WebgpuNodeOptions
type WebgpuNodeOptions = object;
Set under test.environmentOptions.webgpuNode in your Vitest config.
Properties
dawnOptions?
dawnOptions?: string[];
Dawn options, e.g. ['backend=vulkan', 'enable-dawn-features=allow_unsafe_apis'].
Variables
default
default: object;
The Vitest environment registered as webgpu-node. Before each test file it puts navigator.gpu, the GPU*
classes and constants, and minimal window, document, HTMLCanvasElement and requestAnimationFrame shims
on the global object (only where missing), and it removes them afterwards.
Type Declaration
Functions
createCanvas()
function createCanvas(width, height): HeadlessCanvas;
Creates a headless canvas for WebGPU tests.
Parameters
| Parameter | Type | Description |
|---|---|---|
width | number | Canvas width in pixels. |
height | number | Canvas height in pixels. |
Returns
A HeadlessCanvas; pass canvas.asElement() to libraries that expect an HTMLCanvasElement.