[bug]: Wasm builds fail on WGPU>=22.0.0 with Grab WGPU Adapter failure

[lexi-the-cute]

Description
Updating from WGPU=0.20.1 to any version greater breaks the ability to grab the WGPU adapter on WASM. The version of winit does not matter.

Repro steps
A working example is at:

• https://github.com/lexi-the-cute/catgirl-engine/blob/528c9351d3e063ee00814d3f0c78bf9818b57ab4/client/src/window/window_state.rs#L111

The broken example is at:

• https://github.com/lexi-the-cute/catgirl-engine/blob/a71fae444ad1e702c7eada3cf752c73e66796b9d/client/src/window/window_state.rs#L111

Expected vs observed behavior
The WASM build should be able to grab the WGPU adapter and continue execution to render the screen. On WGPU>=22.0.0, the WASM fails to grab the WGPU adapter and mentions being unable to recursively acquire a mutex as well as a message about already borrowing something with BorrowMutError

Extra materials

Screenshot of program with version of WGPU which works on WASM:

Screenshot of program with version of WGPU which doesn't work on WASM:

Log of Failure to Grab WGPU Adapter:
wasm-wgpu-adapter-fail.log

This is related to closed issue: #5881 and the same bug was discovered in pull request #5709

I'll be able to provide more details when I get some more free time in a few days. Currently, it does not appear to be possible to generate source maps for the wasm, so I'll have to rely on logging for the meantime

Platform

• Arch Linux (6.11.5-arch1-1)
• WGPU>=22.0.0 (tests for screenshot and logs on 23.0.0)
• rustc 1.82.0 (f6e511eec 2024-10-15)
• Firefox 131.0.3 (64-bit)
• Chromium Version 130.0.6723.91 (Official Build) Arch Linux (64-bit)
• Wasm Pack 0.13.0

WGPU uses default features plus "webgl" and "fragile-send-sync-non-atomic-wasm"

[kpreid]

This is likely to do with the WebGPU support or lack thereof your browser — there is some awkwardness around detecting actually functional WebGPU support that can end with getting neither WebGPU nor WebGL. Try using wgpu::util::new_instance_with_webgpu_detection(). This should properly fall back to WebGL instead of failing entirely.

mentions being unable to recursively acquire a mutex as well as a message about already borrowing something with BorrowMutError

FYI, all of this is almost certainly related to your code (or winit’s) getting further events after it already panicked the first time. In most cases you should ignore every console error after the first Rust panic.

[lexi-the-cute]

Thanks! I've rewritten the Instance creation code such that it uses the new function for detecting WebGPU. It still seems to output the same error though. Will have to look into it further. Previously, I've been using Instance::new() synchronously and moved the code to my async initialize_graphics(...) function for new_instance_with_webgpu_detection(...)

This is what it looks like now:

        // #[cfg(not(target_family = "wasm"))]
        // self.instance = Some(wgpu::Instance::new(wgpu::InstanceDescriptor::default()));

        // #[cfg(target_family = "wasm")]
        self.instance = Some(wgpu::util::new_instance_with_webgpu_detection(wgpu::InstanceDescriptor::default()).await);

[lexi-the-cute]

I've tracked down the commit which breaks WGPU working on WASM for me. It is 7910fd8. The version before it, 37f2836, works for me.

How do I create a surface without using needing an adapter? I've been creating my adapter first and then supplying it to the surface creating function.

The below code is how I currently setup an adapter and a surface as part of the same async function.

// Handle to graphics device (e.g. GPU)
// https://docs.rs/wgpu/latest/wgpu/struct.Adapter.html
// https://crates.io/crates/futures
// TODO: Fix grabbing WGPU Adapter for latest WGPU for WASM
debug!("Grabbing wgpu adapter...");
let adapter_future = instance.request_adapter(&wgpu::RequestAdapterOptions::default());
self.adapter = Some(adapter_future.await.expect("Could not grab WGPU adapter!"));

// ...

trace!(
    "Window inner size (Initialize Graphics): ({}, {})",
    size.width,
    size.height
);
let surface: &Surface<'_> = self.surface.as_ref().unwrap();
surface.configure(
    self.device.as_ref().unwrap(),
    &surface
        .get_default_config(self.adapter.as_ref().unwrap(), size.width, size.height)
        .expect("Could not get surface default config!"),
);

[lexi-the-cute]

Nevermind, turns out I was already creating the Surface before requesting the Adapter. I just configured the Surface after I obtained the adapter. This fix was easy once I figured out what was going wrong. As there's at least 2 other people who have been having trouble with this same issue, I'm documenting what I did here for any future readers.

This is the commit where I fixed my game engine to work with the latest version of WGPU on WASM. foxgirl-labs/catgirl-engine@b4daa54

You'll want to create your Surface first, then request an Adapter, and you can continue on with configuring the Surface later. This code is pulled straight from my game engine, so do note that I am pulling variables from my custom struct I wrote, so treat this as pseudo-code for your code.

// Create Surface
debug!("Creating wgpu surface...");
let instance: &Instance = self.instance.as_ref().unwrap();
self.surface = Some(
    instance
        .create_surface(self.window.clone())
        .expect("Could not create surface!"),
);

// ...

// NOTE: The below two lines is the modification I made
//     to make this work on WASM with the latest WGPU
//
// Create Adapter Options (Reference to Surface Required for WASM)
let mut request_adapter_options: RequestAdapterOptionsBase<&Surface<'_>> =
    wgpu::RequestAdapterOptions::default();
request_adapter_options.compatible_surface = self.surface.as_ref();

// Handle to graphics device (e.g. GPU)
// https://docs.rs/wgpu/latest/wgpu/struct.Adapter.html
// https://crates.io/crates/futures
// TODO: Fix grabbing WGPU Adapter for latest WGPU for WASM
//    See https://github.com/gfx-rs/wgpu/commit/7910fd8059f361f48553c03d84c8e1410e94134e
debug!("Grabbing wgpu adapter...");
let adapter_future = instance.request_adapter(&request_adapter_options);
self.adapter = Some(adapter_future.await.expect("Could not grab WGPU adapter!"));

// ...

trace!(
    "Window inner size (Initialize Graphics): ({}, {})",
    size.width,
    size.height
);
let surface: &Surface<'_> = self.surface.as_ref().unwrap();
surface.configure(
    self.device.as_ref().unwrap(),
    &surface
        .get_default_config(self.adapter.as_ref().unwrap(), size.width, size.height)
        .expect("Could not get surface default config!"),
);