webgpu: Update wgpu and revamp RenderPass (#32665)

* Update wgpu and revamp RenderPass

* Set good expectations

* Set one bad expectation

* send_render_command

* small fixups

* docs

* doc

* Put RenderPass inside PassState

* Use Pass enum for ComputePass too

* fix docs

Cargo.lock

@@ -391,18 +391,18 @@ dependencies = [
 
 [[package]]
 name = "bit-set"
-version = "0.5.3"
+version = "0.6.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "0700ddab506f33b20a03b13996eccd309a48e5ff77d0d95926aa0210fb4e95f1"
+checksum = "f0481a0e032742109b1133a095184ee93d88f3dc9e0d28a5d033dc77a073f44f"
 dependencies = [
  "bit-vec",
 ]
 
 [[package]]
 name = "bit-vec"
-version = "0.6.3"
+version = "0.7.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "349f9b6a179ed607305526ca489b34ad0a41aed5f7980fa90eb03160b69598fb"
+checksum = "d2c54ff287cfc0a34f38a6b832ea1bd8e448a330b3e40a50859e6488bee07f22"
 
 [[package]]
 name = "bit_field"
@@ -1195,7 +1195,7 @@ checksum = "96a6ac251f4a2aca6b3f91340350eab87ae57c3f127ffeb585e92bd336717991"
 [[package]]
 name = "d3d12"
 version = "0.20.0"
-source = "git+https://github.com/gfx-rs/wgpu?rev=1e784c9c0af7a785b62e3b6840ed012a7477520f#1e784c9c0af7a785b62e3b6840ed012a7477520f"
+source = "git+https://github.com/gfx-rs/wgpu?rev=f25e07b984ab391628d9568296d5970981d79d8b#f25e07b984ab391628d9568296d5970981d79d8b"
 dependencies = [
  "bitflags 2.6.0",
  "libloading",
@@ -4036,7 +4036,7 @@ checksum = "956787520e75e9bd233246045d19f42fb73242759cc57fba9611d940ae96d4b0"
 [[package]]
 name = "naga"
 version = "0.20.0"
-source = "git+https://github.com/gfx-rs/wgpu?rev=1e784c9c0af7a785b62e3b6840ed012a7477520f#1e784c9c0af7a785b62e3b6840ed012a7477520f"
+source = "git+https://github.com/gfx-rs/wgpu?rev=f25e07b984ab391628d9568296d5970981d79d8b#f25e07b984ab391628d9568296d5970981d79d8b"
 dependencies = [
  "arrayvec",
  "bit-set",
@@ -7385,7 +7385,7 @@ checksum = "53a85b86a771b1c87058196170769dd264f66c0782acf1ae6cc51bfd64b39082"
 [[package]]
 name = "wgpu-core"
 version = "0.20.0"
-source = "git+https://github.com/gfx-rs/wgpu?rev=1e784c9c0af7a785b62e3b6840ed012a7477520f#1e784c9c0af7a785b62e3b6840ed012a7477520f"
+source = "git+https://github.com/gfx-rs/wgpu?rev=f25e07b984ab391628d9568296d5970981d79d8b#f25e07b984ab391628d9568296d5970981d79d8b"
 dependencies = [
  "arrayvec",
  "bit-vec",
@@ -7410,7 +7410,7 @@ dependencies = [
 [[package]]
 name = "wgpu-hal"
 version = "0.20.0"
-source = "git+https://github.com/gfx-rs/wgpu?rev=1e784c9c0af7a785b62e3b6840ed012a7477520f#1e784c9c0af7a785b62e3b6840ed012a7477520f"
+source = "git+https://github.com/gfx-rs/wgpu?rev=f25e07b984ab391628d9568296d5970981d79d8b#f25e07b984ab391628d9568296d5970981d79d8b"
 dependencies = [
  "android_system_properties",
  "arrayvec",
@@ -7451,7 +7451,7 @@ dependencies = [
 [[package]]
 name = "wgpu-types"
 version = "0.20.0"
-source = "git+https://github.com/gfx-rs/wgpu?rev=1e784c9c0af7a785b62e3b6840ed012a7477520f#1e784c9c0af7a785b62e3b6840ed012a7477520f"
+source = "git+https://github.com/gfx-rs/wgpu?rev=f25e07b984ab391628d9568296d5970981d79d8b#f25e07b984ab391628d9568296d5970981d79d8b"
 dependencies = [
  "bitflags 2.6.0",
  "js-sys",

Cargo.toml

@@ -136,8 +136,8 @@ webpki-roots = "0.25"
 webrender = { git = "https://github.com/servo/webrender", branch = "0.64", features = ["capture"] }
 webrender_api = { git = "https://github.com/servo/webrender", branch = "0.64" }
 webrender_traits = { path = "components/shared/webrender" }
-wgpu-core = { git = "https://github.com/gfx-rs/wgpu", rev = "1e784c9c0af7a785b62e3b6840ed012a7477520f" }
+wgpu-core = { git = "https://github.com/gfx-rs/wgpu", rev = "f25e07b984ab391628d9568296d5970981d79d8b" }
-wgpu-types = { git = "https://github.com/gfx-rs/wgpu", rev = "1e784c9c0af7a785b62e3b6840ed012a7477520f" }
+wgpu-types = { git = "https://github.com/gfx-rs/wgpu", rev = "f25e07b984ab391628d9568296d5970981d79d8b" }
 windows-sys = "0.52"
 xi-unicode = "0.1.0"
 xml5ever = "0.18"

components/script/dom/gpucommandencoder.rs

@@ -2,13 +2,12 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
 
-use std::borrow::Cow;
 use std::cell::Cell;
 use std::collections::HashSet;
 
 use dom_struct::dom_struct;
 use webgpu::wgc::command as wgpu_com;
-use webgpu::{self, wgt, WebGPU, WebGPUComputePass, WebGPURequest};
+use webgpu::{self, wgt, WebGPU, WebGPUComputePass, WebGPURenderPass, WebGPURequest};
 
 use super::gpuconvert::convert_label;
 use crate::dom::bindings::cell::DomRefCell;
@@ -134,89 +133,85 @@ impl GPUCommandEncoderMethods for GPUCommandEncoder {
         &self,
         descriptor: &GPURenderPassDescriptor,
     ) -> DomRoot<GPURenderPassEncoder> {
-        let render_pass = if !self.valid.get() {
+        let depth_stencil_attachment = descriptor.depthStencilAttachment.as_ref().map(|depth| {
-            None
+            wgpu_com::RenderPassDepthStencilAttachment {
-        } else {
+                depth: wgpu_com::PassChannel {
-            let depth_stencil = descriptor.depthStencilAttachment.as_ref().map(|depth| {
+                    load_op: convert_load_op(depth.depthLoadOp),
-                wgpu_com::RenderPassDepthStencilAttachment {
+                    store_op: convert_store_op(depth.depthStoreOp),
-                    depth: wgpu_com::PassChannel {
+                    clear_value: *depth.depthClearValue.unwrap_or_default(),
-                        load_op: convert_load_op(depth.depthLoadOp),
+                    read_only: depth.depthReadOnly,
-                        store_op: convert_store_op(depth.depthStoreOp),
+                },
-                        clear_value: *depth.depthClearValue.unwrap_or_default(),
+                stencil: wgpu_com::PassChannel {
-                        read_only: depth.depthReadOnly,
+                    load_op: convert_load_op(depth.stencilLoadOp),
-                    },
+                    store_op: convert_store_op(depth.stencilStoreOp),
-                    stencil: wgpu_com::PassChannel {
+                    clear_value: depth.stencilClearValue,
-                        load_op: convert_load_op(depth.stencilLoadOp),
+                    read_only: depth.stencilReadOnly,
-                        store_op: convert_store_op(depth.stencilStoreOp),
+                },
-                        clear_value: depth.stencilClearValue,
+                view: depth.view.id().0,
-                        read_only: depth.stencilReadOnly,
+            }
-                    },
+        });
-                    view: depth.view.id().0,
-                }
-            });
 
-            let desc = wgpu_com::RenderPassDescriptor {
+        let color_attachments = descriptor
-                color_attachments: Cow::Owned(
+            .colorAttachments
-                    descriptor
+            .iter()
-                        .colorAttachments
+            .map(|color| {
-                        .iter()
+                let channel = wgpu_com::PassChannel {
-                        .map(|color| {
+                    load_op: convert_load_op(Some(color.loadOp)),
-                            let channel = wgpu_com::PassChannel {
+                    store_op: convert_store_op(Some(color.storeOp)),
-                                load_op: convert_load_op(Some(color.loadOp)),
+                    clear_value: if let Some(clear_val) = &color.clearValue {
-                                store_op: convert_store_op(Some(color.storeOp)),
+                        match clear_val {
-                                clear_value: if let Some(clear_val) = &color.clearValue {
+                            DoubleSequenceOrGPUColorDict::DoubleSequence(s) => {
-                                    match clear_val {
+                                let mut w = s.clone();
-                                        DoubleSequenceOrGPUColorDict::DoubleSequence(s) => {
+                                if w.len() < 3 {
-                                            let mut w = s.clone();
+                                    w.resize(3, Finite::wrap(0.0f64));
-                                            if w.len() < 3 {
+                                }
-                                                w.resize(3, Finite::wrap(0.0f64));
+                                w.resize(4, Finite::wrap(1.0f64));
-                                            }
+                                wgt::Color {
-                                            w.resize(4, Finite::wrap(1.0f64));
+                                    r: *w[0],
-                                            wgt::Color {
+                                    g: *w[1],
-                                                r: *w[0],
+                                    b: *w[2],
-                                                g: *w[1],
+                                    a: *w[3],
-                                                b: *w[2],
+                                }
-                                                a: *w[3],
+                            },
-                                            }
+                            DoubleSequenceOrGPUColorDict::GPUColorDict(d) => wgt::Color {
-                                        },
+                                r: *d.r,
-                                        DoubleSequenceOrGPUColorDict::GPUColorDict(d) => {
+                                g: *d.g,
-                                            wgt::Color {
+                                b: *d.b,
-                                                r: *d.r,
+                                a: *d.a,
-                                                g: *d.g,
+                            },
-                                                b: *d.b,
+                        }
-                                                a: *d.a,
+                    } else {
-                                            }
+                        wgt::Color::TRANSPARENT
-                                        },
+                    },
-                                    }
+                    read_only: false,
-                                } else {
+                };
-                                    wgt::Color::TRANSPARENT
+                Some(wgpu_com::RenderPassColorAttachment {
-                                },
+                    resolve_target: color.resolveTarget.as_ref().map(|t| t.id().0),
-                                read_only: false,
+                    channel,
-                            };
+                    view: color.view.id().0,
-                            Some(wgpu_com::RenderPassColorAttachment {
+                })
-                                resolve_target: color.resolveTarget.as_ref().map(|t| t.id().0),
+            })
-                                channel,
+            .collect::<Vec<_>>();
-                                view: color.view.id().0,
+        let render_pass_id = self
-                            })
+            .global()
-                        })
+            .wgpu_id_hub()
-                        .collect::<Vec<_>>(),
+            .create_render_pass_id(self.device.id().0.backend());
-                ),
+
-                depth_stencil_attachment: depth_stencil.as_ref(),
+        if let Err(e) = self.channel.0.send(WebGPURequest::BeginRenderPass {
-                label: descriptor
+            command_encoder_id: self.id().0,
-                    .parent
+            render_pass_id,
-                    .label
+            label: convert_label(&descriptor.parent),
-                    .as_ref()
+            depth_stencil_attachment,
-                    .map(|l| Cow::Borrowed(&**l)),
+            color_attachments,
-                timestamp_writes: None,
+            device_id: self.device.id().0,
-                occlusion_query_set: None,
+        }) {
-            };
+            warn!("Failed to send WebGPURequest::BeginRenderPass {e:?}");
-            Some(wgpu_com::RenderPass::new(self.encoder.0, &desc))
+        }
-        };
 
         GPURenderPassEncoder::new(
             &self.global(),
             self.channel.clone(),
-            render_pass,
+            WebGPURenderPass(render_pass_id),
             self,
             descriptor.parent.label.clone().unwrap_or_default(),
         )

components/script/dom/gpucomputepassencoder.rs

@@ -5,7 +5,6 @@
 use dom_struct::dom_struct;
 use webgpu::{WebGPU, WebGPUComputePass, WebGPURequest};
 
-use super::bindings::error::Fallible;
 use crate::dom::bindings::cell::DomRefCell;
 use crate::dom::bindings::codegen::Bindings::WebGPUBinding::GPUComputePassEncoderMethods;
 use crate::dom::bindings::reflector::{reflect_dom_object, Reflector};
@@ -109,7 +108,7 @@ impl GPUComputePassEncoderMethods for GPUComputePassEncoder {
     }
 
     /// <https://gpuweb.github.io/gpuweb/#dom-gpurenderpassencoder-endpass>
-    fn End(&self) -> Fallible<()> {
+    fn End(&self) {
         if let Err(e) = self.channel.0.send(WebGPURequest::EndComputePass {
             compute_pass_id: self.compute_pass.0,
             device_id: self.command_encoder.device_id().0,
@@ -117,11 +116,9 @@ impl GPUComputePassEncoderMethods for GPUComputePassEncoder {
         }) {
             warn!("Failed to send WebGPURequest::EndComputePass: {e:?}");
         }
-        Ok(())
     }
 
     /// <https://gpuweb.github.io/gpuweb/#dom-gpuprogrammablepassencoder-setbindgroup>
-    #[allow(unsafe_code)]
     fn SetBindGroup(&self, index: u32, bind_group: &GPUBindGroup, offsets: Vec<u32>) {
         if let Err(e) = self.channel.0.send(WebGPURequest::ComputePassSetBindGroup {
             compute_pass_id: self.compute_pass.0,

components/script/dom/gpurenderpassencoder.rs

@@ -3,11 +3,9 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
 
 use dom_struct::dom_struct;
-use webgpu::wgc::command::{render_commands as wgpu_render, RenderPass};
+use webgpu::{wgt, RenderCommand, WebGPU, WebGPURenderPass, WebGPURequest};
-use webgpu::{wgt, WebGPU, WebGPURequest};
 
 use super::bindings::codegen::Bindings::WebGPUBinding::GPUIndexFormat;
-use super::bindings::error::Fallible;
 use crate::dom::bindings::cell::DomRefCell;
 use crate::dom::bindings::codegen::Bindings::WebGPUBinding::{
     GPUColor, GPURenderPassEncoderMethods,
@@ -30,16 +28,15 @@ pub struct GPURenderPassEncoder {
     #[no_trace]
     channel: WebGPU,
     label: DomRefCell<USVString>,
-    #[ignore_malloc_size_of = "defined in wgpu-core"]
     #[no_trace]
-    render_pass: DomRefCell<Option<RenderPass>>,
+    render_pass: WebGPURenderPass,
     command_encoder: Dom<GPUCommandEncoder>,
 }
 
 impl GPURenderPassEncoder {
     fn new_inherited(
         channel: WebGPU,
-        render_pass: Option<RenderPass>,
+        render_pass: WebGPURenderPass,
         parent: &GPUCommandEncoder,
         label: USVString,
     ) -> Self {
@@ -47,7 +44,7 @@ impl GPURenderPassEncoder {
             channel,
             reflector_: Reflector::new(),
             label: DomRefCell::new(label),
-            render_pass: DomRefCell::new(render_pass),
+            render_pass,
             command_encoder: Dom::from_ref(parent),
         }
     }
@@ -55,7 +52,7 @@ impl GPURenderPassEncoder {
     pub fn new(
         global: &GlobalScope,
         channel: WebGPU,
-        render_pass: Option<RenderPass>,
+        render_pass: WebGPURenderPass,
         parent: &GPUCommandEncoder,
         label: USVString,
     ) -> DomRoot<Self> {
@@ -69,6 +66,16 @@ impl GPURenderPassEncoder {
             global,
         )
     }
+
+    fn send_render_command(&self, render_command: RenderCommand) {
+        if let Err(e) = self.channel.0.send(WebGPURequest::RenderPassCommand {
+            render_pass_id: self.render_pass.0,
+            render_command,
+            device_id: self.command_encoder.device_id().0,
+        }) {
+            warn!("Error sending WebGPURequest::RenderPassCommand: {e:?}")
+        }
+    }
 }
 
 impl GPURenderPassEncoderMethods for GPURenderPassEncoder {
@@ -83,16 +90,12 @@ impl GPURenderPassEncoderMethods for GPURenderPassEncoder {
     }
 
     /// <https://gpuweb.github.io/gpuweb/#dom-gpuprogrammablepassencoder-setbindgroup>
-    #[allow(unsafe_code)]
+    fn SetBindGroup(&self, index: u32, bind_group: &GPUBindGroup, offsets: Vec<u32>) {
-    fn SetBindGroup(&self, index: u32, bind_group: &GPUBindGroup, dynamic_offsets: Vec<u32>) {
+        self.send_render_command(RenderCommand::SetBindGroup {
-        if let Some(render_pass) = self.render_pass.borrow_mut().as_mut() {
+            index,
-            wgpu_render::wgpu_render_pass_set_bind_group(
+            bind_group_id: bind_group.id().0,
-                render_pass,
+            offsets,
-                index,
+        })
-                bind_group.id().0,
-                &dynamic_offsets,
-            )
-        }
     }
 
     /// <https://gpuweb.github.io/gpuweb/#dom-gpurenderpassencoder-setviewport>
@@ -105,79 +108,70 @@ impl GPURenderPassEncoderMethods for GPURenderPassEncoder {
         min_depth: Finite<f32>,
         max_depth: Finite<f32>,
     ) {
-        if let Some(render_pass) = self.render_pass.borrow_mut().as_mut() {
+        self.send_render_command(RenderCommand::SetViewport {
-            wgpu_render::wgpu_render_pass_set_viewport(
+            x: *x,
-                render_pass,
+            y: *y,
-                *x,
+            width: *width,
-                *y,
+            height: *height,
-                *width,
+            min_depth: *min_depth,
-                *height,
+            max_depth: *max_depth,
-                *min_depth,
+        })
-                *max_depth,
-            );
-        }
     }
 
     /// <https://gpuweb.github.io/gpuweb/#dom-gpurenderpassencoder-setscissorrect>
     fn SetScissorRect(&self, x: u32, y: u32, width: u32, height: u32) {
-        if let Some(render_pass) = self.render_pass.borrow_mut().as_mut() {
+        self.send_render_command(RenderCommand::SetScissorRect {
-            wgpu_render::wgpu_render_pass_set_scissor_rect(render_pass, x, y, width, height);
+            x,
-        }
+            y,
+            width,
+            height,
+        })
     }
 
     /// <https://gpuweb.github.io/gpuweb/#dom-gpurenderpassencoder-setblendcolor>
     fn SetBlendConstant(&self, color: GPUColor) {
-        if let Some(render_pass) = self.render_pass.borrow_mut().as_mut() {
+        let color = match color {
-            let colors = match color {
+            GPUColor::GPUColorDict(d) => wgt::Color {
-                GPUColor::GPUColorDict(d) => wgt::Color {
+                r: *d.r,
-                    r: *d.r,
+                g: *d.g,
-                    g: *d.g,
+                b: *d.b,
-                    b: *d.b,
+                a: *d.a,
-                    a: *d.a,
+            },
-                },
+            GPUColor::DoubleSequence(mut s) => {
-                GPUColor::DoubleSequence(mut s) => {
+                if s.len() < 3 {
-                    if s.len() < 3 {
+                    s.resize(3, Finite::wrap(0.0f64));
-                        s.resize(3, Finite::wrap(0.0f64));
+                }
-                    }
+                s.resize(4, Finite::wrap(1.0f64));
-                    s.resize(4, Finite::wrap(1.0f64));
+                wgt::Color {
-                    wgt::Color {
+                    r: *s[0],
-                        r: *s[0],
+                    g: *s[1],
-                        g: *s[1],
+                    b: *s[2],
-                        b: *s[2],
+                    a: *s[3],
-                        a: *s[3],
+                }
-                    }
+            },
-                },
+        };
-            };
+        self.send_render_command(RenderCommand::SetBlendConstant(color))
-            wgpu_render::wgpu_render_pass_set_blend_constant(render_pass, &colors);
-        }
     }
 
     /// <https://gpuweb.github.io/gpuweb/#dom-gpurenderpassencoder-setstencilreference>
     fn SetStencilReference(&self, reference: u32) {
-        if let Some(render_pass) = self.render_pass.borrow_mut().as_mut() {
+        self.send_render_command(RenderCommand::SetStencilReference(reference))
-            wgpu_render::wgpu_render_pass_set_stencil_reference(render_pass, reference);
-        }
     }
 
     /// <https://gpuweb.github.io/gpuweb/#dom-gpurenderpassencoder-end>
-    fn End(&self) -> Fallible<()> {
+    fn End(&self) {
-        let render_pass = self.render_pass.borrow_mut().take();
+        if let Err(e) = self.channel.0.send(WebGPURequest::EndRenderPass {
-        self.channel
+            render_pass_id: self.render_pass.0,
-            .0
+            device_id: self.command_encoder.device_id().0,
-            .send(WebGPURequest::EndRenderPass {
+            command_encoder_id: self.command_encoder.id().0,
-                render_pass,
+        }) {
-                device_id: self.command_encoder.device_id().0,
+            warn!("Failed to send WebGPURequest::EndRenderPass: {e:?}");
-            })
+        }
-            .expect("Failed to send RunRenderPass");
-
-        Ok(())
     }
 
     /// <https://gpuweb.github.io/gpuweb/#dom-gpurenderencoderbase-setpipeline>
     fn SetPipeline(&self, pipeline: &GPURenderPipeline) {
-        if let Some(render_pass) = self.render_pass.borrow_mut().as_mut() {
+        self.send_render_command(RenderCommand::SetPipeline(pipeline.id().0))
-            wgpu_render::wgpu_render_pass_set_pipeline(render_pass, pipeline.id().0);
-        }
     }
 
     /// <https://gpuweb.github.io/gpuweb/#dom-gpurendercommandsmixin-setindexbuffer>
@@ -188,44 +182,35 @@ impl GPURenderPassEncoderMethods for GPURenderPassEncoder {
         offset: u64,
         size: u64,
     ) {
-        if let Some(render_pass) = self.render_pass.borrow_mut().as_mut() {
+        self.send_render_command(RenderCommand::SetIndexBuffer {
-            wgpu_render::wgpu_render_pass_set_index_buffer(
+            buffer_id: buffer.id().0,
-                render_pass,
+            index_format: match index_format {
-                buffer.id().0,
+                GPUIndexFormat::Uint16 => wgt::IndexFormat::Uint16,
-                match index_format {
+                GPUIndexFormat::Uint32 => wgt::IndexFormat::Uint32,
-                    GPUIndexFormat::Uint16 => wgt::IndexFormat::Uint16,
+            },
-                    GPUIndexFormat::Uint32 => wgt::IndexFormat::Uint32,
+            offset,
-                },
+            size: wgt::BufferSize::new(size),
-                offset,
+        })
-                wgt::BufferSize::new(size),
-            );
-        }
     }
 
     /// <https://gpuweb.github.io/gpuweb/#dom-gpurenderencoderbase-setvertexbuffer>
     fn SetVertexBuffer(&self, slot: u32, buffer: &GPUBuffer, offset: u64, size: u64) {
-        if let Some(render_pass) = self.render_pass.borrow_mut().as_mut() {
+        self.send_render_command(RenderCommand::SetVertexBuffer {
-            wgpu_render::wgpu_render_pass_set_vertex_buffer(
+            slot,
-                render_pass,
+            buffer_id: buffer.id().0,
-                slot,
+            offset,
-                buffer.id().0,
+            size: wgt::BufferSize::new(size),
-                offset,
+        })
-                wgt::BufferSize::new(size),
-            );
-        }
     }
 
     /// <https://gpuweb.github.io/gpuweb/#dom-gpurenderencoderbase-draw>
     fn Draw(&self, vertex_count: u32, instance_count: u32, first_vertex: u32, first_instance: u32) {
-        if let Some(render_pass) = self.render_pass.borrow_mut().as_mut() {
+        self.send_render_command(RenderCommand::Draw {
-            wgpu_render::wgpu_render_pass_draw(
+            vertex_count,
-                render_pass,
+            instance_count,
-                vertex_count,
+            first_vertex,
-                instance_count,
+            first_instance,
-                first_vertex,
+        })
-                first_instance,
-            );
-        }
     }
 
     /// <https://gpuweb.github.io/gpuweb/#dom-gpurenderencoderbase-drawindexed>
@@ -237,46 +222,47 @@ impl GPURenderPassEncoderMethods for GPURenderPassEncoder {
         base_vertex: i32,
         first_instance: u32,
     ) {
-        if let Some(render_pass) = self.render_pass.borrow_mut().as_mut() {
+        self.send_render_command(RenderCommand::DrawIndexed {
-            wgpu_render::wgpu_render_pass_draw_indexed(
+            index_count,
-                render_pass,
+            instance_count,
-                index_count,
+            first_index,
-                instance_count,
+            base_vertex,
-                first_index,
+            first_instance,
-                base_vertex,
+        })
-                first_instance,
-            );
-        }
     }
 
     /// <https://gpuweb.github.io/gpuweb/#dom-gpurenderencoderbase-drawindirect>
-    fn DrawIndirect(&self, indirect_buffer: &GPUBuffer, indirect_offset: u64) {
+    fn DrawIndirect(&self, buffer: &GPUBuffer, offset: u64) {
-        if let Some(render_pass) = self.render_pass.borrow_mut().as_mut() {
+        self.send_render_command(RenderCommand::DrawIndirect {
-            wgpu_render::wgpu_render_pass_draw_indirect(
+            buffer_id: buffer.id().0,
-                render_pass,
+            offset,
-                indirect_buffer.id().0,
+        })
-                indirect_offset,
-            );
-        }
     }
 
     /// <https://gpuweb.github.io/gpuweb/#dom-gpurenderencoderbase-drawindexedindirect>
-    fn DrawIndexedIndirect(&self, indirect_buffer: &GPUBuffer, indirect_offset: u64) {
+    fn DrawIndexedIndirect(&self, buffer: &GPUBuffer, offset: u64) {
-        if let Some(render_pass) = self.render_pass.borrow_mut().as_mut() {
+        self.send_render_command(RenderCommand::DrawIndexedIndirect {
-            wgpu_render::wgpu_render_pass_draw_indexed_indirect(
+            buffer_id: buffer.id().0,
-                render_pass,
+            offset,
-                indirect_buffer.id().0,
+        })
-                indirect_offset,
-            );
-        }
     }
 
     /// <https://gpuweb.github.io/gpuweb/#dom-gpurenderpassencoder-executebundles>
     #[allow(unsafe_code)]
     fn ExecuteBundles(&self, bundles: Vec<DomRoot<GPURenderBundle>>) {
-        let bundle_ids = bundles.iter().map(|b| b.id().0).collect::<Vec<_>>();
+        let bundle_ids: Vec<_> = bundles.iter().map(|b| b.id().0).collect();
-        if let Some(render_pass) = self.render_pass.borrow_mut().as_mut() {
+        self.send_render_command(RenderCommand::ExecuteBundles(bundle_ids))
-            wgpu_render::wgpu_render_pass_execute_bundles(render_pass, &bundle_ids)
+    }
+}
+
+impl Drop for GPURenderPassEncoder {
+    fn drop(&mut self) {
+        if let Err(e) = self
+            .channel
+            .0
+            .send(WebGPURequest::DropRenderPass(self.render_pass.0))
+        {
+            warn!("Failed to send WebGPURequest::DropRenderPass with {e:?}");
         }
     }
 }

components/script/dom/identityhub.rs

@@ -3,7 +3,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
 
 use smallvec::SmallVec;
-use webgpu::identity::{ComputePass, ComputePassId};
+use webgpu::identity::{ComputePass, ComputePassId, RenderPass, RenderPassId};
 use webgpu::wgc::id::markers::{
     Adapter, BindGroup, BindGroupLayout, Buffer, CommandEncoder, ComputePipeline, Device,
     PipelineLayout, RenderBundle, RenderPipeline, Sampler, ShaderModule, Texture, TextureView,
@@ -33,6 +33,7 @@ pub struct IdentityHub {
     render_pipelines: IdentityManager<RenderPipeline>,
     render_bundles: IdentityManager<RenderBundle>,
     compute_passes: IdentityManager<ComputePass>,
+    render_passes: IdentityManager<RenderPass>,
 }
 
 impl IdentityHub {
@@ -53,6 +54,7 @@ impl IdentityHub {
             render_pipelines: IdentityManager::new(),
             render_bundles: IdentityManager::new(),
             compute_passes: IdentityManager::new(),
+            render_passes: IdentityManager::new(),
         }
     }
 }
@@ -236,6 +238,14 @@ impl Identities {
     pub fn free_compute_pass_id(&self, id: ComputePassId) {
         self.select(id.backend()).compute_passes.free(id);
     }
+
+    pub fn create_render_pass_id(&self, backend: Backend) -> RenderPassId {
+        self.select(backend).render_passes.process(backend)
+    }
+
+    pub fn free_render_pass_id(&self, id: RenderPassId) {
+        self.select(id.backend()).render_passes.free(id);
+    }
 }
 
 impl Default for Identities {

components/script/dom/webidls/WebGPU.webidl

@@ -840,7 +840,6 @@ interface GPUComputePassEncoder {
     //[Pref="dom.webgpu.indirect-dispatch.enabled"]
     undefined dispatchWorkgroupsIndirect(GPUBuffer indirectBuffer, GPUSize64 indirectOffset);
 
-    [Throws]
     undefined end();
 };
 GPUComputePassEncoder includes GPUObjectBase;
@@ -871,7 +870,6 @@ interface GPURenderPassEncoder {
 
     undefined executeBundles(sequence<GPURenderBundle> bundles);
 
-    [Throws]
     undefined end();
 };
 GPURenderPassEncoder includes GPUObjectBase;

components/script/script_thread.rs

@@ -2444,6 +2444,8 @@ impl ScriptThread {
             WebGPUMsg::FreeRenderPipeline(id) => self.gpu_id_hub.free_render_pipeline_id(id),
             WebGPUMsg::FreeTexture(id) => self.gpu_id_hub.free_texture_id(id),
             WebGPUMsg::FreeTextureView(id) => self.gpu_id_hub.free_texture_view_id(id),
+            WebGPUMsg::FreeComputePass(id) => self.gpu_id_hub.free_compute_pass_id(id),
+            WebGPUMsg::FreeRenderPass(id) => self.gpu_id_hub.free_render_pass_id(id),
             WebGPUMsg::Exit => *self.webgpu_port.borrow_mut() = None,
             WebGPUMsg::DeviceLost {
                 pipeline_id,

components/webgpu/dom_messages.rs

@@ -16,7 +16,7 @@ use wgc::binding_model::{
     BindGroupDescriptor, BindGroupLayoutDescriptor, PipelineLayoutDescriptor,
 };
 use wgc::command::{
-    ImageCopyBuffer, ImageCopyTexture, RenderBundleDescriptor, RenderBundleEncoder, RenderPass,
+    ImageCopyBuffer, ImageCopyTexture, RenderBundleDescriptor, RenderBundleEncoder,
 };
 use wgc::device::HostMap;
 use wgc::id;
@@ -25,10 +25,12 @@ use wgc::pipeline::{ComputePipelineDescriptor, RenderPipelineDescriptor};
 use wgc::resource::{
     BufferDescriptor, SamplerDescriptor, TextureDescriptor, TextureViewDescriptor,
 };
+use wgpu_core::command::{RenderPassColorAttachment, RenderPassDepthStencilAttachment};
 use wgpu_core::pipeline::CreateShaderModuleError;
 pub use {wgpu_core as wgc, wgpu_types as wgt};
 
 use crate::identity::*;
+use crate::render_commands::RenderCommand;
 use crate::{Error, ErrorFilter, PopError, WebGPU, PRESENTATION_BUFFER_COUNT};
 
 #[derive(Clone, Debug, Default, Deserialize, Serialize)]
@@ -236,6 +238,7 @@ pub enum WebGPURequest {
     DropRenderBundle(id::RenderBundleId),
     DropQuerySet(id::QuerySetId),
     DropComputePass(id::ComputePassEncoderId),
+    DropRenderPass(id::RenderPassEncoderId),
     Exit(IpcSender<()>),
     RenderBundleEncoderFinish {
         render_bundle_encoder: RenderBundleEncoder,
@@ -255,6 +258,7 @@ pub enum WebGPURequest {
         device_id: id::DeviceId,
         pipeline_id: PipelineId,
     },
+    // Compute Pass
     BeginComputePass {
         command_encoder_id: id::CommandEncoderId,
         compute_pass_id: ComputePassId,
@@ -291,10 +295,25 @@ pub enum WebGPURequest {
         device_id: id::DeviceId,
         command_encoder_id: id::CommandEncoderId,
     },
-    EndRenderPass {
+    // Render Pass
-        render_pass: Option<RenderPass>,
+    BeginRenderPass {
+        command_encoder_id: id::CommandEncoderId,
+        render_pass_id: RenderPassId,
+        label: Option<Cow<'static, str>>,
+        color_attachments: Vec<Option<RenderPassColorAttachment>>,
+        depth_stencil_attachment: Option<RenderPassDepthStencilAttachment>,
         device_id: id::DeviceId,
     },
+    RenderPassCommand {
+        render_pass_id: RenderPassId,
+        render_command: RenderCommand,
+        device_id: id::DeviceId,
+    },
+    EndRenderPass {
+        render_pass_id: RenderPassId,
+        device_id: id::DeviceId,
+        command_encoder_id: id::CommandEncoderId,
+    },
     Submit {
         queue_id: id::QueueId,
         command_buffers: Vec<id::CommandBufferId>,

components/webgpu/identity.rs

@@ -5,13 +5,17 @@
 use malloc_size_of::{MallocSizeOf, MallocSizeOfOps};
 use serde::{Deserialize, Serialize};
 
-pub use crate::wgc::id::markers::ComputePassEncoder as ComputePass;
+pub use crate::wgc::id::markers::{
-pub use crate::wgc::id::ComputePassEncoderId as ComputePassId;
+    ComputePassEncoder as ComputePass, RenderPassEncoder as RenderPass,
+};
 use crate::wgc::id::{
     AdapterId, BindGroupId, BindGroupLayoutId, BufferId, CommandBufferId, CommandEncoderId,
     ComputePipelineId, DeviceId, PipelineLayoutId, QueueId, RenderBundleId, RenderPipelineId,
     SamplerId, ShaderModuleId, SurfaceId, TextureId, TextureViewId,
 };
+pub use crate::wgc::id::{
+    ComputePassEncoderId as ComputePassId, RenderPassEncoderId as RenderPassId,
+};
 
 macro_rules! webgpu_resource {
     ($name:ident, $id:ty) => {
@@ -46,3 +50,4 @@ webgpu_resource!(WebGPUSurface, SurfaceId);
 webgpu_resource!(WebGPUTexture, TextureId);
 webgpu_resource!(WebGPUTextureView, TextureViewId);
 webgpu_resource!(WebGPUComputePass, ComputePassId);
+webgpu_resource!(WebGPURenderPass, RenderPassId);

components/webgpu/lib.rs

@@ -19,6 +19,7 @@ use arrayvec::ArrayVec;
 use euclid::default::Size2D;
 pub use gpu_error::{Error, ErrorFilter, PopError};
 use ipc_channel::ipc::{self, IpcReceiver, IpcSender};
+pub use render_commands::RenderCommand;
 use serde::{Deserialize, Serialize};
 use servo_config::pref;
 use webrender_api::{DocumentId, ImageData, ImageDescriptor, ImageKey};
@@ -29,6 +30,7 @@ use wgc::id;
 
 mod dom_messages;
 mod gpu_error;
+mod render_commands;
 mod script_messages;
 pub use dom_messages::*;
 pub use identity::*;

components/webgpu/render_commands.rs

@@ -0,0 +1,151 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
+
+//! Render pass commands
+
+use serde::{Deserialize, Serialize};
+use wgpu_core::command::{DynRenderPass, RenderPassError};
+use wgpu_core::global::Global;
+
+use crate::wgc::id;
+use crate::wgt;
+
+/// <https://github.com/gfx-rs/wgpu/blob/f25e07b984ab391628d9568296d5970981d79d8b/wgpu-core/src/command/render_command.rs#L17>
+#[derive(Debug, Deserialize, Serialize)]
+pub enum RenderCommand {
+    SetPipeline(id::RenderPipelineId),
+    SetBindGroup {
+        index: u32,
+        bind_group_id: id::BindGroupId,
+        offsets: Vec<u32>,
+    },
+    SetViewport {
+        x: f32,
+        y: f32,
+        width: f32,
+        height: f32,
+        min_depth: f32,
+        max_depth: f32,
+    },
+    SetScissorRect {
+        x: u32,
+        y: u32,
+        width: u32,
+        height: u32,
+    },
+    SetBlendConstant(wgt::Color),
+    SetStencilReference(u32),
+    SetIndexBuffer {
+        buffer_id: id::BufferId,
+        index_format: wgt::IndexFormat,
+        offset: u64,
+        size: Option<wgt::BufferSize>,
+    },
+    SetVertexBuffer {
+        slot: u32,
+        buffer_id: id::BufferId,
+        offset: u64,
+        size: Option<wgt::BufferSize>,
+    },
+    Draw {
+        vertex_count: u32,
+        instance_count: u32,
+        first_vertex: u32,
+        first_instance: u32,
+    },
+    DrawIndexed {
+        index_count: u32,
+        instance_count: u32,
+        first_index: u32,
+        base_vertex: i32,
+        first_instance: u32,
+    },
+    DrawIndirect {
+        buffer_id: id::BufferId,
+        offset: u64,
+    },
+    DrawIndexedIndirect {
+        buffer_id: id::BufferId,
+        offset: u64,
+    },
+    ExecuteBundles(Vec<id::RenderBundleId>),
+}
+
+pub fn apply_render_command(
+    context: &Global,
+    pass: &mut Box<dyn DynRenderPass>,
+    command: RenderCommand,
+) -> Result<(), RenderPassError> {
+    match command {
+        RenderCommand::SetPipeline(pipeline_id) => pass.set_pipeline(context, pipeline_id),
+        RenderCommand::SetBindGroup {
+            index,
+            bind_group_id,
+            offsets,
+        } => pass.set_bind_group(context, index, bind_group_id, &offsets),
+        RenderCommand::SetViewport {
+            x,
+            y,
+            width,
+            height,
+            min_depth,
+            max_depth,
+        } => pass.set_viewport(context, x, y, width, height, min_depth, max_depth),
+        RenderCommand::SetScissorRect {
+            x,
+            y,
+            width,
+            height,
+        } => pass.set_scissor_rect(context, x, y, width, height),
+        RenderCommand::SetBlendConstant(color) => pass.set_blend_constant(context, color),
+        RenderCommand::SetStencilReference(reference) => {
+            pass.set_stencil_reference(context, reference)
+        },
+        RenderCommand::SetIndexBuffer {
+            buffer_id,
+            index_format,
+            offset,
+            size,
+        } => pass.set_index_buffer(context, buffer_id, index_format, offset, size),
+        RenderCommand::SetVertexBuffer {
+            slot,
+            buffer_id,
+            offset,
+            size,
+        } => pass.set_vertex_buffer(context, slot, buffer_id, offset, size),
+        RenderCommand::Draw {
+            vertex_count,
+            instance_count,
+            first_vertex,
+            first_instance,
+        } => pass.draw(
+            context,
+            vertex_count,
+            instance_count,
+            first_vertex,
+            first_instance,
+        ),
+        RenderCommand::DrawIndexed {
+            index_count,
+            instance_count,
+            first_index,
+            base_vertex,
+            first_instance,
+        } => pass.draw_indexed(
+            context,
+            index_count,
+            instance_count,
+            first_index,
+            base_vertex,
+            first_instance,
+        ),
+        RenderCommand::DrawIndirect { buffer_id, offset } => {
+            pass.draw_indirect(context, buffer_id, offset)
+        },
+        RenderCommand::DrawIndexedIndirect { buffer_id, offset } => {
+            pass.draw_indexed_indirect(context, buffer_id, offset)
+        },
+        RenderCommand::ExecuteBundles(bundles) => pass.execute_bundles(context, &bundles),
+    }
+}

components/webgpu/script_messages.rs

@@ -11,8 +11,9 @@ use crate::gpu_error::Error;
 use crate::identity::WebGPUDevice;
 use crate::wgc::id::{
     AdapterId, BindGroupId, BindGroupLayoutId, BufferId, CommandBufferId, ComputePassEncoderId,
-    ComputePipelineId, DeviceId, PipelineLayoutId, QuerySetId, RenderBundleId, RenderPipelineId,
+    ComputePipelineId, DeviceId, PipelineLayoutId, QuerySetId, RenderBundleId, RenderPassEncoderId,
-    SamplerId, ShaderModuleId, StagingBufferId, SurfaceId, TextureId, TextureViewId,
+    RenderPipelineId, SamplerId, ShaderModuleId, StagingBufferId, SurfaceId, TextureId,
+    TextureViewId,
 };
 
 /// <https://gpuweb.github.io/gpuweb/#enumdef-gpudevicelostreason>
@@ -45,6 +46,7 @@ pub enum WebGPUMsg {
     FreeStagingBuffer(StagingBufferId),
     FreeQuerySet(QuerySetId),
     FreeComputePass(ComputePassEncoderId),
+    FreeRenderPass(RenderPassEncoderId),
     UncapturedError {
         device: WebGPUDevice,
         pipeline_id: PipelineId,

components/webgpu/wgpu_thread.rs

@@ -18,7 +18,9 @@ use servo_config::pref;
 use webrender::{RenderApi, RenderApiSender, Transaction};
 use webrender_api::{DirtyRect, DocumentId};
 use webrender_traits::{WebrenderExternalImageRegistry, WebrenderImageHandlerType};
-use wgc::command::{ImageCopyBuffer, ImageCopyTexture};
+use wgc::command::{
+    ComputePassDescriptor, DynComputePass, DynRenderPass, ImageCopyBuffer, ImageCopyTexture,
+};
 use wgc::device::queue::SubmittedWorkDoneClosure;
 use wgc::device::{DeviceDescriptor, DeviceLostClosure, HostMap, ImplicitPipelineIds};
 use wgc::id::DeviceId;
@@ -26,15 +28,16 @@ use wgc::instance::parse_backends_from_comma_list;
 use wgc::pipeline::ShaderModuleDescriptor;
 use wgc::resource::{BufferMapCallback, BufferMapOperation};
 use wgc::{gfx_select, id};
-use wgpu_core::command::{ComputePassDescriptor, DynComputePass};
+use wgpu_core::command::RenderPassDescriptor;
 use wgt::InstanceDescriptor;
 pub use {wgpu_core as wgc, wgpu_types as wgt};
 
 use crate::gpu_error::ErrorScope;
 use crate::poll_thread::Poller;
+use crate::render_commands::apply_render_command;
 use crate::{
-    ComputePassId, Error, PopError, PresentationData, Transmute, WebGPU, WebGPUAdapter,
+    ComputePassId, Error, PopError, PresentationData, RenderPassId, Transmute, WebGPU,
-    WebGPUDevice, WebGPUMsg, WebGPUQueue, WebGPURequest, WebGPUResponse,
+    WebGPUAdapter, WebGPUDevice, WebGPUMsg, WebGPUQueue, WebGPURequest, WebGPUResponse,
 };
 
 pub const PRESENTATION_BUFFER_COUNT: usize = 10;
@@ -64,6 +67,34 @@ impl DeviceScope {
     }
 }
 
+/// This roughly matches <https://www.w3.org/TR/2024/WD-webgpu-20240703/#encoder-state>
+#[derive(Debug, Default, Eq, PartialEq)]
+enum Pass<P: ?Sized> {
+    /// Pass is open (not ended)
+    Open {
+        /// Actual pass
+        pass: Box<P>,
+        /// we need to store valid field
+        /// because wgpu does not invalidate pass on error
+        valid: bool,
+    },
+    /// When pass is ended we need to drop it so we replace it with this
+    #[default]
+    Ended,
+}
+
+impl<P: ?Sized> Pass<P> {
+    /// Creates new open pass
+    fn new(pass: Box<P>, valid: bool) -> Self {
+        Self::Open { pass, valid }
+    }
+
+    /// Replaces pass with ended
+    fn take(&mut self) -> Self {
+        std::mem::take(self)
+    }
+}
+
 #[allow(clippy::upper_case_acronyms)] // Name of the library
 pub(crate) struct WGPU {
     receiver: IpcReceiver<WebGPURequest>,
@@ -85,9 +116,10 @@ pub(crate) struct WGPU {
     wgpu_image_map: Arc<Mutex<HashMap<u64, PresentationData>>>,
     /// Provides access to poller thread
     poller: Poller,
-    /// Store compute passes (that have not ended yet) and their validity
+    /// Store compute passes
-    compute_passes: HashMap<ComputePassId, (Box<dyn DynComputePass>, bool)>,
+    compute_passes: HashMap<ComputePassId, Pass<dyn DynComputePass>>,
-    //render_passes: HashMap<RenderPassId, Box<dyn DynRenderPass>>,
+    /// Store render passes
+    render_passes: HashMap<RenderPassId, Pass<dyn DynRenderPass>>,
 }
 
 impl WGPU {
@@ -132,6 +164,7 @@ impl WGPU {
             external_images,
             wgpu_image_map,
             compute_passes: HashMap::new(),
+            render_passes: HashMap::new(),
         }
     }
 
@@ -774,7 +807,7 @@ impl WGPU {
                         ));
                         assert!(
                             self.compute_passes
-                                .insert(compute_pass_id, (pass, error.is_none()))
+                                .insert(compute_pass_id, Pass::new(pass, error.is_none()))
                                 .is_none(),
                             "ComputePass should not exist yet."
                         );
@@ -786,7 +819,11 @@ impl WGPU {
                         pipeline_id,
                         device_id,
                     } => {
-                        if let Some((pass, valid)) = self.compute_passes.get_mut(&compute_pass_id) {
+                        let pass = self
+                            .compute_passes
+                            .get_mut(&compute_pass_id)
+                            .expect("ComputePass should exists");
+                        if let Pass::Open { pass, valid } = pass {
                             *valid &= pass.set_pipeline(&self.global, pipeline_id).is_ok();
                         } else {
                             self.maybe_dispatch_error(
@@ -802,7 +839,11 @@ impl WGPU {
                         offsets,
                         device_id,
                     } => {
-                        if let Some((pass, valid)) = self.compute_passes.get_mut(&compute_pass_id) {
+                        let pass = self
+                            .compute_passes
+                            .get_mut(&compute_pass_id)
+                            .expect("ComputePass should exists");
+                        if let Pass::Open { pass, valid } = pass {
                             *valid &= pass
                                 .set_bind_group(&self.global, index, bind_group_id, &offsets)
                                 .is_ok();
@@ -820,7 +861,11 @@ impl WGPU {
                         z,
                         device_id,
                     } => {
-                        if let Some((pass, valid)) = self.compute_passes.get_mut(&compute_pass_id) {
+                        let pass = self
+                            .compute_passes
+                            .get_mut(&compute_pass_id)
+                            .expect("ComputePass should exists");
+                        if let Pass::Open { pass, valid } = pass {
                             *valid &= pass.dispatch_workgroups(&self.global, x, y, z).is_ok();
                         } else {
                             self.maybe_dispatch_error(
@@ -835,7 +880,11 @@ impl WGPU {
                         offset,
                         device_id,
                     } => {
-                        if let Some((pass, valid)) = self.compute_passes.get_mut(&compute_pass_id) {
+                        let pass = self
+                            .compute_passes
+                            .get_mut(&compute_pass_id)
+                            .expect("ComputePass should exists");
+                        if let Pass::Open { pass, valid } = pass {
                             *valid &= pass
                                 .dispatch_workgroups_indirect(&self.global, buffer_id, offset)
                                 .is_ok();
@@ -851,10 +900,15 @@ impl WGPU {
                         device_id,
                         command_encoder_id,
                     } => {
+                        // https://www.w3.org/TR/2024/WD-webgpu-20240703/#dom-gpucomputepassencoder-end
+                        let pass = self
+                            .compute_passes
+                            .get_mut(&compute_pass_id)
+                            .expect("ComputePass should exists");
                         // TODO: Command encoder state error
-                        if let Some((mut pass, valid)) =
+                        if let Pass::Open { mut pass, valid } = pass.take() {
-                            self.compute_passes.remove(&compute_pass_id)
+                            // `pass.end` does step 1-4
-                        {
+                            // and if it returns ok we check the validity of the pass at step 5
                             if pass.end(&self.global).is_ok() && !valid {
                                 self.encoder_record_error(
                                     command_encoder_id,
@@ -868,21 +922,81 @@ impl WGPU {
                             );
                         };
                     },
-                    WebGPURequest::EndRenderPass {
+                    WebGPURequest::BeginRenderPass {
-                        render_pass,
+                        command_encoder_id,
+                        render_pass_id,
+                        label,
+                        color_attachments,
+                        depth_stencil_attachment,
+                        device_id: _device_id,
+                    } => {
+                        let global = &self.global;
+                        let desc = &RenderPassDescriptor {
+                            label,
+                            color_attachments: color_attachments.into(),
+                            depth_stencil_attachment: depth_stencil_attachment.as_ref(),
+                            timestamp_writes: None,
+                            occlusion_query_set: None,
+                        };
+                        let (pass, error) = gfx_select!(
+                            command_encoder_id => global.command_encoder_create_render_pass_dyn(
+                                command_encoder_id,
+                                desc,
+                        ));
+                        assert!(
+                            self.render_passes
+                                .insert(render_pass_id, Pass::new(pass, error.is_none()))
+                                .is_none(),
+                            "RenderPass should not exist yet."
+                        );
+                        // TODO: Command encoder state errors
+                        // self.maybe_dispatch_wgpu_error(device_id, error);
+                    },
+                    WebGPURequest::RenderPassCommand {
+                        render_pass_id,
+                        render_command,
                         device_id,
                     } => {
-                        if let Some(render_pass) = render_pass {
+                        let pass = self
-                            let command_encoder_id = render_pass.parent_id();
+                            .render_passes
-                            let global = &self.global;
+                            .get_mut(&render_pass_id)
-                            let result = gfx_select!(command_encoder_id => global.render_pass_end(&render_pass));
+                            .expect("RenderPass should exists");
-                            self.maybe_dispatch_wgpu_error(device_id, result.err())
+                        if let Pass::Open { pass, valid } = pass {
+                            *valid &=
+                                apply_render_command(&self.global, pass, render_command).is_ok();
+                        } else {
+                            self.maybe_dispatch_error(
+                                device_id,
+                                Some(Error::Validation("pass already ended".to_string())),
+                            );
+                        };
+                    },
+                    WebGPURequest::EndRenderPass {
+                        render_pass_id,
+                        device_id,
+                        command_encoder_id,
+                    } => {
+                        // https://www.w3.org/TR/2024/WD-webgpu-20240703/#dom-gpurenderpassencoder-end
+                        let pass = self
+                            .render_passes
+                            .get_mut(&render_pass_id)
+                            .expect("RenderPass should exists");
+                        // TODO: Command encoder state error
+                        if let Pass::Open { mut pass, valid } = pass.take() {
+                            // `pass.end` does step 1-4
+                            // and if it returns ok we check the validity of the pass at step 5
+                            if pass.end(&self.global).is_ok() && !valid {
+                                self.encoder_record_error(
+                                    command_encoder_id,
+                                    &Err::<(), _>("Pass is invalid".to_string()),
+                                );
+                            }
                         } else {
                             self.dispatch_error(
                                 device_id,
-                                Error::Validation("Render pass already ended".to_string()),
+                                Error::Validation("Pass already ended".to_string()),
-                            )
+                            );
-                        }
+                        };
                     },
                     WebGPURequest::Submit {
                         queue_id,
@@ -1171,12 +1285,20 @@ impl WGPU {
                         };
                     },
                     WebGPURequest::DropComputePass(id) => {
-                        // Compute pass might have already ended
+                        // Pass might have already ended.
                         self.compute_passes.remove(&id);
                         if let Err(e) = self.script_sender.send(WebGPUMsg::FreeComputePass(id)) {
                             warn!("Unable to send FreeComputePass({:?}) ({:?})", id, e);
                         };
                     },
+                    WebGPURequest::DropRenderPass(id) => {
+                        self.render_passes
+                            .remove(&id)
+                            .expect("RenderPass should exists");
+                        if let Err(e) = self.script_sender.send(WebGPUMsg::FreeRenderPass(id)) {
+                            warn!("Unable to send FreeRenderPass({:?}) ({:?})", id, e);
+                        };
+                    },
                     WebGPURequest::DropRenderPipeline(id) => {
                         let global = &self.global;
                         gfx_select!(id => global.render_pipeline_drop(id));