script/dom/html/
htmlcanvaselement.rs

1/* This Source Code Form is subject to the terms of the Mozilla Public
2 * License, v. 2.0. If a copy of the MPL was not distributed with this
3 * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
4
5use std::cell::{Cell, RefCell};
6use std::rc::Rc;
7
8use canvas_traits::webgl::{GLContextAttributes, WebGLVersion};
9use constellation_traits::BlobImpl;
10#[cfg(feature = "webgpu")]
11use constellation_traits::ScriptToConstellationMessage;
12use dom_struct::dom_struct;
13use euclid::default::Size2D;
14use html5ever::{LocalName, Prefix, local_name, ns};
15#[cfg(feature = "webgpu")]
16use ipc_channel::ipc::{self as ipcchan};
17use js::error::throw_type_error;
18use js::rust::{HandleObject, HandleValue};
19use layout_api::HTMLCanvasData;
20use pixels::{EncodedImageType, Snapshot};
21use rustc_hash::FxHashMap;
22use script_bindings::weakref::WeakRef;
23use servo_media::streams::MediaStreamType;
24use servo_media::streams::registry::MediaStreamId;
25use style::attr::AttrValue;
26
27use crate::canvas_context::{CanvasContext, LayoutCanvasRenderingContextHelpers, RenderingContext};
28use crate::conversions::Convert;
29use crate::dom::attr::Attr;
30use crate::dom::bindings::callback::ExceptionHandling;
31use crate::dom::bindings::cell::{DomRefCell, Ref};
32use crate::dom::bindings::codegen::Bindings::HTMLCanvasElementBinding::{
33    BlobCallback, HTMLCanvasElementMethods, RenderingContext as RootedRenderingContext,
34};
35use crate::dom::bindings::codegen::Bindings::MediaStreamBinding::MediaStreamMethods;
36use crate::dom::bindings::codegen::Bindings::WebGLRenderingContextBinding::WebGLContextAttributes;
37use crate::dom::bindings::codegen::UnionTypes::HTMLCanvasElementOrOffscreenCanvas as RootedHTMLCanvasElementOrOffscreenCanvas;
38use crate::dom::bindings::conversions::ConversionResult;
39use crate::dom::bindings::error::{Error, Fallible};
40use crate::dom::bindings::inheritance::Castable;
41use crate::dom::bindings::num::Finite;
42use crate::dom::bindings::refcounted::Trusted;
43use crate::dom::bindings::reflector::{DomGlobal, DomObject};
44use crate::dom::bindings::root::{Dom, DomRoot, LayoutDom, ToLayout};
45use crate::dom::bindings::str::{DOMString, USVString};
46use crate::dom::blob::Blob;
47use crate::dom::canvasrenderingcontext2d::CanvasRenderingContext2D;
48use crate::dom::document::Document;
49use crate::dom::element::{AttributeMutation, Element, LayoutElementHelpers};
50#[cfg(not(feature = "webgpu"))]
51use crate::dom::gpucanvascontext::GPUCanvasContext;
52use crate::dom::html::htmlelement::HTMLElement;
53use crate::dom::imagebitmaprenderingcontext::ImageBitmapRenderingContext;
54use crate::dom::mediastream::MediaStream;
55use crate::dom::mediastreamtrack::MediaStreamTrack;
56use crate::dom::node::{Node, NodeDamage, NodeTraits};
57use crate::dom::offscreencanvas::OffscreenCanvas;
58use crate::dom::values::UNSIGNED_LONG_MAX;
59use crate::dom::virtualmethods::VirtualMethods;
60use crate::dom::webgl::webgl2renderingcontext::WebGL2RenderingContext;
61use crate::dom::webgl::webglrenderingcontext::WebGLRenderingContext;
62#[cfg(feature = "webgpu")]
63use crate::dom::webgpu::gpucanvascontext::GPUCanvasContext;
64use crate::script_runtime::{CanGc, JSContext};
65
66const DEFAULT_WIDTH: u32 = 300;
67const DEFAULT_HEIGHT: u32 = 150;
68
69/// <https://html.spec.whatwg.org/multipage/#htmlcanvaselement>
70#[dom_struct]
71pub(crate) struct HTMLCanvasElement {
72    htmlelement: HTMLElement,
73
74    /// <https://html.spec.whatwg.org/multipage/#concept-canvas-context-mode>
75    context_mode: DomRefCell<Option<RenderingContext>>,
76
77    // This id and hashmap are used to keep track of ongoing toBlob() calls.
78    callback_id: Cell<u32>,
79    #[conditional_malloc_size_of]
80    blob_callbacks: RefCell<FxHashMap<u32, Rc<BlobCallback>>>,
81}
82
83impl HTMLCanvasElement {
84    fn new_inherited(
85        local_name: LocalName,
86        prefix: Option<Prefix>,
87        document: &Document,
88    ) -> HTMLCanvasElement {
89        HTMLCanvasElement {
90            htmlelement: HTMLElement::new_inherited(local_name, prefix, document),
91            context_mode: DomRefCell::new(None),
92            callback_id: Cell::new(0),
93            blob_callbacks: RefCell::new(FxHashMap::default()),
94        }
95    }
96
97    #[cfg_attr(crown, allow(crown::unrooted_must_root))]
98    pub(crate) fn new(
99        local_name: LocalName,
100        prefix: Option<Prefix>,
101        document: &Document,
102        proto: Option<HandleObject>,
103        can_gc: CanGc,
104    ) -> DomRoot<HTMLCanvasElement> {
105        Node::reflect_node_with_proto(
106            Box::new(HTMLCanvasElement::new_inherited(
107                local_name, prefix, document,
108            )),
109            document,
110            proto,
111            can_gc,
112        )
113    }
114
115    fn recreate_contexts_after_resize(&self) {
116        if let Some(ref context) = *self.context_mode.borrow() {
117            context.resize()
118        }
119    }
120
121    pub(crate) fn get_size(&self) -> Size2D<u32> {
122        Size2D::new(self.Width(), self.Height())
123    }
124
125    pub(crate) fn origin_is_clean(&self) -> bool {
126        match *self.context_mode.borrow() {
127            Some(ref context) => context.origin_is_clean(),
128            _ => true,
129        }
130    }
131
132    pub(crate) fn mark_as_dirty(&self) {
133        if let Some(ref context) = *self.context_mode.borrow() {
134            context.mark_as_dirty()
135        }
136    }
137
138    pub(crate) fn set_natural_width(&self, value: u32, can_gc: CanGc) {
139        let value = if value > UNSIGNED_LONG_MAX {
140            DEFAULT_WIDTH
141        } else {
142            value
143        };
144        let element = self.upcast::<Element>();
145        element.set_uint_attribute(&html5ever::local_name!("width"), value, can_gc);
146    }
147
148    pub(crate) fn set_natural_height(&self, value: u32, can_gc: CanGc) {
149        let value = if value > UNSIGNED_LONG_MAX {
150            DEFAULT_HEIGHT
151        } else {
152            value
153        };
154        let element = self.upcast::<Element>();
155        element.set_uint_attribute(&html5ever::local_name!("height"), value, can_gc);
156    }
157}
158
159pub(crate) trait LayoutHTMLCanvasElementHelpers {
160    fn data(self) -> HTMLCanvasData;
161}
162
163impl LayoutHTMLCanvasElementHelpers for LayoutDom<'_, HTMLCanvasElement> {
164    #[allow(unsafe_code)]
165    fn data(self) -> HTMLCanvasData {
166        let source = unsafe {
167            match self.unsafe_get().context_mode.borrow_for_layout().as_ref() {
168                Some(RenderingContext::Context2d(context)) => {
169                    context.to_layout().canvas_data_source()
170                },
171                Some(RenderingContext::BitmapRenderer(context)) => {
172                    context.to_layout().canvas_data_source()
173                },
174                Some(RenderingContext::WebGL(context)) => context.to_layout().canvas_data_source(),
175                Some(RenderingContext::WebGL2(context)) => context.to_layout().canvas_data_source(),
176                #[cfg(feature = "webgpu")]
177                Some(RenderingContext::WebGPU(context)) => context.to_layout().canvas_data_source(),
178                Some(RenderingContext::Placeholder(_)) | None => None,
179            }
180        };
181
182        let width_attr = self
183            .upcast::<Element>()
184            .get_attr_for_layout(&ns!(), &local_name!("width"));
185        let height_attr = self
186            .upcast::<Element>()
187            .get_attr_for_layout(&ns!(), &local_name!("height"));
188        HTMLCanvasData {
189            source,
190            width: width_attr.map_or(DEFAULT_WIDTH, |val| val.as_uint()),
191            height: height_attr.map_or(DEFAULT_HEIGHT, |val| val.as_uint()),
192        }
193    }
194}
195
196impl HTMLCanvasElement {
197    pub(crate) fn context(&self) -> Option<Ref<'_, RenderingContext>> {
198        Ref::filter_map(self.context_mode.borrow(), |ctx| ctx.as_ref()).ok()
199    }
200
201    fn get_or_init_2d_context(&self, can_gc: CanGc) -> Option<DomRoot<CanvasRenderingContext2D>> {
202        if let Some(ctx) = self.context() {
203            return match *ctx {
204                RenderingContext::Context2d(ref ctx) => Some(DomRoot::from_ref(ctx)),
205                _ => None,
206            };
207        }
208
209        let window = self.owner_window();
210        let size = self.get_size();
211        let context = CanvasRenderingContext2D::new(window.as_global_scope(), self, size, can_gc)?;
212
213        self.context_mode
214            .borrow_mut()
215            .replace(RenderingContext::Context2d(Dom::from_ref(&*context)));
216        self.upcast::<Node>().dirty(NodeDamage::ContentOrHeritage);
217
218        Some(context)
219    }
220
221    /// <https://html.spec.whatwg.org/multipage/#canvas-context-bitmaprenderer>
222    fn get_or_init_bitmaprenderer_context(
223        &self,
224        can_gc: CanGc,
225    ) -> Option<DomRoot<ImageBitmapRenderingContext>> {
226        // Return the same object as was returned the last time the method was
227        // invoked with this same first argument.
228        if let Some(ctx) = self.context() {
229            return match *ctx {
230                RenderingContext::BitmapRenderer(ref ctx) => Some(DomRoot::from_ref(ctx)),
231                _ => None,
232            };
233        }
234
235        // Step 1. Let context be the result of running the
236        // ImageBitmapRenderingContext creation algorithm given this and
237        // options.
238        let canvas =
239            RootedHTMLCanvasElementOrOffscreenCanvas::HTMLCanvasElement(DomRoot::from_ref(self));
240
241        let context = ImageBitmapRenderingContext::new(&self.owner_global(), &canvas, can_gc);
242
243        // Step 2. Set this's context mode to bitmaprenderer.
244        self.context_mode
245            .borrow_mut()
246            .replace(RenderingContext::BitmapRenderer(Dom::from_ref(&*context)));
247        self.upcast::<Node>().dirty(NodeDamage::ContentOrHeritage);
248
249        // Step 3. Return context.
250        Some(context)
251    }
252
253    fn get_or_init_webgl_context(
254        &self,
255        cx: JSContext,
256        options: HandleValue,
257        can_gc: CanGc,
258    ) -> Option<DomRoot<WebGLRenderingContext>> {
259        if let Some(ctx) = self.context() {
260            return match *ctx {
261                RenderingContext::WebGL(ref ctx) => Some(DomRoot::from_ref(ctx)),
262                _ => None,
263            };
264        }
265        let window = self.owner_window();
266        let canvas =
267            RootedHTMLCanvasElementOrOffscreenCanvas::HTMLCanvasElement(DomRoot::from_ref(self));
268        let size = self.get_size();
269        let attrs = Self::get_gl_attributes(cx, options, can_gc)?;
270        let context = WebGLRenderingContext::new(
271            &window,
272            &canvas,
273            WebGLVersion::WebGL1,
274            size,
275            attrs,
276            can_gc,
277        )?;
278
279        self.context_mode
280            .borrow_mut()
281            .replace(RenderingContext::WebGL(Dom::from_ref(&*context)));
282        self.upcast::<Node>().dirty(NodeDamage::ContentOrHeritage);
283
284        Some(context)
285    }
286
287    fn get_or_init_webgl2_context(
288        &self,
289        cx: JSContext,
290        options: HandleValue,
291        can_gc: CanGc,
292    ) -> Option<DomRoot<WebGL2RenderingContext>> {
293        if !WebGL2RenderingContext::is_webgl2_enabled(cx, self.global().reflector().get_jsobject())
294        {
295            return None;
296        }
297        if let Some(ctx) = self.context() {
298            return match *ctx {
299                RenderingContext::WebGL2(ref ctx) => Some(DomRoot::from_ref(ctx)),
300                _ => None,
301            };
302        }
303        let window = self.owner_window();
304        let canvas =
305            RootedHTMLCanvasElementOrOffscreenCanvas::HTMLCanvasElement(DomRoot::from_ref(self));
306        let size = self.get_size();
307        let attrs = Self::get_gl_attributes(cx, options, can_gc)?;
308        let context = WebGL2RenderingContext::new(&window, &canvas, size, attrs, can_gc)?;
309
310        self.context_mode
311            .borrow_mut()
312            .replace(RenderingContext::WebGL2(Dom::from_ref(&*context)));
313        self.upcast::<Node>().dirty(NodeDamage::ContentOrHeritage);
314
315        Some(context)
316    }
317
318    #[cfg(not(feature = "webgpu"))]
319    fn get_or_init_webgpu_context(&self) -> Option<DomRoot<GPUCanvasContext>> {
320        None
321    }
322
323    #[cfg(feature = "webgpu")]
324    fn get_or_init_webgpu_context(&self, can_gc: CanGc) -> Option<DomRoot<GPUCanvasContext>> {
325        if let Some(ctx) = self.context() {
326            return match *ctx {
327                RenderingContext::WebGPU(ref ctx) => Some(DomRoot::from_ref(ctx)),
328                _ => None,
329            };
330        }
331        let (sender, receiver) = ipcchan::channel().unwrap();
332        let global_scope = self.owner_global();
333        let _ = global_scope
334            .script_to_constellation_chan()
335            .send(ScriptToConstellationMessage::GetWebGPUChan(sender));
336        receiver
337            .recv()
338            .expect("Failed to get WebGPU channel")
339            .map(|channel| {
340                let context = GPUCanvasContext::new(&global_scope, self, channel, can_gc);
341
342                self.context_mode
343                    .borrow_mut()
344                    .replace(RenderingContext::WebGPU(Dom::from_ref(&*context)));
345                self.upcast::<Node>().dirty(NodeDamage::ContentOrHeritage);
346
347                context
348            })
349    }
350
351    /// Gets the base WebGLRenderingContext for WebGL or WebGL 2, if exists.
352    pub(crate) fn get_base_webgl_context(&self) -> Option<DomRoot<WebGLRenderingContext>> {
353        match *self.context_mode.borrow() {
354            Some(RenderingContext::WebGL(ref context)) => Some(DomRoot::from_ref(context)),
355            Some(RenderingContext::WebGL2(ref context)) => Some(context.base_context()),
356            _ => None,
357        }
358    }
359
360    #[allow(unsafe_code)]
361    fn get_gl_attributes(
362        cx: JSContext,
363        options: HandleValue,
364        can_gc: CanGc,
365    ) -> Option<GLContextAttributes> {
366        unsafe {
367            match WebGLContextAttributes::new(cx, options, can_gc) {
368                Ok(ConversionResult::Success(attrs)) => Some(attrs.convert()),
369                Ok(ConversionResult::Failure(error)) => {
370                    throw_type_error(*cx, &error);
371                    None
372                },
373                _ => {
374                    debug!("Unexpected error on conversion of WebGLContextAttributes");
375                    None
376                },
377            }
378        }
379    }
380
381    pub(crate) fn is_valid(&self) -> bool {
382        self.Height() != 0 && self.Width() != 0
383    }
384
385    pub(crate) fn get_image_data(&self) -> Option<Snapshot> {
386        match self.context_mode.borrow().as_ref() {
387            Some(context) => context.get_image_data(),
388            None => {
389                let size = self.get_size();
390                if size.is_empty() ||
391                    pixels::compute_rgba8_byte_length_if_within_limit(
392                        size.width as usize,
393                        size.height as usize,
394                    )
395                    .is_none()
396                {
397                    None
398                } else {
399                    Some(Snapshot::cleared(size.cast()))
400                }
401            },
402        }
403    }
404
405    fn maybe_quality(quality: HandleValue) -> Option<f64> {
406        if quality.is_number() {
407            Some(quality.to_number())
408        } else {
409            None
410        }
411    }
412}
413
414impl HTMLCanvasElementMethods<crate::DomTypeHolder> for HTMLCanvasElement {
415    // https://html.spec.whatwg.org/multipage/#dom-canvas-width
416    make_uint_getter!(Width, "width", DEFAULT_WIDTH);
417
418    /// <https://html.spec.whatwg.org/multipage/#dom-canvas-width>
419    fn SetWidth(&self, value: u32, can_gc: CanGc) -> Fallible<()> {
420        // > When setting the value of the width or height attribute, if the context mode of the canvas element
421        // > is set to placeholder, the user agent must throw an "InvalidStateError" DOMException and leave the
422        // > attribute's value unchanged.
423        if let Some(RenderingContext::Placeholder(_)) = *self.context_mode.borrow() {
424            return Err(Error::InvalidState(None));
425        }
426
427        let value = if value > UNSIGNED_LONG_MAX {
428            DEFAULT_WIDTH
429        } else {
430            value
431        };
432        let element = self.upcast::<Element>();
433        element.set_uint_attribute(&html5ever::local_name!("width"), value, can_gc);
434        Ok(())
435    }
436
437    // https://html.spec.whatwg.org/multipage/#dom-canvas-height
438    make_uint_getter!(Height, "height", DEFAULT_HEIGHT);
439
440    /// <https://html.spec.whatwg.org/multipage/#dom-canvas-height>
441    fn SetHeight(&self, value: u32, can_gc: CanGc) -> Fallible<()> {
442        // > When setting the value of the width or height attribute, if the context mode of the canvas element
443        // > is set to placeholder, the user agent must throw an "InvalidStateError" DOMException and leave the
444        // > attribute's value unchanged.
445        if let Some(RenderingContext::Placeholder(_)) = *self.context_mode.borrow() {
446            return Err(Error::InvalidState(None));
447        }
448
449        let value = if value > UNSIGNED_LONG_MAX {
450            DEFAULT_HEIGHT
451        } else {
452            value
453        };
454        let element = self.upcast::<Element>();
455        element.set_uint_attribute(&html5ever::local_name!("height"), value, can_gc);
456        Ok(())
457    }
458
459    /// <https://html.spec.whatwg.org/multipage/#dom-canvas-getcontext>
460    fn GetContext(
461        &self,
462        cx: JSContext,
463        id: DOMString,
464        options: HandleValue,
465        can_gc: CanGc,
466    ) -> Fallible<Option<RootedRenderingContext>> {
467        // Always throw an InvalidState exception when the canvas is in Placeholder mode (See table in the spec).
468        if let Some(RenderingContext::Placeholder(_)) = *self.context_mode.borrow() {
469            return Err(Error::InvalidState(None));
470        }
471
472        Ok(match &*id.str() {
473            "2d" => self
474                .get_or_init_2d_context(can_gc)
475                .map(RootedRenderingContext::CanvasRenderingContext2D),
476            "bitmaprenderer" => self
477                .get_or_init_bitmaprenderer_context(can_gc)
478                .map(RootedRenderingContext::ImageBitmapRenderingContext),
479            "webgl" | "experimental-webgl" => self
480                .get_or_init_webgl_context(cx, options, can_gc)
481                .map(RootedRenderingContext::WebGLRenderingContext),
482            "webgl2" | "experimental-webgl2" => self
483                .get_or_init_webgl2_context(cx, options, can_gc)
484                .map(RootedRenderingContext::WebGL2RenderingContext),
485            #[cfg(feature = "webgpu")]
486            "webgpu" => self
487                .get_or_init_webgpu_context(can_gc)
488                .map(RootedRenderingContext::GPUCanvasContext),
489            _ => None,
490        })
491    }
492
493    /// <https://html.spec.whatwg.org/multipage/#dom-canvas-todataurl>
494    fn ToDataURL(
495        &self,
496        _context: JSContext,
497        mime_type: DOMString,
498        quality: HandleValue,
499    ) -> Fallible<USVString> {
500        // Step 1: If this canvas element's bitmap's origin-clean flag is set to false,
501        // then throw a "SecurityError" DOMException.
502        if !self.origin_is_clean() {
503            return Err(Error::Security);
504        }
505
506        // Step 2: If this canvas element's bitmap has no pixels (i.e. either its
507        // horizontal dimension or its vertical dimension is zero), then return the string
508        // "data:,". (This is the shortest data: URL; it represents the empty string in a
509        // text/plain resource.)
510        if self.Width() == 0 || self.Height() == 0 {
511            return Ok(USVString("data:,".into()));
512        }
513
514        // Step 3: Let file be a serialization of this canvas element's bitmap as a file,
515        // passing type and quality if given.
516        let Some(mut snapshot) = self.get_image_data() else {
517            return Ok(USVString("data:,".into()));
518        };
519
520        let image_type = EncodedImageType::from(mime_type.to_string());
521
522        let mut url = format!("data:{};base64,", image_type.as_mime_type());
523
524        let mut encoder = base64::write::EncoderStringWriter::from_consumer(
525            &mut url,
526            &base64::engine::general_purpose::STANDARD,
527        );
528
529        if snapshot
530            .encode_for_mime_type(&image_type, Self::maybe_quality(quality), &mut encoder)
531            .is_err()
532        {
533            // Step 4. If file is null, then return "data:,".
534            return Ok(USVString("data:,".into()));
535        }
536
537        // Step 5. Return a data: URL representing file. [RFC2397]
538        encoder.into_inner();
539        Ok(USVString(url))
540    }
541
542    /// <https://html.spec.whatwg.org/multipage/#dom-canvas-toblob>
543    fn ToBlob(
544        &self,
545        _cx: JSContext,
546        callback: Rc<BlobCallback>,
547        mime_type: DOMString,
548        quality: HandleValue,
549    ) -> Fallible<()> {
550        // Step 1.
551        // If this canvas element's bitmap's origin-clean flag is set to false, then throw a
552        // "SecurityError" DOMException.
553        if !self.origin_is_clean() {
554            return Err(Error::Security);
555        }
556
557        // Step 2. Let result be null.
558        // Step 3. If this canvas element's bitmap has pixels (i.e., neither its horizontal dimension
559        // nor its vertical dimension is zero),
560        // then set result to a copy of this canvas element's bitmap.
561        let result = if self.Width() == 0 || self.Height() == 0 {
562            None
563        } else {
564            self.get_image_data()
565        };
566
567        let this = Trusted::new(self);
568        let callback_id = self.callback_id.get().wrapping_add(1);
569        self.callback_id.set(callback_id);
570
571        self.blob_callbacks
572            .borrow_mut()
573            .insert(callback_id, callback);
574        let quality = Self::maybe_quality(quality);
575        let image_type = EncodedImageType::from(mime_type.to_string());
576
577        self.global()
578            .task_manager()
579            .canvas_blob_task_source()
580            .queue(task!(to_blob: move || {
581                let this = this.root();
582                let Some(callback) = &this.blob_callbacks.borrow_mut().remove(&callback_id) else {
583                    return error!("Expected blob callback, but found none!");
584                };
585
586                let Some(mut snapshot) = result else {
587                    let _ = callback.Call__(None, ExceptionHandling::Report, CanGc::note());
588                    return;
589                };
590
591                // Step 4.1: If result is non-null, then set result to a serialization of
592                // result as a file with type and quality if given.
593                // Step 4.2: Queue an element task on the canvas blob serialization task
594                // source given the canvas element to run these steps:
595                let mut encoded: Vec<u8> = vec![];
596                let blob_impl;
597                let blob;
598                let result = match snapshot.encode_for_mime_type(&image_type, quality, &mut encoded) {
599                   Ok(..) => {
600                       // Step 4.2.1: If result is non-null, then set result to a new Blob
601                       // object, created in the relevant realm of this canvas element,
602                       // representing result. [FILEAPI]
603                       blob_impl = BlobImpl::new_from_bytes(encoded, image_type.as_mime_type());
604                       blob = Blob::new(&this.global(), blob_impl, CanGc::note());
605                       Some(&*blob)
606                   }
607                   Err(..) => None,
608                };
609
610                // Step 4.2.2: Invoke callback with « result » and "report".
611                let _ = callback.Call__(result, ExceptionHandling::Report, CanGc::note());
612            }));
613
614        Ok(())
615    }
616
617    /// <https://html.spec.whatwg.org/multipage/#dom-canvas-transfercontroltooffscreen>
618    fn TransferControlToOffscreen(&self, can_gc: CanGc) -> Fallible<DomRoot<OffscreenCanvas>> {
619        if self.context_mode.borrow().is_some() {
620            // Step 1.
621            // If this canvas element's context mode is not set to none, throw an "InvalidStateError" DOMException.
622            return Err(Error::InvalidState(None));
623        };
624
625        // Step 2.
626        // Let offscreenCanvas be a new OffscreenCanvas object with its width and height equal to the values of
627        // the width and height content attributes of this canvas element.
628        // Step 3.
629        // Set the placeholder canvas element of offscreenCanvas to a weak reference to this canvas element.
630        let offscreen_canvas = OffscreenCanvas::new(
631            &self.global(),
632            None,
633            self.Width().into(),
634            self.Height().into(),
635            Some(WeakRef::new(self)),
636            can_gc,
637        );
638
639        // Step 4. Set this canvas element's context mode to placeholder.
640        *self.context_mode.borrow_mut() =
641            Some(RenderingContext::Placeholder(offscreen_canvas.as_traced()));
642
643        // Step 5. Return offscreenCanvas.
644        Ok(offscreen_canvas)
645    }
646
647    /// <https://w3c.github.io/mediacapture-fromelement/#dom-htmlcanvaselement-capturestream>
648    fn CaptureStream(
649        &self,
650        _frame_request_rate: Option<Finite<f64>>,
651        can_gc: CanGc,
652    ) -> DomRoot<MediaStream> {
653        let global = self.global();
654        let stream = MediaStream::new(&global, can_gc);
655        let track = MediaStreamTrack::new(
656            &global,
657            MediaStreamId::new(),
658            MediaStreamType::Video,
659            can_gc,
660        );
661        stream.AddTrack(&track);
662        stream
663    }
664}
665
666impl VirtualMethods for HTMLCanvasElement {
667    fn super_type(&self) -> Option<&dyn VirtualMethods> {
668        Some(self.upcast::<HTMLElement>() as &dyn VirtualMethods)
669    }
670
671    fn attribute_mutated(&self, attr: &Attr, mutation: AttributeMutation, can_gc: CanGc) {
672        self.super_type()
673            .unwrap()
674            .attribute_mutated(attr, mutation, can_gc);
675        match attr.local_name() {
676            &local_name!("width") | &local_name!("height") => {
677                self.recreate_contexts_after_resize();
678                self.upcast::<Node>().dirty(NodeDamage::Other);
679            },
680            _ => {},
681        };
682    }
683
684    fn attribute_affects_presentational_hints(&self, attr: &Attr) -> bool {
685        match attr.local_name() {
686            &local_name!("width") | &local_name!("height") => true,
687            _ => self
688                .super_type()
689                .unwrap()
690                .attribute_affects_presentational_hints(attr),
691        }
692    }
693
694    fn parse_plain_attribute(&self, name: &LocalName, value: DOMString) -> AttrValue {
695        match *name {
696            local_name!("width") => AttrValue::from_u32(value.into(), DEFAULT_WIDTH),
697            local_name!("height") => AttrValue::from_u32(value.into(), DEFAULT_HEIGHT),
698            _ => self
699                .super_type()
700                .unwrap()
701                .parse_plain_attribute(name, value),
702        }
703    }
704}
705
706impl Convert<GLContextAttributes> for WebGLContextAttributes {
707    fn convert(self) -> GLContextAttributes {
708        GLContextAttributes {
709            alpha: self.alpha,
710            depth: self.depth,
711            stencil: self.stencil,
712            antialias: self.antialias,
713            premultiplied_alpha: self.premultipliedAlpha,
714            preserve_drawing_buffer: self.preserveDrawingBuffer,
715        }
716    }
717}