script/dom/canvas/
offscreencanvas.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;
6use std::rc::Rc;
7
8use dom_struct::dom_struct;
9use euclid::default::Size2D;
10use js::error::throw_type_error;
11use js::realm::CurrentRealm;
12use js::rust::{HandleObject, HandleValue};
13use pixels::{EncodedImageType, Snapshot};
14use rustc_hash::FxHashMap;
15use script_bindings::cell::{DomRefCell, Ref};
16use script_bindings::inheritance::Castable;
17use script_bindings::reflector::{DomObject, reflect_dom_object_with_proto_and_cx};
18use script_bindings::weakref::WeakRef;
19use servo_base::id::{OffscreenCanvasId, OffscreenCanvasIndex};
20use servo_canvas_traits::webgl::{GLContextAttributes, WebGLVersion};
21use servo_constellation_traits::{BlobImpl, TransferableOffscreenCanvas};
22
23use crate::canvas_context::{CanvasContext, OffscreenRenderingContext};
24use crate::conversions::Convert;
25use crate::dom::bindings::codegen::Bindings::OffscreenCanvasBinding::{
26    ImageEncodeOptions, OffscreenCanvasMethods,
27    OffscreenRenderingContext as RootedOffscreenRenderingContext, OffscreenRenderingContextId,
28};
29use crate::dom::bindings::codegen::Bindings::WebGLRenderingContextBinding::WebGLContextAttributes;
30use crate::dom::bindings::codegen::UnionTypes::HTMLCanvasElementOrOffscreenCanvas as RootedHTMLCanvasElementOrOffscreenCanvas;
31use crate::dom::bindings::conversions::ConversionResult;
32use crate::dom::bindings::error::{Error, Fallible};
33use crate::dom::bindings::refcounted::{Trusted, TrustedPromise};
34use crate::dom::bindings::reflector::DomGlobal;
35use crate::dom::bindings::root::{Dom, DomRoot};
36use crate::dom::bindings::structuredclone::StructuredData;
37use crate::dom::bindings::transferable::Transferable;
38use crate::dom::blob::Blob;
39use crate::dom::eventtarget::EventTarget;
40use crate::dom::globalscope::GlobalScope;
41use crate::dom::html::htmlcanvaselement::HTMLCanvasElement;
42use crate::dom::imagebitmap::ImageBitmap;
43use crate::dom::imagebitmaprenderingcontext::ImageBitmapRenderingContext;
44use crate::dom::offscreencanvasrenderingcontext2d::OffscreenCanvasRenderingContext2D;
45use crate::dom::promise::Promise;
46use crate::dom::types::{WebGLRenderingContext, Window};
47use crate::dom::webgl::webgl2renderingcontext::WebGL2RenderingContext;
48use crate::script_runtime::CanGc;
49
50/// <https://html.spec.whatwg.org/multipage/#offscreencanvas>
51#[dom_struct]
52pub(crate) struct OffscreenCanvas {
53    eventtarget: EventTarget,
54    width: Cell<u64>,
55    height: Cell<u64>,
56
57    /// Represents both the [bitmap] and the [context mode] of the canvas.
58    ///
59    /// [bitmap]: https://html.spec.whatwg.org/multipage/#offscreencanvas-bitmap
60    /// [context mode]: https://html.spec.whatwg.org/multipage/#offscreencanvas-context-mode
61    context: DomRefCell<Option<OffscreenRenderingContext>>,
62
63    /// <https://html.spec.whatwg.org/multipage/#offscreencanvas-placeholder>
64    placeholder: Option<WeakRef<HTMLCanvasElement>>,
65}
66
67impl OffscreenCanvas {
68    pub(crate) fn new_inherited(
69        width: u64,
70        height: u64,
71        placeholder: Option<WeakRef<HTMLCanvasElement>>,
72    ) -> OffscreenCanvas {
73        OffscreenCanvas {
74            eventtarget: EventTarget::new_inherited(),
75            width: Cell::new(width),
76            height: Cell::new(height),
77            context: DomRefCell::new(None),
78            placeholder,
79        }
80    }
81
82    pub(crate) fn new(
83        cx: &mut js::context::JSContext,
84        global: &GlobalScope,
85        proto: Option<HandleObject>,
86        width: u64,
87        height: u64,
88        placeholder: Option<WeakRef<HTMLCanvasElement>>,
89    ) -> DomRoot<OffscreenCanvas> {
90        reflect_dom_object_with_proto_and_cx(
91            Box::new(OffscreenCanvas::new_inherited(width, height, placeholder)),
92            global,
93            proto,
94            cx,
95        )
96    }
97
98    pub(crate) fn get_size(&self) -> Size2D<u32> {
99        Size2D::new(
100            self.Width().try_into().unwrap_or(u32::MAX),
101            self.Height().try_into().unwrap_or(u32::MAX),
102        )
103    }
104
105    #[expect(unsafe_code)]
106    fn get_gl_attributes(
107        cx: &mut js::context::JSContext,
108        options: HandleValue,
109    ) -> Option<GLContextAttributes> {
110        unsafe {
111            match WebGLContextAttributes::new(cx.into(), options, CanGc::from_cx(cx)) {
112                Ok(ConversionResult::Success(attrs)) => Some(attrs.convert()),
113                Ok(ConversionResult::Failure(error)) => {
114                    throw_type_error(cx.raw_cx(), &error);
115                    None
116                },
117                _ => {
118                    debug!("Unexpected error on conversion of WebGLContextAttributes");
119                    None
120                },
121            }
122        }
123    }
124
125    pub(crate) fn origin_is_clean(&self) -> bool {
126        match *self.context.borrow() {
127            Some(ref context) => context.origin_is_clean(),
128            _ => true,
129        }
130    }
131
132    pub(crate) fn context(&self) -> Option<Ref<'_, OffscreenRenderingContext>> {
133        Ref::filter_map(self.context.borrow(), |ctx| ctx.as_ref()).ok()
134    }
135
136    pub(crate) fn get_image_data(&self) -> Option<Snapshot> {
137        match self.context.borrow().as_ref() {
138            Some(context) => context.get_image_data(),
139            None => {
140                let size = self.get_size();
141                if size.is_empty() ||
142                    pixels::compute_rgba8_byte_length_if_within_limit(
143                        size.width as usize,
144                        size.height as usize,
145                    )
146                    .is_none()
147                {
148                    None
149                } else {
150                    Some(Snapshot::cleared(size))
151                }
152            },
153        }
154    }
155
156    pub(crate) fn get_or_init_2d_context(
157        &self,
158        cx: &mut js::context::JSContext,
159    ) -> Option<DomRoot<OffscreenCanvasRenderingContext2D>> {
160        if let Some(ctx) = self.context() {
161            return match *ctx {
162                OffscreenRenderingContext::Context2d(ref ctx) => Some(DomRoot::from_ref(ctx)),
163                _ => None,
164            };
165        }
166        let context = OffscreenCanvasRenderingContext2D::new(
167            &self.global(),
168            self,
169            self.get_size(),
170            CanGc::from_cx(cx),
171        )?;
172        *self.context.borrow_mut() = Some(OffscreenRenderingContext::Context2d(Dom::from_ref(
173            &*context,
174        )));
175        Some(context)
176    }
177
178    /// <https://html.spec.whatwg.org/multipage/#offscreen-context-type-bitmaprenderer>
179    pub(crate) fn get_or_init_bitmaprenderer_context(
180        &self,
181        cx: &mut js::context::JSContext,
182    ) -> Option<DomRoot<ImageBitmapRenderingContext>> {
183        // Return the same object as was returned the last time the method was
184        // invoked with this same first argument.
185        if let Some(ctx) = self.context() {
186            return match *ctx {
187                OffscreenRenderingContext::BitmapRenderer(ref ctx) => Some(DomRoot::from_ref(ctx)),
188                _ => None,
189            };
190        }
191
192        // Step 1. Let context be the result of running the
193        // ImageBitmapRenderingContext creation algorithm given this and
194        // options.
195        let canvas =
196            RootedHTMLCanvasElementOrOffscreenCanvas::OffscreenCanvas(DomRoot::from_ref(self));
197
198        let context = ImageBitmapRenderingContext::new(&self.global(), &canvas, CanGc::from_cx(cx));
199
200        // Step 2. Set this's context mode to bitmaprenderer.
201        *self.context.borrow_mut() = Some(OffscreenRenderingContext::BitmapRenderer(
202            Dom::from_ref(&*context),
203        ));
204
205        // Step 3. Return context.
206        Some(context)
207    }
208
209    // <https://html.spec.whatwg.org/multipage/#offscreen-context-type-webgl>
210    pub(crate) fn get_or_init_webgl_context(
211        &self,
212        cx: &mut js::context::JSContext,
213        options: HandleValue,
214    ) -> Option<DomRoot<WebGLRenderingContext>> {
215        if let Some(ctx) = self.context() {
216            return match *ctx {
217                OffscreenRenderingContext::WebGL(ref ctx) => Some(DomRoot::from_ref(ctx)),
218                _ => None,
219            };
220        }
221
222        // 1. Let context be the result of following the instructions given in the
223        // WebGL specifications' Context Creation sections.
224        let canvas =
225            RootedHTMLCanvasElementOrOffscreenCanvas::OffscreenCanvas(DomRoot::from_ref(self));
226        let size = self.get_size();
227        let attrs = Self::get_gl_attributes(cx, options)?;
228        self.global()
229            .downcast::<Window>()
230            .and_then(|window| {
231                WebGLRenderingContext::new(
232                    window,
233                    &canvas,
234                    WebGLVersion::WebGL1,
235                    size,
236                    attrs,
237                    CanGc::from_cx(cx),
238                )
239            })
240            .map(|context| {
241                // Step 2. If context is null, then return null;
242                // otherwise set this's context mode to webgl or webgl2.
243                *self.context.borrow_mut() =
244                    Some(OffscreenRenderingContext::WebGL(Dom::from_ref(&*context)));
245
246                // Step 3. Return context.
247                context
248            })
249    }
250
251    // <https://html.spec.whatwg.org/multipage/#offscreen-context-type-webgl>
252    fn get_or_init_webgl2_context(
253        &self,
254        cx: &mut js::context::JSContext,
255        options: HandleValue,
256    ) -> Option<DomRoot<WebGL2RenderingContext>> {
257        if !WebGL2RenderingContext::is_webgl2_enabled(
258            cx.into(),
259            self.global().reflector().get_jsobject(),
260        ) {
261            return None;
262        }
263        if let Some(ctx) = self.context() {
264            return match *ctx {
265                OffscreenRenderingContext::WebGL2(ref ctx) => Some(DomRoot::from_ref(ctx)),
266                _ => None,
267            };
268        }
269
270        // 1. Let context be the result of following the instructions given in the
271        // WebGL specifications' Context Creation sections.
272        let canvas =
273            RootedHTMLCanvasElementOrOffscreenCanvas::OffscreenCanvas(DomRoot::from_ref(self));
274        let size = self.get_size();
275        let attrs = Self::get_gl_attributes(cx, options)?;
276        self.global()
277            .downcast::<Window>()
278            .and_then(|window| {
279                WebGL2RenderingContext::new(window, &canvas, size, attrs, CanGc::from_cx(cx))
280            })
281            .map(|context| {
282                // Step 2. If context is null, then return null;
283                // otherwise set this's context mode to webgl or webgl2.
284                *self.context.borrow_mut() =
285                    Some(OffscreenRenderingContext::WebGL2(Dom::from_ref(&*context)));
286
287                // Step 3. Return context.
288                context
289            })
290    }
291
292    pub(crate) fn placeholder(&self) -> Option<DomRoot<HTMLCanvasElement>> {
293        self.placeholder
294            .as_ref()
295            .and_then(|placeholder| placeholder.root())
296    }
297}
298
299impl Transferable for OffscreenCanvas {
300    type Index = OffscreenCanvasIndex;
301    type Data = TransferableOffscreenCanvas;
302
303    /// <https://html.spec.whatwg.org/multipage/#the-offscreencanvas-interface:transfer-steps>
304    fn transfer(
305        &self,
306        _cx: &mut js::context::JSContext,
307    ) -> Fallible<(OffscreenCanvasId, TransferableOffscreenCanvas)> {
308        // <https://html.spec.whatwg.org/multipage/#structuredserializewithtransfer>
309        // Step 5.2. If transferable has a [[Detached]] internal slot and
310        // transferable.[[Detached]] is true, then throw a "DataCloneError"
311        // DOMException.
312        if let Some(OffscreenRenderingContext::Detached) = *self.context.borrow() {
313            return Err(Error::DataClone(None));
314        }
315
316        // Step 1. If value's context mode is not equal to none, then throw an
317        // "InvalidStateError" DOMException.
318        if !self.context.borrow().is_none() {
319            return Err(Error::InvalidState(None));
320        }
321
322        // TODO(#37882): Allow to transfer with a placeholder canvas element.
323        if self.placeholder.is_some() {
324            return Err(Error::InvalidState(None));
325        }
326
327        // Step 2. Set value's context mode to detached.
328        *self.context.borrow_mut() = Some(OffscreenRenderingContext::Detached);
329
330        // Step 3. Let width and height be the dimensions of value's bitmap.
331        // Step 5. Unset value's bitmap.
332        let width = self.width.replace(0);
333        let height = self.height.replace(0);
334
335        // TODO(#37918) Step 4. Let language and direction be the values of
336        // value's inherited language and inherited direction.
337
338        // Step 6. Set dataHolder.[[Width]] to width and dataHolder.[[Height]]
339        // to height.
340
341        // TODO(#37918) Step 7. Set dataHolder.[[Language]] to language and
342        // dataHolder.[[Direction]] to direction.
343
344        // TODO(#37882) Step 8. Set dataHolder.[[PlaceholderCanvas]] to be a
345        // weak reference to value's placeholder canvas element, if value has
346        // one, or null if it does not.
347        let transferred = TransferableOffscreenCanvas { width, height };
348
349        Ok((OffscreenCanvasId::new(), transferred))
350    }
351
352    /// <https://html.spec.whatwg.org/multipage/#the-offscreencanvas-interface:transfer-receiving-steps>
353    fn transfer_receive(
354        cx: &mut js::context::JSContext,
355        owner: &GlobalScope,
356        _: OffscreenCanvasId,
357        transferred: TransferableOffscreenCanvas,
358    ) -> Result<DomRoot<Self>, ()> {
359        // Step 1. Initialize value's bitmap to a rectangular array of
360        // transparent black pixels with width given by dataHolder.[[Width]] and
361        // height given by dataHolder.[[Height]].
362
363        // TODO(#37918) Step 2. Set value's inherited language to
364        // dataHolder.[[Language]] and its inherited direction to
365        // dataHolder.[[Direction]].
366
367        // TODO(#37882) Step 3. If dataHolder.[[PlaceholderCanvas]] is not null,
368        // set value's placeholder canvas element to
369        // dataHolder.[[PlaceholderCanvas]] (while maintaining the weak
370        // reference semantics).
371        Ok(OffscreenCanvas::new(
372            cx,
373            owner,
374            None,
375            transferred.width,
376            transferred.height,
377            None,
378        ))
379    }
380
381    fn serialized_storage<'a>(
382        data: StructuredData<'a, '_>,
383    ) -> &'a mut Option<FxHashMap<OffscreenCanvasId, Self::Data>> {
384        match data {
385            StructuredData::Reader(r) => &mut r.offscreen_canvases,
386            StructuredData::Writer(w) => &mut w.offscreen_canvases,
387        }
388    }
389}
390
391impl OffscreenCanvasMethods<crate::DomTypeHolder> for OffscreenCanvas {
392    /// <https://html.spec.whatwg.org/multipage/#dom-offscreencanvas>
393    fn Constructor(
394        cx: &mut js::context::JSContext,
395        global: &GlobalScope,
396        proto: Option<HandleObject>,
397        width: u64,
398        height: u64,
399    ) -> Fallible<DomRoot<OffscreenCanvas>> {
400        Ok(OffscreenCanvas::new(cx, global, proto, width, height, None))
401    }
402
403    /// <https://html.spec.whatwg.org/multipage/#dom-offscreencanvas-getcontext>
404    fn GetContext(
405        &self,
406        cx: &mut js::context::JSContext,
407        id: OffscreenRenderingContextId,
408        options: HandleValue,
409    ) -> Fallible<Option<RootedOffscreenRenderingContext>> {
410        // Step 3. Throw an "InvalidStateError" DOMException if the
411        // OffscreenCanvas object's context mode is detached.
412        if let Some(OffscreenRenderingContext::Detached) = *self.context.borrow() {
413            return Err(Error::InvalidState(None));
414        }
415
416        match id {
417            OffscreenRenderingContextId::_2d => Ok(self
418                .get_or_init_2d_context(cx)
419                .map(RootedOffscreenRenderingContext::OffscreenCanvasRenderingContext2D)),
420            OffscreenRenderingContextId::Bitmaprenderer => Ok(self
421                .get_or_init_bitmaprenderer_context(cx)
422                .map(RootedOffscreenRenderingContext::ImageBitmapRenderingContext)),
423            OffscreenRenderingContextId::Webgl => Ok(self
424                .get_or_init_webgl_context(cx, options)
425                .map(RootedOffscreenRenderingContext::WebGLRenderingContext)),
426            OffscreenRenderingContextId::Experimental_webgl => Ok(self
427                .get_or_init_webgl_context(cx, options)
428                .map(RootedOffscreenRenderingContext::WebGLRenderingContext)),
429            OffscreenRenderingContextId::Webgl2 => Ok(self
430                .get_or_init_webgl2_context(cx, options)
431                .map(RootedOffscreenRenderingContext::WebGL2RenderingContext)),
432            OffscreenRenderingContextId::Experimental_webgl2 => Ok(self
433                .get_or_init_webgl2_context(cx, options)
434                .map(RootedOffscreenRenderingContext::WebGL2RenderingContext)),
435        }
436    }
437
438    /// <https://html.spec.whatwg.org/multipage/#dom-offscreencanvas-width>
439    fn Width(&self) -> u64 {
440        self.width.get()
441    }
442
443    /// <https://html.spec.whatwg.org/multipage/#dom-offscreencanvas-width>
444    fn SetWidth(&self, cx: &mut js::context::JSContext, value: u64) {
445        self.width.set(value);
446
447        if let Some(canvas_context) = self.context() {
448            canvas_context.resize();
449        }
450
451        if let Some(canvas) = self.placeholder() {
452            canvas.set_natural_width(cx, value as _)
453        }
454    }
455
456    /// <https://html.spec.whatwg.org/multipage/#dom-offscreencanvas-height>
457    fn Height(&self) -> u64 {
458        self.height.get()
459    }
460
461    /// <https://html.spec.whatwg.org/multipage/#dom-offscreencanvas-height>
462    fn SetHeight(&self, cx: &mut js::context::JSContext, value: u64) {
463        self.height.set(value);
464
465        if let Some(canvas_context) = self.context() {
466            canvas_context.resize();
467        }
468
469        if let Some(canvas) = self.placeholder() {
470            canvas.set_natural_height(cx, value as _)
471        }
472    }
473
474    /// <https://html.spec.whatwg.org/multipage/#dom-offscreencanvas-transfertoimagebitmap>
475    fn TransferToImageBitmap(
476        &self,
477        cx: &mut js::context::JSContext,
478    ) -> Fallible<DomRoot<ImageBitmap>> {
479        // Step 1. If the value of this OffscreenCanvas object's [[Detached]]
480        // internal slot is set to true, then throw an "InvalidStateError"
481        // DOMException.
482        if let Some(OffscreenRenderingContext::Detached) = *self.context.borrow() {
483            return Err(Error::InvalidState(None));
484        }
485
486        // Step 2. If this OffscreenCanvas object's context mode is set to none,
487        // then throw an "InvalidStateError" DOMException.
488        if self.context.borrow().is_none() {
489            return Err(Error::InvalidState(None));
490        }
491
492        // Step 3. Let image be a newly created ImageBitmap object that
493        // references the same underlying bitmap data as this OffscreenCanvas
494        // object's bitmap.
495        let Some(snapshot) = self.get_image_data() else {
496            return Err(Error::InvalidState(None));
497        };
498
499        let image_bitmap = ImageBitmap::new(&self.global(), snapshot, CanGc::from_cx(cx));
500        image_bitmap.set_origin_clean(self.origin_is_clean());
501
502        // Step 4. Set this OffscreenCanvas object's bitmap to reference a newly
503        // created bitmap of the same dimensions and color space as the previous
504        // bitmap, and with its pixels initialized to transparent black, or
505        // opaque black if the rendering context's alpha is false.
506        if let Some(canvas_context) = self.context() {
507            canvas_context.reset_bitmap();
508        }
509
510        // Step 5. Return image.
511        Ok(image_bitmap)
512    }
513
514    /// <https://html.spec.whatwg.org/multipage/#dom-offscreencanvas-converttoblob>
515    fn ConvertToBlob(
516        &self,
517        cx: &mut js::context::JSContext,
518        options: &ImageEncodeOptions,
519    ) -> Rc<Promise> {
520        // Step 5. Let result be a new promise object.
521        let mut realm = CurrentRealm::assert(cx);
522        let promise = Promise::new_in_realm(&mut realm);
523
524        // Step 1. If the value of this's [[Detached]] internal slot is true,
525        // then return a promise rejected with an "InvalidStateError"
526        // DOMException.
527        if let Some(OffscreenRenderingContext::Detached) = *self.context.borrow() {
528            promise.reject_error(Error::InvalidState(None), CanGc::from_cx(cx));
529            return promise;
530        }
531
532        // Step 2. If this's context mode is 2d and the rendering context's
533        // output bitmap's origin-clean flag is set to false, then return a
534        // promise rejected with a "SecurityError" DOMException.
535        if !self.origin_is_clean() {
536            promise.reject_error(Error::Security(None), CanGc::from_cx(cx));
537            return promise;
538        }
539
540        // Step 3. If this's bitmap has no pixels (i.e., either its horizontal
541        // dimension or its vertical dimension is zero), then return a promise
542        // rejected with an "IndexSizeError" DOMException.
543        if self.Width() == 0 || self.Height() == 0 {
544            promise.reject_error(Error::IndexSize(None), CanGc::from_cx(cx));
545            return promise;
546        }
547
548        // Step 4. Let bitmap be a copy of this's bitmap.
549        let Some(mut snapshot) = self.get_image_data() else {
550            promise.reject_error(Error::InvalidState(None), CanGc::from_cx(cx));
551            return promise;
552        };
553
554        // Step 7. Run these steps in parallel:
555        // Step 7.1. Let file be a serialization of bitmap as a file, with
556        // options's type and quality if present.
557        // Step 7.2. Queue a global task on the canvas blob serialization task
558        // source given global to run these steps:
559        let trusted_this = Trusted::new(self);
560        let trusted_promise = TrustedPromise::new(promise.clone());
561
562        let image_type = EncodedImageType::from(options.type_.to_string());
563        let quality = options.quality;
564
565        self.global()
566            .task_manager()
567            .canvas_blob_task_source()
568            .queue(task!(convert_to_blob: move |cx| {
569                let this = trusted_this.root();
570                let promise = trusted_promise.root();
571
572                let mut encoded: Vec<u8> = vec![];
573
574                if snapshot.encode_for_mime_type(&image_type, quality, &mut encoded).is_err() {
575                    // Step 7.2.1. If file is null, then reject result with an
576                    // "EncodingError" DOMException.
577                    promise.reject_error(Error::Encoding(None), CanGc::from_cx(cx));
578                    return;
579                };
580
581                // Step 7.2.2. Otherwise, resolve result with a new Blob object,
582                // created in global's relevant realm, representing file.
583                let blob_impl = BlobImpl::new_from_bytes(encoded, image_type.as_mime_type());
584                let blob = Blob::new(&this.global(), blob_impl, CanGc::from_cx(cx));
585
586                promise.resolve_native(&blob, CanGc::from_cx(cx));
587            }));
588
589        // Step 8. Return result.
590        promise
591    }
592}
script/dom/canvas/offscreencanvas.rs

script/dom/canvas/
offscreencanvas.rs
