Extract canvas operations for reuse by OffscreenCanvas.

1 files changed, 1217 insertions, 733 deletions

diff --git a/components/script/dom/canvasrenderingcontext2d.rs b/components/script/dom/canvasrenderingcontext2d.rs
index 0639e70549a..2a26a1c5752 100644
--- a/components/script/dom/canvasrenderingcontext2d.rs
+++ b/components/script/dom/canvasrenderingcontext2d.rs
@@ -23,7 +23,7 @@ use crate::dom::element::Element;
 use crate::dom::globalscope::GlobalScope;
 use crate::dom::htmlcanvaselement::{CanvasContext, HTMLCanvasElement};
 use crate::dom::imagedata::ImageData;
-use crate::dom::node::{window_from_node, Node, NodeDamage};
+use crate::dom::node::{Node, NodeDamage};
 use crate::unpremultiplytable::UNPREMULTIPLY_TABLE;
 use canvas_traits::canvas::{Canvas2dMsg, CanvasId, CanvasMsg};
 use canvas_traits::canvas::{CompositionOrBlending, FillOrStrokeStyle, FillRule};
@@ -65,16 +65,6 @@ pub struct CanvasRenderingContext2D {
     /// For rendering contexts created by an HTML canvas element, this is Some,
     /// for ones created by a paint worklet, this is None.
     canvas: Option<Dom<HTMLCanvasElement>>,
-    #[ignore_malloc_size_of = "Arc"]
-    image_cache: Arc<ImageCache>,
-    /// Any missing image URLs.
-    missing_image_urls: DomRefCell<Vec<ServoUrl>>,
-    /// The base URL for resolving CSS image URL values.
-    /// Needed because of https://github.com/servo/servo/issues/17625
-    base_url: ServoUrl,
-    state: DomRefCell<CanvasContextState>,
-    saved_states: DomRefCell<Vec<CanvasContextState>>,
-    origin_clean: Cell<bool>,
     canvas_state: DomRefCell<CanvasState>,
 }
 
@@ -119,11 +109,22 @@ impl CanvasContextState {
     }
 }
 
+#[must_root]
 #[derive(JSTraceable, MallocSizeOf)]
 pub struct CanvasState {
     #[ignore_malloc_size_of = "Defined in ipc-channel"]
     ipc_renderer: IpcSender<CanvasMsg>,
     canvas_id: CanvasId,
+    state: DomRefCell<CanvasContextState>,
+    origin_clean: Cell<bool>,
+    #[ignore_malloc_size_of = "Arc"]
+    image_cache: Arc<dyn ImageCache>,
+    /// The base URL for resolving CSS image URL values.
+    /// Needed because of https://github.com/servo/servo/issues/17625
+    base_url: ServoUrl,
+    /// Any missing image URLs.
+    missing_image_urls: DomRefCell<Vec<ServoUrl>>,
+    saved_states: DomRefCell<Vec<CanvasContextState>>,
 }
 
 impl CanvasState {
@@ -141,6 +142,12 @@ impl CanvasState {
         CanvasState {
             ipc_renderer: ipc_renderer,
             canvas_id: canvas_id,
+            state: DomRefCell::new(CanvasContextState::new()),
+            origin_clean: Cell::new(true),
+            image_cache: global.image_cache(),
+            base_url: global.api_base_url(),
+            missing_image_urls: DomRefCell::new(Vec::new()),
+            saved_states: DomRefCell::new(Vec::new()),
         }
     }
 
@@ -169,172 +176,122 @@ impl CanvasState {
         ))
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-fillrect
-    pub fn FillRect(&self, x: f64, y: f64, width: f64, height: f64) {
-        if let Some(rect) = self.create_drawable_rect(x, y, width, height) {
-            self.send_canvas_2d_msg(Canvas2dMsg::FillRect(rect));
-        }
-    }
-
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-clearrect
-    pub fn ClearRect(&self, x: f64, y: f64, width: f64, height: f64) {
-        if let Some(rect) = self.create_drawable_rect(x, y, width, height) {
-            self.send_canvas_2d_msg(Canvas2dMsg::ClearRect(rect));
-        }
+    fn origin_is_clean(&self) -> bool {
+        self.origin_clean.get()
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-strokerect
-    pub fn StrokeRect(&self, x: f64, y: f64, width: f64, height: f64) {
-        if let Some(rect) = self.create_drawable_rect(x, y, width, height) {
-            self.send_canvas_2d_msg(Canvas2dMsg::StrokeRect(rect));
-        }
+    fn set_origin_unclean(&self) {
+        self.origin_clean.set(false)
     }
-}
 
-impl CanvasRenderingContext2D {
-    pub fn new_inherited(
-        global: &GlobalScope,
-        canvas: Option<&HTMLCanvasElement>,
-        image_cache: Arc<dyn ImageCache>,
-        base_url: ServoUrl,
-        size: Size2D<u32>,
-    ) -> CanvasRenderingContext2D {
-        CanvasRenderingContext2D {
-            reflector_: Reflector::new(),
-            canvas: canvas.map(Dom::from_ref),
-            image_cache: image_cache,
-            missing_image_urls: DomRefCell::new(Vec::new()),
-            base_url: base_url,
-            state: DomRefCell::new(CanvasContextState::new()),
-            saved_states: DomRefCell::new(Vec::new()),
-            origin_clean: Cell::new(true),
-            canvas_state: DomRefCell::new(CanvasState::new(
-                global,
-                Size2D::new(size.width as u64, size.height as u64),
-            )),
+    // https://html.spec.whatwg.org/multipage/#the-image-argument-is-not-origin-clean
+    fn is_origin_clean(&self, image: CanvasImageSource) -> bool {
+        match image {
+            CanvasImageSource::HTMLCanvasElement(canvas) => canvas.origin_is_clean(),
+            CanvasImageSource::HTMLImageElement(image) => {
+                image.same_origin(GlobalScope::entry().origin())
+            },
+            CanvasImageSource::CSSStyleValue(_) => true,
         }
     }
 
-    pub fn new(
-        global: &GlobalScope,
-        canvas: &HTMLCanvasElement,
-        size: Size2D<u32>,
-    ) -> DomRoot<CanvasRenderingContext2D> {
-        let window = window_from_node(canvas);
-        let image_cache = window.image_cache();
-        let base_url = window.get_url();
-        let boxed = Box::new(CanvasRenderingContext2D::new_inherited(
-            global,
-            Some(canvas),
-            image_cache,
-            base_url,
-            size,
-        ));
-        reflect_dom_object(boxed, global, CanvasRenderingContext2DBinding::Wrap)
-    }
+    fn fetch_image_data(&self, url: ServoUrl) -> Option<(Vec<u8>, Size2D<u32>)> {
+        let img = match self.request_image_from_cache(url) {
+            ImageResponse::Loaded(img, _) => img,
+            ImageResponse::PlaceholderLoaded(_, _) |
+            ImageResponse::None |
+            ImageResponse::MetadataLoaded(_) => {
+                return None;
+            },
+        };
 
-    // https://html.spec.whatwg.org/multipage/#concept-canvas-set-bitmap-dimensions
-    pub fn set_bitmap_dimensions(&self, size: Size2D<u32>) {
-        self.reset_to_initial_state();
-        self.canvas_state
-            .borrow()
-            .ipc_renderer
-            .send(CanvasMsg::Recreate(
-                size,
-                self.canvas_state.borrow().get_canvas_id(),
-            ))
-            .unwrap();
-    }
+        let image_size = Size2D::new(img.width, img.height);
+        let image_data = match img.format {
+            PixelFormat::BGRA8 => img.bytes.to_vec(),
+            pixel_format => unimplemented!("unsupported pixel format ({:?})", pixel_format),
+        };
 
-    // https://html.spec.whatwg.org/multipage/#reset-the-rendering-context-to-its-default-state
-    fn reset_to_initial_state(&self) {
-        self.saved_states.borrow_mut().clear();
-        *self.state.borrow_mut() = CanvasContextState::new();
+        Some((image_data, image_size))
     }
 
-    fn mark_as_dirty(&self) {
-        if let Some(ref canvas) = self.canvas {
-            canvas.upcast::<Node>().dirty(NodeDamage::OtherNodeDamage);
+    #[inline]
+    fn request_image_from_cache(&self, url: ServoUrl) -> ImageResponse {
+        let response = self.image_cache.find_image_or_metadata(
+            url.clone(),
+            UsePlaceholder::No,
+            CanRequestImages::No,
+        );
+        match response {
+            Ok(ImageOrMetadataAvailable::ImageAvailable(image, url)) => {
+                ImageResponse::Loaded(image, url)
+            },
+            Err(ImageState::Pending(_)) => ImageResponse::None,
+            _ => {
+                // Rather annoyingly, we get the same response back from
+                // A load which really failed and from a load which hasn't started yet.
+                self.missing_image_urls.borrow_mut().push(url);
+                ImageResponse::None
+            },
         }
     }
 
-    fn update_transform(&self) {
-        self.send_canvas_2d_msg(Canvas2dMsg::SetTransform(self.state.borrow().transform))
-    }
-
-    // It is used by DrawImage to calculate the size of the source and destination rectangles based
-    // on the drawImage call arguments
-    // source rectangle = area of the original image to be copied
-    // destination rectangle = area of the destination canvas where the source image is going to be drawn
-    fn adjust_source_dest_rects(
-        &self,
-        image_size: Size2D<f64>,
-        sx: f64,
-        sy: f64,
-        sw: f64,
-        sh: f64,
-        dx: f64,
-        dy: f64,
-        dw: f64,
-        dh: f64,
-    ) -> (Rect<f64>, Rect<f64>) {
-        let image_rect = Rect::new(
-            Point2D::new(0f64, 0f64),
-            Size2D::new(image_size.width as f64, image_size.height as f64),
-        );
-
-        // The source rectangle is the rectangle whose corners are the four points (sx, sy),
-        // (sx+sw, sy), (sx+sw, sy+sh), (sx, sy+sh).
-        let source_rect = Rect::new(
-            Point2D::new(sx.min(sx + sw), sy.min(sy + sh)),
-            Size2D::new(sw.abs(), sh.abs()),
-        );
+    fn parse_color(&self, canvas: Option<&HTMLCanvasElement>, string: &str) -> Result<RGBA, ()> {
+        let mut input = ParserInput::new(string);
+        let mut parser = Parser::new(&mut input);
+        let color = CSSColor::parse(&mut parser);
+        if parser.is_exhausted() {
+            match color {
+                Ok(CSSColor::RGBA(rgba)) => Ok(rgba),
+                Ok(CSSColor::CurrentColor) => {
+                    // TODO: https://github.com/whatwg/html/issues/1099
+                    // Reconsider how to calculate currentColor in a display:none canvas
 
-        // When the source rectangle is outside the source image,
-        // the source rectangle must be clipped to the source image
-        let source_rect_clipped = source_rect
-            .intersection(&image_rect)
-            .unwrap_or(Rect::zero());
+                    // TODO: will need to check that the context bitmap mode is fixed
+                    // once we implement CanvasProxy
+                    let canvas = match canvas {
+                        // https://drafts.css-houdini.org/css-paint-api/#2d-rendering-context
+                        // Whenever "currentColor" is used as a color in the PaintRenderingContext2D API,
+                        // it is treated as opaque black.
+                        None => return Ok(RGBA::new(0, 0, 0, 255)),
+                        Some(ref canvas) => &**canvas,
+                    };
 
-        // Width and height ratios between the non clipped and clipped source rectangles
-        let width_ratio: f64 = source_rect_clipped.size.width / source_rect.size.width;
-        let height_ratio: f64 = source_rect_clipped.size.height / source_rect.size.height;
+                    let canvas_element = canvas.upcast::<Element>();
 
-        // When the source rectangle is outside the source image,
-        // the destination rectangle must be clipped in the same proportion.
-        let dest_rect_width_scaled: f64 = dw * width_ratio;
-        let dest_rect_height_scaled: f64 = dh * height_ratio;
+                    match canvas_element.style() {
+                        Some(ref s) if canvas_element.has_css_layout_box() => {
+                            Ok(s.get_color().color)
+                        },
+                        _ => Ok(RGBA::new(0, 0, 0, 255)),
+                    }
+                },
+                _ => Err(()),
+            }
+        } else {
+            Err(())
+        }
+    }
 
-        // The destination rectangle is the rectangle whose corners are the four points (dx, dy),
-        // (dx+dw, dy), (dx+dw, dy+dh), (dx, dy+dh).
-        let dest_rect = Rect::new(
-            Point2D::new(
-                dx.min(dx + dest_rect_width_scaled),
-                dy.min(dy + dest_rect_height_scaled),
-            ),
-            Size2D::new(dest_rect_width_scaled.abs(), dest_rect_height_scaled.abs()),
-        );
+    pub fn get_rect(&self, canvas: Option<&HTMLCanvasElement>, rect: Rect<u32>) -> Vec<u8> {
+        assert!(self.origin_is_clean());
 
-        let source_rect = Rect::new(
-            Point2D::new(source_rect_clipped.origin.x, source_rect_clipped.origin.y),
-            Size2D::new(
-                source_rect_clipped.size.width,
-                source_rect_clipped.size.height,
-            ),
-        );
+        // FIXME(nox): This is probably wrong when this is a context for an
+        // offscreen canvas.
+        let canvas_size = canvas.as_ref().map_or(Size2D::zero(), |c| c.get_size());
+        assert!(Rect::from_size(canvas_size).contains_rect(&rect));
 
-        (source_rect, dest_rect)
-    }
+        let (sender, receiver) = ipc::bytes_channel().unwrap();
+        self.send_canvas_2d_msg(Canvas2dMsg::GetImageData(rect, canvas_size, sender));
+        let mut pixels = receiver.recv().unwrap().to_vec();
 
-    // https://html.spec.whatwg.org/multipage/#the-image-argument-is-not-origin-clean
-    fn is_origin_clean(&self, image: CanvasImageSource) -> bool {
-        match image {
-            CanvasImageSource::HTMLCanvasElement(canvas) => canvas.origin_is_clean(),
-            CanvasImageSource::HTMLImageElement(image) => {
-                image.same_origin(GlobalScope::entry().origin())
-            },
-            CanvasImageSource::CSSStyleValue(_) => true,
+        for chunk in pixels.chunks_mut(4) {
+            let b = chunk[0];
+            chunk[0] = UNPREMULTIPLY_TABLE[256 * (chunk[3] as usize) + chunk[2] as usize];
+            chunk[1] = UNPREMULTIPLY_TABLE[256 * (chunk[3] as usize) + chunk[1] as usize];
+            chunk[2] = UNPREMULTIPLY_TABLE[256 * (chunk[3] as usize) + b as usize];
         }
+
+        pixels
     }
 
     //
@@ -360,6 +317,7 @@ impl CanvasRenderingContext2D {
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-drawimage
     fn draw_image(
         &self,
+        htmlcanvas: Option<&HTMLCanvasElement>,
         image: CanvasImageSource,
         sx: f64,
         sy: f64,
@@ -372,20 +330,20 @@ impl CanvasRenderingContext2D {
     ) -> ErrorResult {
         let result = match image {
             CanvasImageSource::HTMLCanvasElement(ref canvas) => {
-                self.draw_html_canvas_element(&canvas, sx, sy, sw, sh, dx, dy, dw, dh)
+                self.draw_html_canvas_element(&canvas, htmlcanvas, sx, sy, sw, sh, dx, dy, dw, dh)
             },
             CanvasImageSource::HTMLImageElement(ref image) => {
                 // https://html.spec.whatwg.org/multipage/#img-error
                 // If the image argument is an HTMLImageElement object that is in the broken state,
                 // then throw an InvalidStateError exception
                 let url = image.get_url().ok_or(Error::InvalidState)?;
-                self.fetch_and_draw_image_data(url, sx, sy, sw, sh, dx, dy, dw, dh)
+                self.fetch_and_draw_image_data(htmlcanvas, url, sx, sy, sw, sh, dx, dy, dw, dh)
             },
             CanvasImageSource::CSSStyleValue(ref value) => {
                 let url = value
                     .get_url(self.base_url.clone())
                     .ok_or(Error::InvalidState)?;
-                self.fetch_and_draw_image_data(url, sx, sy, sw, sh, dx, dy, dw, dh)
+                self.fetch_and_draw_image_data(htmlcanvas, url, sx, sy, sw, sh, dx, dy, dw, dh)
             },
         };
 
@@ -398,6 +356,7 @@ impl CanvasRenderingContext2D {
     fn draw_html_canvas_element(
         &self,
         canvas: &HTMLCanvasElement,
+        htmlcanvas: Option<&HTMLCanvasElement>,
         sx: f64,
         sy: f64,
         sw: Option<f64>,
@@ -433,7 +392,7 @@ impl CanvasRenderingContext2D {
             match *context {
                 CanvasContext::Context2d(ref context) => {
                     context.send_canvas_2d_msg(Canvas2dMsg::DrawImageInOther(
-                        self.canvas_state.borrow().get_canvas_id(),
+                        self.get_canvas_id(),
                         image_size,
                         dest_rect,
                         source_rect,
@@ -452,12 +411,13 @@ impl CanvasRenderingContext2D {
             ));
         }
 
-        self.mark_as_dirty();
+        self.mark_as_dirty(htmlcanvas);
         Ok(())
     }
 
     fn fetch_and_draw_image_data(
         &self,
+        canvas: Option<&HTMLCanvasElement>,
         url: ServoUrl,
         sx: f64,
         sy: f64,
@@ -494,182 +454,359 @@ impl CanvasRenderingContext2D {
             source_rect,
             smoothing_enabled,
         ));
-        self.mark_as_dirty();
+        self.mark_as_dirty(canvas);
         Ok(())
     }
 
-    fn fetch_image_data(&self, url: ServoUrl) -> Option<(Vec<u8>, Size2D<u32>)> {
-        let img = match self.request_image_from_cache(url) {
-            ImageResponse::Loaded(img, _) => img,
-            ImageResponse::PlaceholderLoaded(_, _) |
-            ImageResponse::None |
-            ImageResponse::MetadataLoaded(_) => {
-                return None;
-            },
-        };
+    fn mark_as_dirty(&self, canvas: Option<&HTMLCanvasElement>) {
+        if let Some(ref canvas) = canvas {
+            canvas.upcast::<Node>().dirty(NodeDamage::OtherNodeDamage);
+        }
+    }
 
-        let image_size = Size2D::new(img.width, img.height);
-        let image_data = match img.format {
-            PixelFormat::BGRA8 => img.bytes.to_vec(),
-            pixel_format => unimplemented!("unsupported pixel format ({:?})", pixel_format),
-        };
+    // It is used by DrawImage to calculate the size of the source and destination rectangles based
+    // on the drawImage call arguments
+    // source rectangle = area of the original image to be copied
+    // destination rectangle = area of the destination canvas where the source image is going to be drawn
+    fn adjust_source_dest_rects(
+        &self,
+        image_size: Size2D<f64>,
+        sx: f64,
+        sy: f64,
+        sw: f64,
+        sh: f64,
+        dx: f64,
+        dy: f64,
+        dw: f64,
+        dh: f64,
+    ) -> (Rect<f64>, Rect<f64>) {
+        let image_rect = Rect::new(
+            Point2D::new(0f64, 0f64),
+            Size2D::new(image_size.width as f64, image_size.height as f64),
+        );
 
-        Some((image_data, image_size))
-    }
+        // The source rectangle is the rectangle whose corners are the four points (sx, sy),
+        // (sx+sw, sy), (sx+sw, sy+sh), (sx, sy+sh).
+        let source_rect = Rect::new(
+            Point2D::new(sx.min(sx + sw), sy.min(sy + sh)),
+            Size2D::new(sw.abs(), sh.abs()),
+        );
 
-    #[inline]
-    fn request_image_from_cache(&self, url: ServoUrl) -> ImageResponse {
-        let response = self.image_cache.find_image_or_metadata(
-            url.clone(),
-            UsePlaceholder::No,
-            CanRequestImages::No,
+        // When the source rectangle is outside the source image,
+        // the source rectangle must be clipped to the source image
+        let source_rect_clipped = source_rect
+            .intersection(&image_rect)
+            .unwrap_or(Rect::zero());
+
+        // Width and height ratios between the non clipped and clipped source rectangles
+        let width_ratio: f64 = source_rect_clipped.size.width / source_rect.size.width;
+        let height_ratio: f64 = source_rect_clipped.size.height / source_rect.size.height;
+
+        // When the source rectangle is outside the source image,
+        // the destination rectangle must be clipped in the same proportion.
+        let dest_rect_width_scaled: f64 = dw * width_ratio;
+        let dest_rect_height_scaled: f64 = dh * height_ratio;
+
+        // The destination rectangle is the rectangle whose corners are the four points (dx, dy),
+        // (dx+dw, dy), (dx+dw, dy+dh), (dx, dy+dh).
+        let dest_rect = Rect::new(
+            Point2D::new(
+                dx.min(dx + dest_rect_width_scaled),
+                dy.min(dy + dest_rect_height_scaled),
+            ),
+            Size2D::new(dest_rect_width_scaled.abs(), dest_rect_height_scaled.abs()),
         );
-        match response {
-            Ok(ImageOrMetadataAvailable::ImageAvailable(image, url)) => {
-                ImageResponse::Loaded(image, url)
-            },
-            Err(ImageState::Pending(_)) => ImageResponse::None,
-            _ => {
-                // Rather annoyingly, we get the same response back from
-                // A load which really failed and from a load which hasn't started yet.
-                self.missing_image_urls.borrow_mut().push(url);
-                ImageResponse::None
-            },
-        }
-    }
 
-    pub fn take_missing_image_urls(&self) -> Vec<ServoUrl> {
-        mem::replace(&mut self.missing_image_urls.borrow_mut(), vec![])
+        let source_rect = Rect::new(
+            Point2D::new(source_rect_clipped.origin.x, source_rect_clipped.origin.y),
+            Size2D::new(
+                source_rect_clipped.size.width,
+                source_rect_clipped.size.height,
+            ),
+        );
+
+        (source_rect, dest_rect)
     }
 
-    fn parse_color(&self, string: &str) -> Result<RGBA, ()> {
-        let mut input = ParserInput::new(string);
-        let mut parser = Parser::new(&mut input);
-        let color = CSSColor::parse(&mut parser);
-        if parser.is_exhausted() {
-            match color {
-                Ok(CSSColor::RGBA(rgba)) => Ok(rgba),
-                Ok(CSSColor::CurrentColor) => {
-                    // TODO: https://github.com/whatwg/html/issues/1099
-                    // Reconsider how to calculate currentColor in a display:none canvas
+    fn update_transform(&self) {
+        self.send_canvas_2d_msg(Canvas2dMsg::SetTransform(self.state.borrow().transform))
+    }
 
-                    // TODO: will need to check that the context bitmap mode is fixed
-                    // once we implement CanvasProxy
-                    let canvas = match self.canvas {
-                        // https://drafts.css-houdini.org/css-paint-api/#2d-rendering-context
-                        // Whenever "currentColor" is used as a color in the PaintRenderingContext2D API,
-                        // it is treated as opaque black.
-                        None => return Ok(RGBA::new(0, 0, 0, 255)),
-                        Some(ref canvas) => &**canvas,
-                    };
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-fillrect
+    pub fn FillRect(&self, x: f64, y: f64, width: f64, height: f64) {
+        if let Some(rect) = self.create_drawable_rect(x, y, width, height) {
+            self.send_canvas_2d_msg(Canvas2dMsg::FillRect(rect));
+        }
+    }
 
-                    let canvas_element = canvas.upcast::<Element>();
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-clearrect
+    pub fn ClearRect(&self, x: f64, y: f64, width: f64, height: f64) {
+        if let Some(rect) = self.create_drawable_rect(x, y, width, height) {
+            self.send_canvas_2d_msg(Canvas2dMsg::ClearRect(rect));
+        }
+    }
 
-                    match canvas_element.style() {
-                        Some(ref s) if canvas_element.has_css_layout_box() => {
-                            Ok(s.get_color().color)
-                        },
-                        _ => Ok(RGBA::new(0, 0, 0, 255)),
-                    }
-                },
-                _ => Err(()),
-            }
-        } else {
-            Err(())
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-strokerect
+    pub fn StrokeRect(&self, x: f64, y: f64, width: f64, height: f64) {
+        if let Some(rect) = self.create_drawable_rect(x, y, width, height) {
+            self.send_canvas_2d_msg(Canvas2dMsg::StrokeRect(rect));
         }
     }
 
-    pub fn get_canvas_id(&self) -> CanvasId {
-        self.canvas_state.borrow().get_canvas_id()
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-shadowoffsetx
+    pub fn ShadowOffsetX(&self) -> f64 {
+        self.state.borrow().shadow_offset_x
     }
 
-    pub fn send_canvas_2d_msg(&self, msg: Canvas2dMsg) {
-        self.canvas_state.borrow().send_canvas_2d_msg(msg)
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-shadowoffsetx
+    pub fn SetShadowOffsetX(&self, value: f64) {
+        if !value.is_finite() || value == self.state.borrow().shadow_offset_x {
+            return;
+        }
+        self.state.borrow_mut().shadow_offset_x = value;
+        self.send_canvas_2d_msg(Canvas2dMsg::SetShadowOffsetX(value))
     }
 
-    pub fn get_ipc_renderer(&self) -> IpcSender<CanvasMsg> {
-        self.canvas_state.borrow().ipc_renderer.clone()
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-shadowoffsety
+    pub fn ShadowOffsetY(&self) -> f64 {
+        self.state.borrow().shadow_offset_y
     }
 
-    pub fn origin_is_clean(&self) -> bool {
-        self.origin_clean.get()
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-shadowoffsety
+    pub fn SetShadowOffsetY(&self, value: f64) {
+        if !value.is_finite() || value == self.state.borrow().shadow_offset_y {
+            return;
+        }
+        self.state.borrow_mut().shadow_offset_y = value;
+        self.send_canvas_2d_msg(Canvas2dMsg::SetShadowOffsetY(value))
     }
 
-    fn set_origin_unclean(&self) {
-        self.origin_clean.set(false)
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-shadowblur
+    pub fn ShadowBlur(&self) -> f64 {
+        self.state.borrow().shadow_blur
     }
 
-    pub fn get_rect(&self, rect: Rect<u32>) -> Vec<u8> {
-        assert!(self.origin_is_clean());
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-shadowblur
+    pub fn SetShadowBlur(&self, value: f64) {
+        if !value.is_finite() || value < 0f64 || value == self.state.borrow().shadow_blur {
+            return;
+        }
+        self.state.borrow_mut().shadow_blur = value;
+        self.send_canvas_2d_msg(Canvas2dMsg::SetShadowBlur(value))
+    }
 
-        // FIXME(nox): This is probably wrong when this is a context for an
-        // offscreen canvas.
-        let canvas_size = self
-            .canvas
-            .as_ref()
-            .map_or(Size2D::zero(), |c| c.get_size());
-        assert!(Rect::from_size(canvas_size).contains_rect(&rect));
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-shadowcolor
+    pub fn ShadowColor(&self) -> DOMString {
+        let mut result = String::new();
+        serialize(&self.state.borrow().shadow_color, &mut result).unwrap();
+        DOMString::from(result)
+    }
 
-        let (sender, receiver) = ipc::bytes_channel().unwrap();
-        self.send_canvas_2d_msg(Canvas2dMsg::GetImageData(rect, canvas_size, sender));
-        let mut pixels = receiver.recv().unwrap().to_vec();
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-shadowcolor
+    pub fn SetShadowColor(&self, value: DOMString) {
+        if let Ok(color) = parse_color(&value) {
+            self.state.borrow_mut().shadow_color = color;
+            self.send_canvas_2d_msg(Canvas2dMsg::SetShadowColor(color))
+        }
+    }
 
-        for chunk in pixels.chunks_mut(4) {
-            let b = chunk[0];
-            chunk[0] = UNPREMULTIPLY_TABLE[256 * (chunk[3] as usize) + chunk[2] as usize];
-            chunk[1] = UNPREMULTIPLY_TABLE[256 * (chunk[3] as usize) + chunk[1] as usize];
-            chunk[2] = UNPREMULTIPLY_TABLE[256 * (chunk[3] as usize) + b as usize];
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-strokestyle
+    pub fn StrokeStyle(&self) -> StringOrCanvasGradientOrCanvasPattern {
+        match self.state.borrow().stroke_style {
+            CanvasFillOrStrokeStyle::Color(ref rgba) => {
+                let mut result = String::new();
+                serialize(rgba, &mut result).unwrap();
+                StringOrCanvasGradientOrCanvasPattern::String(DOMString::from(result))
+            },
+            CanvasFillOrStrokeStyle::Gradient(ref gradient) => {
+                StringOrCanvasGradientOrCanvasPattern::CanvasGradient(DomRoot::from_ref(&*gradient))
+            },
+            CanvasFillOrStrokeStyle::Pattern(ref pattern) => {
+                StringOrCanvasGradientOrCanvasPattern::CanvasPattern(DomRoot::from_ref(&*pattern))
+            },
         }
+    }
 
-        pixels
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-strokestyle
+    pub fn SetStrokeStyle(
+        &self,
+        canvas: Option<&HTMLCanvasElement>,
+        value: StringOrCanvasGradientOrCanvasPattern,
+    ) {
+        match value {
+            StringOrCanvasGradientOrCanvasPattern::String(string) => {
+                if let Ok(rgba) = self.parse_color(canvas, &string) {
+                    self.state.borrow_mut().stroke_style = CanvasFillOrStrokeStyle::Color(rgba);
+                    self.send_canvas_2d_msg(Canvas2dMsg::SetStrokeStyle(FillOrStrokeStyle::Color(
+                        rgba,
+                    )));
+                }
+            },
+            StringOrCanvasGradientOrCanvasPattern::CanvasGradient(gradient) => {
+                self.state.borrow_mut().stroke_style =
+                    CanvasFillOrStrokeStyle::Gradient(Dom::from_ref(&*gradient));
+                self.send_canvas_2d_msg(Canvas2dMsg::SetStrokeStyle(
+                    gradient.to_fill_or_stroke_style(),
+                ));
+            },
+            StringOrCanvasGradientOrCanvasPattern::CanvasPattern(pattern) => {
+                self.state.borrow_mut().stroke_style =
+                    CanvasFillOrStrokeStyle::Pattern(Dom::from_ref(&*pattern));
+                self.send_canvas_2d_msg(Canvas2dMsg::SetStrokeStyle(
+                    pattern.to_fill_or_stroke_style(),
+                ));
+                if !pattern.origin_is_clean() {
+                    self.set_origin_unclean();
+                }
+            },
+        }
     }
-}
 
-pub trait LayoutCanvasRenderingContext2DHelpers {
-    #[allow(unsafe_code)]
-    unsafe fn get_ipc_renderer(&self) -> IpcSender<CanvasMsg>;
-    #[allow(unsafe_code)]
-    unsafe fn get_canvas_id(&self) -> CanvasId;
-}
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-strokestyle
+    pub fn FillStyle(&self) -> StringOrCanvasGradientOrCanvasPattern {
+        match self.state.borrow().fill_style {
+            CanvasFillOrStrokeStyle::Color(ref rgba) => {
+                let mut result = String::new();
+                serialize(rgba, &mut result).unwrap();
+                StringOrCanvasGradientOrCanvasPattern::String(DOMString::from(result))
+            },
+            CanvasFillOrStrokeStyle::Gradient(ref gradient) => {
+                StringOrCanvasGradientOrCanvasPattern::CanvasGradient(DomRoot::from_ref(&*gradient))
+            },
+            CanvasFillOrStrokeStyle::Pattern(ref pattern) => {
+                StringOrCanvasGradientOrCanvasPattern::CanvasPattern(DomRoot::from_ref(&*pattern))
+            },
+        }
+    }
 
-impl LayoutCanvasRenderingContext2DHelpers for LayoutDom<CanvasRenderingContext2D> {
-    #[allow(unsafe_code)]
-    unsafe fn get_ipc_renderer(&self) -> IpcSender<CanvasMsg> {
-        (*self.unsafe_get())
-            .canvas_state
-            .borrow_for_layout()
-            .ipc_renderer
-            .clone()
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-strokestyle
+    pub fn SetFillStyle(
+        &self,
+        canvas: Option<&HTMLCanvasElement>,
+        value: StringOrCanvasGradientOrCanvasPattern,
+    ) {
+        match value {
+            StringOrCanvasGradientOrCanvasPattern::String(string) => {
+                if let Ok(rgba) = self.parse_color(canvas, &string) {
+                    self.state.borrow_mut().fill_style = CanvasFillOrStrokeStyle::Color(rgba);
+                    self.send_canvas_2d_msg(Canvas2dMsg::SetFillStyle(FillOrStrokeStyle::Color(
+                        rgba,
+                    )))
+                }
+            },
+            StringOrCanvasGradientOrCanvasPattern::CanvasGradient(gradient) => {
+                self.state.borrow_mut().fill_style =
+                    CanvasFillOrStrokeStyle::Gradient(Dom::from_ref(&*gradient));
+                self.send_canvas_2d_msg(Canvas2dMsg::SetFillStyle(
+                    gradient.to_fill_or_stroke_style(),
+                ));
+            },
+            StringOrCanvasGradientOrCanvasPattern::CanvasPattern(pattern) => {
+                self.state.borrow_mut().fill_style =
+                    CanvasFillOrStrokeStyle::Pattern(Dom::from_ref(&*pattern));
+                self.send_canvas_2d_msg(Canvas2dMsg::SetFillStyle(
+                    pattern.to_fill_or_stroke_style(),
+                ));
+                if !pattern.origin_is_clean() {
+                    self.set_origin_unclean();
+                }
+            },
+        }
     }
 
-    #[allow(unsafe_code)]
-    unsafe fn get_canvas_id(&self) -> CanvasId {
-        (*self.unsafe_get())
-            .canvas_state
-            .borrow_for_layout()
-            .get_canvas_id()
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-createlineargradient
+    pub fn CreateLinearGradient(
+        &self,
+        global: &GlobalScope,
+        x0: Finite<f64>,
+        y0: Finite<f64>,
+        x1: Finite<f64>,
+        y1: Finite<f64>,
+    ) -> DomRoot<CanvasGradient> {
+        CanvasGradient::new(
+            global,
+            CanvasGradientStyle::Linear(LinearGradientStyle::new(*x0, *y0, *x1, *y1, Vec::new())),
+        )
     }
-}
 
-// We add a guard to each of methods by the spec:
-// http://www.w3.org/html/wg/drafts/2dcontext/html5_canvas_CR/
-//
-// > Except where otherwise specified, for the 2D context interface,
-// > any method call with a numeric argument whose value is infinite or a NaN value must be ignored.
-//
-//  Restricted values are guarded in glue code. Therefore we need not add a guard.
-//
-// FIXME: this behavior should might be generated by some annotattions to idl.
-impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-canvas
-    fn Canvas(&self) -> DomRoot<HTMLCanvasElement> {
-        // This method is not called from a paint worklet rendering context,
-        // so it's OK to panic if self.canvas is None.
-        DomRoot::from_ref(self.canvas.as_ref().expect("No canvas."))
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-createradialgradient
+    pub fn CreateRadialGradient(
+        &self,
+        global: &GlobalScope,
+        x0: Finite<f64>,
+        y0: Finite<f64>,
+        r0: Finite<f64>,
+        x1: Finite<f64>,
+        y1: Finite<f64>,
+        r1: Finite<f64>,
+    ) -> Fallible<DomRoot<CanvasGradient>> {
+        if *r0 < 0. || *r1 < 0. {
+            return Err(Error::IndexSize);
+        }
+
+        Ok(CanvasGradient::new(
+            global,
+            CanvasGradientStyle::Radial(RadialGradientStyle::new(
+                *x0,
+                *y0,
+                *r0,
+                *x1,
+                *y1,
+                *r1,
+                Vec::new(),
+            )),
+        ))
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-createpattern
+    pub fn CreatePattern(
+        &self,
+        global: &GlobalScope,
+        image: CanvasImageSource,
+        mut repetition: DOMString,
+    ) -> Fallible<DomRoot<CanvasPattern>> {
+        let (image_data, image_size) = match image {
+            CanvasImageSource::HTMLImageElement(ref image) => {
+                // https://html.spec.whatwg.org/multipage/#img-error
+                // If the image argument is an HTMLImageElement object that is in the broken state,
+                // then throw an InvalidStateError exception
+                image
+                    .get_url()
+                    .and_then(|url| self.fetch_image_data(url))
+                    .ok_or(Error::InvalidState)?
+            },
+            CanvasImageSource::HTMLCanvasElement(ref canvas) => {
+                let (data, size) = canvas.fetch_all_data().ok_or(Error::InvalidState)?;
+                let data = data
+                    .map(|data| data.to_vec())
+                    .unwrap_or_else(|| vec![0; size.area() as usize * 4]);
+                (data, size)
+            },
+            CanvasImageSource::CSSStyleValue(ref value) => value
+                .get_url(self.base_url.clone())
+                .and_then(|url| self.fetch_image_data(url))
+                .ok_or(Error::InvalidState)?,
+        };
+
+        if repetition.is_empty() {
+            repetition.push_str("repeat");
+        }
+
+        if let Ok(rep) = RepetitionStyle::from_str(&repetition) {
+            Ok(CanvasPattern::new(
+                global,
+                image_data,
+                image_size,
+                rep,
+                self.is_origin_clean(image),
+            ))
+        } else {
+            Err(Error::Syntax)
+        }
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-save
-    fn Save(&self) {
+    pub fn Save(&self) {
         self.saved_states
             .borrow_mut()
             .push(self.state.borrow().clone());
@@ -678,7 +815,7 @@ impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
 
     #[allow(unrooted_must_root)]
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-restore
-    fn Restore(&self) {
+    pub fn Restore(&self) {
         let mut saved_states = self.saved_states.borrow_mut();
         if let Some(state) = saved_states.pop() {
             self.state.borrow_mut().clone_from(&state);
@@ -686,200 +823,283 @@ impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
         }
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-scale
-    fn Scale(&self, x: f64, y: f64) {
-        if !(x.is_finite() && y.is_finite()) {
-            return;
-        }
-
-        let transform = self.state.borrow().transform;
-        self.state.borrow_mut().transform = transform.pre_scale(x as f32, y as f32);
-        self.update_transform()
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-globalalpha
+    pub fn GlobalAlpha(&self) -> f64 {
+        self.state.borrow().global_alpha
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-rotate
-    fn Rotate(&self, angle: f64) {
-        if angle == 0.0 || !angle.is_finite() {
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-globalalpha
+    pub fn SetGlobalAlpha(&self, alpha: f64) {
+        if !alpha.is_finite() || alpha > 1.0 || alpha < 0.0 {
             return;
         }
 
-        let (sin, cos) = (angle.sin(), angle.cos());
-        let transform = self.state.borrow().transform;
-        self.state.borrow_mut().transform = transform.pre_mul(&Transform2D::row_major(
-            cos as f32,
-            sin as f32,
-            -sin as f32,
-            cos as f32,
-            0.0,
-            0.0,
-        ));
-        self.update_transform()
+        self.state.borrow_mut().global_alpha = alpha;
+        self.send_canvas_2d_msg(Canvas2dMsg::SetGlobalAlpha(alpha as f32))
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-translate
-    fn Translate(&self, x: f64, y: f64) {
-        if !(x.is_finite() && y.is_finite()) {
-            return;
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-globalcompositeoperation
+    pub fn GlobalCompositeOperation(&self) -> DOMString {
+        match self.state.borrow().global_composition {
+            CompositionOrBlending::Composition(op) => DOMString::from(op.to_str()),
+            CompositionOrBlending::Blending(op) => DOMString::from(op.to_str()),
         }
-
-        let transform = self.state.borrow().transform;
-        self.state.borrow_mut().transform = transform.pre_translate(vec2(x as f32, y as f32));
-        self.update_transform()
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-transform
-    fn Transform(&self, a: f64, b: f64, c: f64, d: f64, e: f64, f: f64) {
-        if !(a.is_finite() &&
-            b.is_finite() &&
-            c.is_finite() &&
-            d.is_finite() &&
-            e.is_finite() &&
-            f.is_finite())
-        {
-            return;
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-globalcompositeoperation
+    pub fn SetGlobalCompositeOperation(&self, op_str: DOMString) {
+        if let Ok(op) = CompositionOrBlending::from_str(&op_str) {
+            self.state.borrow_mut().global_composition = op;
+            self.send_canvas_2d_msg(Canvas2dMsg::SetGlobalComposition(op))
         }
-
-        let transform = self.state.borrow().transform;
-        self.state.borrow_mut().transform = transform.pre_mul(&Transform2D::row_major(
-            a as f32, b as f32, c as f32, d as f32, e as f32, f as f32,
-        ));
-        self.update_transform()
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-settransform
-    fn SetTransform(&self, a: f64, b: f64, c: f64, d: f64, e: f64, f: f64) {
-        if !(a.is_finite() &&
-            b.is_finite() &&
-            c.is_finite() &&
-            d.is_finite() &&
-            e.is_finite() &&
-            f.is_finite())
-        {
-            return;
-        }
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-imagesmoothingenabled
+    pub fn ImageSmoothingEnabled(&self) -> bool {
+        self.state.borrow().image_smoothing_enabled
+    }
 
-        self.state.borrow_mut().transform =
-            Transform2D::row_major(a as f32, b as f32, c as f32, d as f32, e as f32, f as f32);
-        self.update_transform()
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-imagesmoothingenabled
+    pub fn SetImageSmoothingEnabled(&self, value: bool) {
+        self.state.borrow_mut().image_smoothing_enabled = value;
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-resettransform
-    fn ResetTransform(&self) {
-        self.state.borrow_mut().transform = Transform2D::identity();
-        self.update_transform()
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-filltext
+    pub fn FillText(&self, text: DOMString, x: f64, y: f64, max_width: Option<f64>) {
+        let parsed_text: String = text.into();
+        self.send_canvas_2d_msg(Canvas2dMsg::FillText(parsed_text, x, y, max_width));
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-globalalpha
-    fn GlobalAlpha(&self) -> f64 {
-        let state = self.state.borrow();
-        state.global_alpha
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-linewidth
+    pub fn LineWidth(&self) -> f64 {
+        self.state.borrow().line_width
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-globalalpha
-    fn SetGlobalAlpha(&self, alpha: f64) {
-        if !alpha.is_finite() || alpha > 1.0 || alpha < 0.0 {
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-linewidth
+    pub fn SetLineWidth(&self, width: f64) {
+        if !width.is_finite() || width <= 0.0 {
             return;
         }
 
-        self.state.borrow_mut().global_alpha = alpha;
-        self.send_canvas_2d_msg(Canvas2dMsg::SetGlobalAlpha(alpha as f32))
+        self.state.borrow_mut().line_width = width;
+        self.send_canvas_2d_msg(Canvas2dMsg::SetLineWidth(width as f32))
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-globalcompositeoperation
-    fn GlobalCompositeOperation(&self) -> DOMString {
-        let state = self.state.borrow();
-        match state.global_composition {
-            CompositionOrBlending::Composition(op) => DOMString::from(op.to_str()),
-            CompositionOrBlending::Blending(op) => DOMString::from(op.to_str()),
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-linecap
+    pub fn LineCap(&self) -> CanvasLineCap {
+        match self.state.borrow().line_cap {
+            LineCapStyle::Butt => CanvasLineCap::Butt,
+            LineCapStyle::Round => CanvasLineCap::Round,
+            LineCapStyle::Square => CanvasLineCap::Square,
         }
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-globalcompositeoperation
-    fn SetGlobalCompositeOperation(&self, op_str: DOMString) {
-        if let Ok(op) = CompositionOrBlending::from_str(&op_str) {
-            self.state.borrow_mut().global_composition = op;
-            self.send_canvas_2d_msg(Canvas2dMsg::SetGlobalComposition(op))
-        }
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-linecap
+    pub fn SetLineCap(&self, cap: CanvasLineCap) {
+        let line_cap = match cap {
+            CanvasLineCap::Butt => LineCapStyle::Butt,
+            CanvasLineCap::Round => LineCapStyle::Round,
+            CanvasLineCap::Square => LineCapStyle::Square,
+        };
+        self.state.borrow_mut().line_cap = line_cap;
+        self.send_canvas_2d_msg(Canvas2dMsg::SetLineCap(line_cap));
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-fillrect
-    fn FillRect(&self, x: f64, y: f64, width: f64, height: f64) {
-        self.canvas_state.borrow().FillRect(x, y, width, height);
-        self.mark_as_dirty();
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-linejoin
+    pub fn LineJoin(&self) -> CanvasLineJoin {
+        match self.state.borrow().line_join {
+            LineJoinStyle::Round => CanvasLineJoin::Round,
+            LineJoinStyle::Bevel => CanvasLineJoin::Bevel,
+            LineJoinStyle::Miter => CanvasLineJoin::Miter,
+        }
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-clearrect
-    fn ClearRect(&self, x: f64, y: f64, width: f64, height: f64) {
-        self.canvas_state.borrow().ClearRect(x, y, width, height);
-        self.mark_as_dirty();
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-linejoin
+    pub fn SetLineJoin(&self, join: CanvasLineJoin) {
+        let line_join = match join {
+            CanvasLineJoin::Round => LineJoinStyle::Round,
+            CanvasLineJoin::Bevel => LineJoinStyle::Bevel,
+            CanvasLineJoin::Miter => LineJoinStyle::Miter,
+        };
+        self.state.borrow_mut().line_join = line_join;
+        self.send_canvas_2d_msg(Canvas2dMsg::SetLineJoin(line_join));
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-strokerect
-    fn StrokeRect(&self, x: f64, y: f64, width: f64, height: f64) {
-        self.canvas_state.borrow().StrokeRect(x, y, width, height);
-        self.mark_as_dirty();
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-miterlimit
+    pub fn MiterLimit(&self) -> f64 {
+        self.state.borrow().miter_limit
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-beginpath
-    fn BeginPath(&self) {
-        self.send_canvas_2d_msg(Canvas2dMsg::BeginPath);
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-miterlimit
+    pub fn SetMiterLimit(&self, limit: f64) {
+        if !limit.is_finite() || limit <= 0.0 {
+            return;
+        }
+
+        self.state.borrow_mut().miter_limit = limit;
+        self.send_canvas_2d_msg(Canvas2dMsg::SetMiterLimit(limit as f32))
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-closepath
-    fn ClosePath(&self) {
-        self.send_canvas_2d_msg(Canvas2dMsg::ClosePath);
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-createimagedata
+    pub fn CreateImageData(
+        &self,
+        global: &GlobalScope,
+        sw: i32,
+        sh: i32,
+    ) -> Fallible<DomRoot<ImageData>> {
+        if sw == 0 || sh == 0 {
+            return Err(Error::IndexSize);
+        }
+        ImageData::new(global, sw.abs() as u32, sh.abs() as u32, None)
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-fill
-    fn Fill(&self, _: CanvasFillRule) {
-        // TODO: Process fill rule
-        self.send_canvas_2d_msg(Canvas2dMsg::Fill);
-        self.mark_as_dirty();
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-createimagedata
+    pub fn CreateImageData_(
+        &self,
+        global: &GlobalScope,
+        imagedata: &ImageData,
+    ) -> Fallible<DomRoot<ImageData>> {
+        ImageData::new(global, imagedata.Width(), imagedata.Height(), None)
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-stroke
-    fn Stroke(&self) {
-        self.send_canvas_2d_msg(Canvas2dMsg::Stroke);
-        self.mark_as_dirty();
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-getimagedata
+    pub fn GetImageData(
+        &self,
+        canvas: Option<&HTMLCanvasElement>,
+        global: &GlobalScope,
+        sx: i32,
+        sy: i32,
+        sw: i32,
+        sh: i32,
+    ) -> Fallible<DomRoot<ImageData>> {
+        // FIXME(nox): There are many arithmetic operations here that can
+        // overflow or underflow, this should probably be audited.
+
+        if sw == 0 || sh == 0 {
+            return Err(Error::IndexSize);
+        }
+
+        if !self.origin_is_clean() {
+            return Err(Error::Security);
+        }
+
+        let (origin, size) = adjust_size_sign(Point2D::new(sx, sy), Size2D::new(sw, sh));
+        // FIXME(nox): This is probably wrong when this is a context for an
+        // offscreen canvas.
+        let canvas_size = canvas.as_ref().map_or(Size2D::zero(), |c| c.get_size());
+        let read_rect = match pixels::clip(origin, size, canvas_size) {
+            Some(rect) => rect,
+            None => {
+                // All the pixels are outside the canvas surface.
+                return ImageData::new(global, size.width, size.height, None);
+            },
+        };
+
+        ImageData::new(
+            global,
+            size.width,
+            size.height,
+            Some(self.get_rect(canvas, read_rect)),
+        )
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-clip
-    fn Clip(&self, _: CanvasFillRule) {
-        // TODO: Process fill rule
-        self.send_canvas_2d_msg(Canvas2dMsg::Clip);
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-putimagedata
+    pub fn PutImageData(
+        &self,
+        canvas: Option<&HTMLCanvasElement>,
+        imagedata: &ImageData,
+        dx: i32,
+        dy: i32,
+    ) {
+        self.PutImageData_(
+            canvas,
+            imagedata,
+            dx,
+            dy,
+            0,
+            0,
+            imagedata.Width() as i32,
+            imagedata.Height() as i32,
+        )
     }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-ispointinpath
-    fn IsPointInPath(&self, x: f64, y: f64, fill_rule: CanvasFillRule) -> bool {
-        let fill_rule = match fill_rule {
-            CanvasFillRule::Nonzero => FillRule::Nonzero,
-            CanvasFillRule::Evenodd => FillRule::Evenodd,
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-putimagedata
+    #[allow(unsafe_code)]
+    pub fn PutImageData_(
+        &self,
+        canvas: Option<&HTMLCanvasElement>,
+        imagedata: &ImageData,
+        dx: i32,
+        dy: i32,
+        dirty_x: i32,
+        dirty_y: i32,
+        dirty_width: i32,
+        dirty_height: i32,
+    ) {
+        // FIXME(nox): There are many arithmetic operations here that can
+        // overflow or underflow, this should probably be audited.
+
+        let imagedata_size = Size2D::new(imagedata.Width(), imagedata.Height());
+        if imagedata_size.area() == 0 {
+            return;
+        }
+
+        // Step 1.
+        // Done later.
+
+        // Step 2.
+        // TODO: throw InvalidState if buffer is detached.
+
+        // FIXME(nox): This is probably wrong when this is a context for an
+        // offscreen canvas.
+        let canvas_size = canvas.as_ref().map_or(Size2D::zero(), |c| c.get_size());
+
+        // Steps 3-6.
+        let (src_origin, src_size) = adjust_size_sign(
+            Point2D::new(dirty_x, dirty_y),
+            Size2D::new(dirty_width, dirty_height),
+        );
+        let src_rect = match pixels::clip(src_origin, src_size, imagedata_size) {
+            Some(rect) => rect,
+            None => return,
+        };
+        let (dst_origin, _) = adjust_size_sign(
+            Point2D::new(dirty_x.saturating_add(dx), dirty_y.saturating_add(dy)),
+            Size2D::new(dirty_width, dirty_height),
+        );
+        // By clipping to the canvas surface, we avoid sending any pixel
+        // that would fall outside it.
+        let dst_rect = match pixels::clip(dst_origin, src_rect.size, canvas_size) {
+            Some(rect) => rect,
+            None => return,
         };
-        let (sender, receiver) =
-            profiled_ipc::channel::<bool>(self.global().time_profiler_chan().clone()).unwrap();
-        self.send_canvas_2d_msg(Canvas2dMsg::IsPointInPath(x, y, fill_rule, sender));
-        receiver.recv().unwrap()
-    }
 
-    // https://html.spec.whatwg.org/multipage/#dom-context-2d-filltext
-    fn FillText(&self, text: DOMString, x: f64, y: f64, max_width: Option<f64>) {
-        let parsed_text: String = text.into();
-        self.send_canvas_2d_msg(Canvas2dMsg::FillText(parsed_text, x, y, max_width));
-        self.mark_as_dirty();
+        // Step 7.
+        let (sender, receiver) = ipc::bytes_channel().unwrap();
+        let pixels = unsafe { &imagedata.get_rect(Rect::new(src_rect.origin, dst_rect.size)) };
+        self.send_canvas_2d_msg(Canvas2dMsg::PutImageData(dst_rect, receiver));
+        sender.send(pixels).unwrap();
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-drawimage
-    fn DrawImage(&self, image: CanvasImageSource, dx: f64, dy: f64) -> ErrorResult {
+    pub fn DrawImage(
+        &self,
+        canvas: Option<&HTMLCanvasElement>,
+        image: CanvasImageSource,
+        dx: f64,
+        dy: f64,
+    ) -> ErrorResult {
         if !(dx.is_finite() && dy.is_finite()) {
             return Ok(());
         }
 
-        self.draw_image(image, 0f64, 0f64, None, None, dx, dy, None, None)
+        self.draw_image(canvas, image, 0f64, 0f64, None, None, dx, dy, None, None)
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-drawimage
-    fn DrawImage_(
+    pub fn DrawImage_(
         &self,
+        canvas: Option<&HTMLCanvasElement>,
         image: CanvasImageSource,
         dx: f64,
         dy: f64,
@@ -890,12 +1110,24 @@ impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
             return Ok(());
         }
 
-        self.draw_image(image, 0f64, 0f64, None, None, dx, dy, Some(dw), Some(dh))
+        self.draw_image(
+            canvas,
+            image,
+            0f64,
+            0f64,
+            None,
+            None,
+            dx,
+            dy,
+            Some(dw),
+            Some(dh),
+        )
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-drawimage
-    fn DrawImage__(
+    pub fn DrawImage__(
         &self,
+        canvas: Option<&HTMLCanvasElement>,
         image: CanvasImageSource,
         sx: f64,
         sy: f64,
@@ -919,6 +1151,7 @@ impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
         }
 
         self.draw_image(
+            canvas,
             image,
             sx,
             sy,
@@ -931,8 +1164,136 @@ impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
         )
     }
 
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-beginpath
+    pub fn BeginPath(&self) {
+        self.send_canvas_2d_msg(Canvas2dMsg::BeginPath);
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-fill
+    pub fn Fill(&self, _fill_rule: CanvasFillRule) {
+        // TODO: Process fill rule
+        self.send_canvas_2d_msg(Canvas2dMsg::Fill);
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-stroke
+    pub fn Stroke(&self) {
+        self.send_canvas_2d_msg(Canvas2dMsg::Stroke);
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-clip
+    pub fn Clip(&self, _fill_rule: CanvasFillRule) {
+        // TODO: Process fill rule
+        self.send_canvas_2d_msg(Canvas2dMsg::Clip);
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-ispointinpath
+    pub fn IsPointInPath(
+        &self,
+        global: &GlobalScope,
+        x: f64,
+        y: f64,
+        fill_rule: CanvasFillRule,
+    ) -> bool {
+        let fill_rule = match fill_rule {
+            CanvasFillRule::Nonzero => FillRule::Nonzero,
+            CanvasFillRule::Evenodd => FillRule::Evenodd,
+        };
+        let (sender, receiver) =
+            profiled_ipc::channel::<bool>(global.time_profiler_chan().clone()).unwrap();
+        self.send_canvas_2d_msg(Canvas2dMsg::IsPointInPath(x, y, fill_rule, sender));
+        receiver.recv().unwrap()
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-scale
+    pub fn Scale(&self, x: f64, y: f64) {
+        if !(x.is_finite() && y.is_finite()) {
+            return;
+        }
+
+        let transform = self.state.borrow().transform;
+        self.state.borrow_mut().transform = transform.pre_scale(x as f32, y as f32);
+        self.update_transform()
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-rotate
+    pub fn Rotate(&self, angle: f64) {
+        if angle == 0.0 || !angle.is_finite() {
+            return;
+        }
+
+        let (sin, cos) = (angle.sin(), angle.cos());
+        let transform = self.state.borrow().transform;
+        self.state.borrow_mut().transform = transform.pre_mul(&Transform2D::row_major(
+            cos as f32,
+            sin as f32,
+            -sin as f32,
+            cos as f32,
+            0.0,
+            0.0,
+        ));
+        self.update_transform()
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-translate
+    pub fn Translate(&self, x: f64, y: f64) {
+        if !(x.is_finite() && y.is_finite()) {
+            return;
+        }
+
+        let transform = self.state.borrow().transform;
+        self.state.borrow_mut().transform = transform.pre_translate(vec2(x as f32, y as f32));
+        self.update_transform()
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-transform
+    pub fn Transform(&self, a: f64, b: f64, c: f64, d: f64, e: f64, f: f64) {
+        if !(a.is_finite() &&
+            b.is_finite() &&
+            c.is_finite() &&
+            d.is_finite() &&
+            e.is_finite() &&
+            f.is_finite())
+        {
+            return;
+        }
+
+        let transform = self.state.borrow().transform;
+        self.state.borrow_mut().transform = transform.pre_mul(&Transform2D::row_major(
+            a as f32, b as f32, c as f32, d as f32, e as f32, f as f32,
+        ));
+        self.update_transform()
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-settransform
+    pub fn SetTransform(&self, a: f64, b: f64, c: f64, d: f64, e: f64, f: f64) {
+        if !(a.is_finite() &&
+            b.is_finite() &&
+            c.is_finite() &&
+            d.is_finite() &&
+            e.is_finite() &&
+            f.is_finite())
+        {
+            return;
+        }
+
+        self.state.borrow_mut().transform =
+            Transform2D::row_major(a as f32, b as f32, c as f32, d as f32, e as f32, f as f32);
+        self.update_transform()
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-resettransform
+    pub fn ResetTransform(&self) {
+        self.state.borrow_mut().transform = Transform2D::identity();
+        self.update_transform()
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-closepath
+    pub fn ClosePath(&self) {
+        self.send_canvas_2d_msg(Canvas2dMsg::ClosePath);
+    }
+
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-moveto
-    fn MoveTo(&self, x: f64, y: f64) {
+    pub fn MoveTo(&self, x: f64, y: f64) {
         if !(x.is_finite() && y.is_finite()) {
             return;
         }
@@ -940,7 +1301,7 @@ impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-lineto
-    fn LineTo(&self, x: f64, y: f64) {
+    pub fn LineTo(&self, x: f64, y: f64) {
         if !(x.is_finite() && y.is_finite()) {
             return;
         }
@@ -948,7 +1309,7 @@ impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-rect
-    fn Rect(&self, x: f64, y: f64, width: f64, height: f64) {
+    pub fn Rect(&self, x: f64, y: f64, width: f64, height: f64) {
         if [x, y, width, height].iter().all(|val| val.is_finite()) {
             let rect = Rect::new(
                 Point2D::new(x as f32, y as f32),
@@ -959,7 +1320,7 @@ impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-quadraticcurveto
-    fn QuadraticCurveTo(&self, cpx: f64, cpy: f64, x: f64, y: f64) {
+    pub fn QuadraticCurveTo(&self, cpx: f64, cpy: f64, x: f64, y: f64) {
         if !(cpx.is_finite() && cpy.is_finite() && x.is_finite() && y.is_finite()) {
             return;
         }
@@ -970,7 +1331,7 @@ impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-beziercurveto
-    fn BezierCurveTo(&self, cp1x: f64, cp1y: f64, cp2x: f64, cp2y: f64, x: f64, y: f64) {
+    pub fn BezierCurveTo(&self, cp1x: f64, cp1y: f64, cp2x: f64, cp2y: f64, x: f64, y: f64) {
         if !(cp1x.is_finite() &&
             cp1y.is_finite() &&
             cp2x.is_finite() &&
@@ -988,7 +1349,7 @@ impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-arc
-    fn Arc(&self, x: f64, y: f64, r: f64, start: f64, end: f64, ccw: bool) -> ErrorResult {
+    pub fn Arc(&self, x: f64, y: f64, r: f64, start: f64, end: f64, ccw: bool) -> ErrorResult {
         if !([x, y, r, start, end].iter().all(|x| x.is_finite())) {
             return Ok(());
         }
@@ -1008,7 +1369,7 @@ impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-arcto
-    fn ArcTo(&self, cp1x: f64, cp1y: f64, cp2x: f64, cp2y: f64, r: f64) -> ErrorResult {
+    pub fn ArcTo(&self, cp1x: f64, cp1y: f64, cp2x: f64, cp2y: f64, r: f64) -> ErrorResult {
         if !([cp1x, cp1y, cp2x, cp2y, r].iter().all(|x| x.is_finite())) {
             return Ok(());
         }
@@ -1025,7 +1386,7 @@ impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-ellipse
-    fn Ellipse(
+    pub fn Ellipse(
         &self,
         x: f64,
         y: f64,
@@ -1057,173 +1418,430 @@ impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
         ));
         Ok(())
     }
+}
+
+impl CanvasRenderingContext2D {
+    pub fn new_inherited(
+        global: &GlobalScope,
+        canvas: Option<&HTMLCanvasElement>,
+        size: Size2D<u32>,
+    ) -> CanvasRenderingContext2D {
+        CanvasRenderingContext2D {
+            reflector_: Reflector::new(),
+            canvas: canvas.map(Dom::from_ref),
+            canvas_state: DomRefCell::new(CanvasState::new(
+                global,
+                Size2D::new(size.width as u64, size.height as u64),
+            )),
+        }
+    }
+
+    pub fn new(
+        global: &GlobalScope,
+        canvas: &HTMLCanvasElement,
+        size: Size2D<u32>,
+    ) -> DomRoot<CanvasRenderingContext2D> {
+        let boxed = Box::new(CanvasRenderingContext2D::new_inherited(
+            global,
+            Some(canvas),
+            size,
+        ));
+        reflect_dom_object(boxed, global, CanvasRenderingContext2DBinding::Wrap)
+    }
+
+    // https://html.spec.whatwg.org/multipage/#concept-canvas-set-bitmap-dimensions
+    pub fn set_bitmap_dimensions(&self, size: Size2D<u32>) {
+        self.reset_to_initial_state();
+        self.canvas_state
+            .borrow()
+            .ipc_renderer
+            .send(CanvasMsg::Recreate(
+                size,
+                self.canvas_state.borrow().get_canvas_id(),
+            ))
+            .unwrap();
+    }
+
+    // https://html.spec.whatwg.org/multipage/#reset-the-rendering-context-to-its-default-state
+    fn reset_to_initial_state(&self) {
+        self.canvas_state.borrow().saved_states.borrow_mut().clear();
+        *self.canvas_state.borrow().state.borrow_mut() = CanvasContextState::new();
+    }
+
+    fn mark_as_dirty(&self) {
+        self.canvas_state
+            .borrow()
+            .mark_as_dirty(self.canvas.as_ref().map(|c| &**c))
+    }
+
+    pub fn take_missing_image_urls(&self) -> Vec<ServoUrl> {
+        mem::replace(
+            &mut self.canvas_state.borrow().missing_image_urls.borrow_mut(),
+            vec![],
+        )
+    }
+
+    pub fn get_canvas_id(&self) -> CanvasId {
+        self.canvas_state.borrow().get_canvas_id()
+    }
+
+    pub fn send_canvas_2d_msg(&self, msg: Canvas2dMsg) {
+        self.canvas_state.borrow().send_canvas_2d_msg(msg)
+    }
+
+    pub fn get_ipc_renderer(&self) -> IpcSender<CanvasMsg> {
+        self.canvas_state.borrow().ipc_renderer.clone()
+    }
+
+    pub fn origin_is_clean(&self) -> bool {
+        self.canvas_state.borrow().origin_is_clean()
+    }
+
+    pub fn get_rect(&self, rect: Rect<u32>) -> Vec<u8> {
+        self.canvas_state
+            .borrow()
+            .get_rect(self.canvas.as_ref().map(|c| &**c), rect)
+    }
+}
+
+pub trait LayoutCanvasRenderingContext2DHelpers {
+    #[allow(unsafe_code)]
+    unsafe fn get_ipc_renderer(&self) -> IpcSender<CanvasMsg>;
+    #[allow(unsafe_code)]
+    unsafe fn get_canvas_id(&self) -> CanvasId;
+}
+
+impl LayoutCanvasRenderingContext2DHelpers for LayoutDom<CanvasRenderingContext2D> {
+    #[allow(unsafe_code)]
+    unsafe fn get_ipc_renderer(&self) -> IpcSender<CanvasMsg> {
+        (*self.unsafe_get())
+            .canvas_state
+            .borrow_for_layout()
+            .ipc_renderer
+            .clone()
+    }
+
+    #[allow(unsafe_code)]
+    unsafe fn get_canvas_id(&self) -> CanvasId {
+        (*self.unsafe_get())
+            .canvas_state
+            .borrow_for_layout()
+            .get_canvas_id()
+    }
+}
+
+// We add a guard to each of methods by the spec:
+// http://www.w3.org/html/wg/drafts/2dcontext/html5_canvas_CR/
+//
+// > Except where otherwise specified, for the 2D context interface,
+// > any method call with a numeric argument whose value is infinite or a NaN value must be ignored.
+//
+//  Restricted values are guarded in glue code. Therefore we need not add a guard.
+//
+// FIXME: this behavior should might be generated by some annotattions to idl.
+impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-canvas
+    fn Canvas(&self) -> DomRoot<HTMLCanvasElement> {
+        // This method is not called from a paint worklet rendering context,
+        // so it's OK to panic if self.canvas is None.
+        DomRoot::from_ref(self.canvas.as_ref().expect("No canvas."))
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-save
+    fn Save(&self) {
+        self.canvas_state.borrow().Save()
+    }
+
+    #[allow(unrooted_must_root)]
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-restore
+    fn Restore(&self) {
+        self.canvas_state.borrow().Restore()
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-scale
+    fn Scale(&self, x: f64, y: f64) {
+        self.canvas_state.borrow().Scale(x, y)
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-rotate
+    fn Rotate(&self, angle: f64) {
+        self.canvas_state.borrow().Rotate(angle)
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-translate
+    fn Translate(&self, x: f64, y: f64) {
+        self.canvas_state.borrow().Translate(x, y)
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-transform
+    fn Transform(&self, a: f64, b: f64, c: f64, d: f64, e: f64, f: f64) {
+        self.canvas_state.borrow().Transform(a, b, c, d, e, f)
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-settransform
+    fn SetTransform(&self, a: f64, b: f64, c: f64, d: f64, e: f64, f: f64) {
+        self.canvas_state.borrow().SetTransform(a, b, c, d, e, f)
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-resettransform
+    fn ResetTransform(&self) {
+        self.canvas_state.borrow().ResetTransform()
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-globalalpha
+    fn GlobalAlpha(&self) -> f64 {
+        self.canvas_state.borrow().GlobalAlpha()
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-globalalpha
+    fn SetGlobalAlpha(&self, alpha: f64) {
+        self.canvas_state.borrow().SetGlobalAlpha(alpha)
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-globalcompositeoperation
+    fn GlobalCompositeOperation(&self) -> DOMString {
+        self.canvas_state.borrow().GlobalCompositeOperation()
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-globalcompositeoperation
+    fn SetGlobalCompositeOperation(&self, op_str: DOMString) {
+        self.canvas_state
+            .borrow()
+            .SetGlobalCompositeOperation(op_str)
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-fillrect
+    fn FillRect(&self, x: f64, y: f64, width: f64, height: f64) {
+        self.canvas_state.borrow().FillRect(x, y, width, height);
+        self.mark_as_dirty();
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-clearrect
+    fn ClearRect(&self, x: f64, y: f64, width: f64, height: f64) {
+        self.canvas_state.borrow().ClearRect(x, y, width, height);
+        self.mark_as_dirty();
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-strokerect
+    fn StrokeRect(&self, x: f64, y: f64, width: f64, height: f64) {
+        self.canvas_state.borrow().StrokeRect(x, y, width, height);
+        self.mark_as_dirty();
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-beginpath
+    fn BeginPath(&self) {
+        self.canvas_state.borrow().BeginPath()
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-closepath
+    fn ClosePath(&self) {
+        self.canvas_state.borrow().ClosePath()
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-fill
+    fn Fill(&self, fill_rule: CanvasFillRule) {
+        self.canvas_state.borrow().Fill(fill_rule);
+        self.mark_as_dirty();
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-stroke
+    fn Stroke(&self) {
+        self.canvas_state.borrow().Stroke();
+        self.mark_as_dirty();
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-clip
+    fn Clip(&self, fill_rule: CanvasFillRule) {
+        self.canvas_state.borrow().Clip(fill_rule)
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-ispointinpath
+    fn IsPointInPath(&self, x: f64, y: f64, fill_rule: CanvasFillRule) -> bool {
+        self.canvas_state
+            .borrow()
+            .IsPointInPath(&self.global(), x, y, fill_rule)
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-filltext
+    fn FillText(&self, text: DOMString, x: f64, y: f64, max_width: Option<f64>) {
+        self.canvas_state.borrow().FillText(text, x, y, max_width);
+        self.mark_as_dirty();
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-drawimage
+    fn DrawImage(&self, image: CanvasImageSource, dx: f64, dy: f64) -> ErrorResult {
+        self.canvas_state
+            .borrow()
+            .DrawImage(self.canvas.as_ref().map(|c| &**c), image, dx, dy)
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-drawimage
+    fn DrawImage_(
+        &self,
+        image: CanvasImageSource,
+        dx: f64,
+        dy: f64,
+        dw: f64,
+        dh: f64,
+    ) -> ErrorResult {
+        self.canvas_state.borrow().DrawImage_(
+            self.canvas.as_ref().map(|c| &**c),
+            image,
+            dx,
+            dy,
+            dw,
+            dh,
+        )
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-drawimage
+    fn DrawImage__(
+        &self,
+        image: CanvasImageSource,
+        sx: f64,
+        sy: f64,
+        sw: f64,
+        sh: f64,
+        dx: f64,
+        dy: f64,
+        dw: f64,
+        dh: f64,
+    ) -> ErrorResult {
+        self.canvas_state.borrow().DrawImage__(
+            self.canvas.as_ref().map(|c| &**c),
+            image,
+            sx,
+            sy,
+            sw,
+            sh,
+            dx,
+            dy,
+            dw,
+            dh,
+        )
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-moveto
+    fn MoveTo(&self, x: f64, y: f64) {
+        self.canvas_state.borrow().MoveTo(x, y)
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-lineto
+    fn LineTo(&self, x: f64, y: f64) {
+        self.canvas_state.borrow().LineTo(x, y)
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-rect
+    fn Rect(&self, x: f64, y: f64, width: f64, height: f64) {
+        self.canvas_state.borrow().Rect(x, y, width, height)
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-quadraticcurveto
+    fn QuadraticCurveTo(&self, cpx: f64, cpy: f64, x: f64, y: f64) {
+        self.canvas_state.borrow().QuadraticCurveTo(cpx, cpy, x, y)
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-beziercurveto
+    fn BezierCurveTo(&self, cp1x: f64, cp1y: f64, cp2x: f64, cp2y: f64, x: f64, y: f64) {
+        self.canvas_state
+            .borrow()
+            .BezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y)
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-arc
+    fn Arc(&self, x: f64, y: f64, r: f64, start: f64, end: f64, ccw: bool) -> ErrorResult {
+        self.canvas_state.borrow().Arc(x, y, r, start, end, ccw)
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-arcto
+    fn ArcTo(&self, cp1x: f64, cp1y: f64, cp2x: f64, cp2y: f64, r: f64) -> ErrorResult {
+        self.canvas_state.borrow().ArcTo(cp1x, cp1y, cp2x, cp2y, r)
+    }
+
+    // https://html.spec.whatwg.org/multipage/#dom-context-2d-ellipse
+    fn Ellipse(
+        &self,
+        x: f64,
+        y: f64,
+        rx: f64,
+        ry: f64,
+        rotation: f64,
+        start: f64,
+        end: f64,
+        ccw: bool,
+    ) -> ErrorResult {
+        self.canvas_state
+            .borrow()
+            .Ellipse(x, y, rx, ry, rotation, start, end, ccw)
+    }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-imagesmoothingenabled
     fn ImageSmoothingEnabled(&self) -> bool {
-        let state = self.state.borrow();
-        state.image_smoothing_enabled
+        self.canvas_state.borrow().ImageSmoothingEnabled()
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-imagesmoothingenabled
     fn SetImageSmoothingEnabled(&self, value: bool) {
-        self.state.borrow_mut().image_smoothing_enabled = value;
+        self.canvas_state.borrow().SetImageSmoothingEnabled(value)
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-strokestyle
     fn StrokeStyle(&self) -> StringOrCanvasGradientOrCanvasPattern {
-        match self.state.borrow().stroke_style {
-            CanvasFillOrStrokeStyle::Color(ref rgba) => {
-                let mut result = String::new();
-                serialize(rgba, &mut result).unwrap();
-                StringOrCanvasGradientOrCanvasPattern::String(DOMString::from(result))
-            },
-            CanvasFillOrStrokeStyle::Gradient(ref gradient) => {
-                StringOrCanvasGradientOrCanvasPattern::CanvasGradient(DomRoot::from_ref(&*gradient))
-            },
-            CanvasFillOrStrokeStyle::Pattern(ref pattern) => {
-                StringOrCanvasGradientOrCanvasPattern::CanvasPattern(DomRoot::from_ref(&*pattern))
-            },
-        }
+        self.canvas_state.borrow().StrokeStyle()
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-strokestyle
     fn SetStrokeStyle(&self, value: StringOrCanvasGradientOrCanvasPattern) {
-        match value {
-            StringOrCanvasGradientOrCanvasPattern::String(string) => {
-                if let Ok(rgba) = self.parse_color(&string) {
-                    self.state.borrow_mut().stroke_style = CanvasFillOrStrokeStyle::Color(rgba);
-                    self.send_canvas_2d_msg(Canvas2dMsg::SetStrokeStyle(FillOrStrokeStyle::Color(
-                        rgba,
-                    )));
-                }
-            },
-            StringOrCanvasGradientOrCanvasPattern::CanvasGradient(gradient) => {
-                self.state.borrow_mut().stroke_style =
-                    CanvasFillOrStrokeStyle::Gradient(Dom::from_ref(&*gradient));
-                self.send_canvas_2d_msg(Canvas2dMsg::SetStrokeStyle(
-                    gradient.to_fill_or_stroke_style(),
-                ));
-            },
-            StringOrCanvasGradientOrCanvasPattern::CanvasPattern(pattern) => {
-                self.state.borrow_mut().stroke_style =
-                    CanvasFillOrStrokeStyle::Pattern(Dom::from_ref(&*pattern));
-                self.send_canvas_2d_msg(Canvas2dMsg::SetStrokeStyle(
-                    pattern.to_fill_or_stroke_style(),
-                ));
-                if !pattern.origin_is_clean() {
-                    self.set_origin_unclean();
-                }
-            },
-        }
+        self.canvas_state
+            .borrow()
+            .SetStrokeStyle(self.canvas.as_ref().map(|c| &**c), value)
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-strokestyle
     fn FillStyle(&self) -> StringOrCanvasGradientOrCanvasPattern {
-        match self.state.borrow().fill_style {
-            CanvasFillOrStrokeStyle::Color(ref rgba) => {
-                let mut result = String::new();
-                serialize(rgba, &mut result).unwrap();
-                StringOrCanvasGradientOrCanvasPattern::String(DOMString::from(result))
-            },
-            CanvasFillOrStrokeStyle::Gradient(ref gradient) => {
-                StringOrCanvasGradientOrCanvasPattern::CanvasGradient(DomRoot::from_ref(&*gradient))
-            },
-            CanvasFillOrStrokeStyle::Pattern(ref pattern) => {
-                StringOrCanvasGradientOrCanvasPattern::CanvasPattern(DomRoot::from_ref(&*pattern))
-            },
-        }
+        self.canvas_state.borrow().FillStyle()
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-strokestyle
     fn SetFillStyle(&self, value: StringOrCanvasGradientOrCanvasPattern) {
-        match value {
-            StringOrCanvasGradientOrCanvasPattern::String(string) => {
-                if let Ok(rgba) = self.parse_color(&string) {
-                    self.state.borrow_mut().fill_style = CanvasFillOrStrokeStyle::Color(rgba);
-                    self.send_canvas_2d_msg(Canvas2dMsg::SetFillStyle(FillOrStrokeStyle::Color(
-                        rgba,
-                    )))
-                }
-            },
-            StringOrCanvasGradientOrCanvasPattern::CanvasGradient(gradient) => {
-                self.state.borrow_mut().fill_style =
-                    CanvasFillOrStrokeStyle::Gradient(Dom::from_ref(&*gradient));
-                self.send_canvas_2d_msg(Canvas2dMsg::SetFillStyle(
-                    gradient.to_fill_or_stroke_style(),
-                ));
-            },
-            StringOrCanvasGradientOrCanvasPattern::CanvasPattern(pattern) => {
-                self.state.borrow_mut().fill_style =
-                    CanvasFillOrStrokeStyle::Pattern(Dom::from_ref(&*pattern));
-                self.send_canvas_2d_msg(Canvas2dMsg::SetFillStyle(
-                    pattern.to_fill_or_stroke_style(),
-                ));
-                if !pattern.origin_is_clean() {
-                    self.set_origin_unclean();
-                }
-            },
-        }
+        self.canvas_state
+            .borrow()
+            .SetFillStyle(self.canvas.as_ref().map(|c| &**c), value)
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-createimagedata
     fn CreateImageData(&self, sw: i32, sh: i32) -> Fallible<DomRoot<ImageData>> {
-        if sw == 0 || sh == 0 {
-            return Err(Error::IndexSize);
-        }
-        ImageData::new(&self.global(), sw.abs() as u32, sh.abs() as u32, None)
+        self.canvas_state
+            .borrow()
+            .CreateImageData(&self.global(), sw, sh)
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-createimagedata
     fn CreateImageData_(&self, imagedata: &ImageData) -> Fallible<DomRoot<ImageData>> {
-        ImageData::new(&self.global(), imagedata.Width(), imagedata.Height(), None)
+        self.canvas_state
+            .borrow()
+            .CreateImageData_(&self.global(), imagedata)
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-getimagedata
     fn GetImageData(&self, sx: i32, sy: i32, sw: i32, sh: i32) -> Fallible<DomRoot<ImageData>> {
-        // FIXME(nox): There are many arithmetic operations here that can
-        // overflow or underflow, this should probably be audited.
-
-        if sw == 0 || sh == 0 {
-            return Err(Error::IndexSize);
-        }
-
-        if !self.origin_is_clean() {
-            return Err(Error::Security);
-        }
-
-        let (origin, size) = adjust_size_sign(Point2D::new(sx, sy), Size2D::new(sw, sh));
-        // FIXME(nox): This is probably wrong when this is a context for an
-        // offscreen canvas.
-        let canvas_size = self
-            .canvas
-            .as_ref()
-            .map_or(Size2D::zero(), |c| c.get_size());
-        let read_rect = match pixels::clip(origin, size, canvas_size) {
-            Some(rect) => rect,
-            None => {
-                // All the pixels are outside the canvas surface.
-                return ImageData::new(&self.global(), size.width, size.height, None);
-            },
-        };
-
-        ImageData::new(
+        self.canvas_state.borrow().GetImageData(
+            self.canvas.as_ref().map(|c| &**c),
             &self.global(),
-            size.width,
-            size.height,
-            Some(self.get_rect(read_rect)),
+            sx,
+            sy,
+            sw,
+            sh,
         )
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-putimagedata
     fn PutImageData(&self, imagedata: &ImageData, dx: i32, dy: i32) {
-        self.PutImageData_(
+        self.canvas_state.borrow().PutImageData(
+            self.canvas.as_ref().map(|c| &**c),
             imagedata,
             dx,
             dy,
-            0,
-            0,
-            imagedata.Width() as i32,
-            imagedata.Height() as i32,
         )
     }
 
@@ -1239,52 +1857,16 @@ impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
         dirty_width: i32,
         dirty_height: i32,
     ) {
-        // FIXME(nox): There are many arithmetic operations here that can
-        // overflow or underflow, this should probably be audited.
-
-        let imagedata_size = Size2D::new(imagedata.Width(), imagedata.Height());
-        if imagedata_size.area() == 0 {
-            return;
-        }
-
-        // Step 1.
-        // Done later.
-
-        // Step 2.
-        // TODO: throw InvalidState if buffer is detached.
-
-        // FIXME(nox): This is probably wrong when this is a context for an
-        // offscreen canvas.
-        let canvas_size = self
-            .canvas
-            .as_ref()
-            .map_or(Size2D::zero(), |c| c.get_size());
-
-        // Steps 3-6.
-        let (src_origin, src_size) = adjust_size_sign(
-            Point2D::new(dirty_x, dirty_y),
-            Size2D::new(dirty_width, dirty_height),
-        );
-        let src_rect = match pixels::clip(src_origin, src_size, imagedata_size) {
-            Some(rect) => rect,
-            None => return,
-        };
-        let (dst_origin, _) = adjust_size_sign(
-            Point2D::new(dirty_x.saturating_add(dx), dirty_y.saturating_add(dy)),
-            Size2D::new(dirty_width, dirty_height),
+        self.canvas_state.borrow().PutImageData_(
+            self.canvas.as_ref().map(|c| &**c),
+            imagedata,
+            dx,
+            dy,
+            dirty_x,
+            dirty_y,
+            dirty_width,
+            dirty_height,
         );
-        // By clipping to the canvas surface, we avoid sending any pixel
-        // that would fall outside it.
-        let dst_rect = match pixels::clip(dst_origin, src_rect.size, canvas_size) {
-            Some(rect) => rect,
-            None => return,
-        };
-
-        // Step 7.
-        let (sender, receiver) = ipc::bytes_channel().unwrap();
-        let pixels = unsafe { &imagedata.get_rect(Rect::new(src_rect.origin, dst_rect.size)) };
-        self.send_canvas_2d_msg(Canvas2dMsg::PutImageData(dst_rect, receiver));
-        sender.send(pixels).unwrap();
         self.mark_as_dirty();
     }
 
@@ -1296,10 +1878,9 @@ impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
         x1: Finite<f64>,
         y1: Finite<f64>,
     ) -> DomRoot<CanvasGradient> {
-        CanvasGradient::new(
-            &self.global(),
-            CanvasGradientStyle::Linear(LinearGradientStyle::new(*x0, *y0, *x1, *y1, Vec::new())),
-        )
+        self.canvas_state
+            .borrow()
+            .CreateLinearGradient(&self.global(), x0, y0, x1, y1)
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-createradialgradient
@@ -1312,197 +1893,100 @@ impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
         y1: Finite<f64>,
         r1: Finite<f64>,
     ) -> Fallible<DomRoot<CanvasGradient>> {
-        if *r0 < 0. || *r1 < 0. {
-            return Err(Error::IndexSize);
-        }
-
-        Ok(CanvasGradient::new(
-            &self.global(),
-            CanvasGradientStyle::Radial(RadialGradientStyle::new(
-                *x0,
-                *y0,
-                *r0,
-                *x1,
-                *y1,
-                *r1,
-                Vec::new(),
-            )),
-        ))
+        self.canvas_state
+            .borrow()
+            .CreateRadialGradient(&self.global(), x0, y0, r0, x1, y1, r1)
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-createpattern
     fn CreatePattern(
         &self,
         image: CanvasImageSource,
-        mut repetition: DOMString,
+        repetition: DOMString,
     ) -> Fallible<DomRoot<CanvasPattern>> {
-        let (image_data, image_size) = match image {
-            CanvasImageSource::HTMLImageElement(ref image) => {
-                // https://html.spec.whatwg.org/multipage/#img-error
-                // If the image argument is an HTMLImageElement object that is in the broken state,
-                // then throw an InvalidStateError exception
-                image
-                    .get_url()
-                    .and_then(|url| self.fetch_image_data(url))
-                    .ok_or(Error::InvalidState)?
-            },
-            CanvasImageSource::HTMLCanvasElement(ref canvas) => {
-                let (data, size) = canvas.fetch_all_data().ok_or(Error::InvalidState)?;
-                let data = data
-                    .map(|data| data.to_vec())
-                    .unwrap_or_else(|| vec![0; size.area() as usize * 4]);
-                (data, size)
-            },
-            CanvasImageSource::CSSStyleValue(ref value) => value
-                .get_url(self.base_url.clone())
-                .and_then(|url| self.fetch_image_data(url))
-                .ok_or(Error::InvalidState)?,
-        };
-
-        if repetition.is_empty() {
-            repetition.push_str("repeat");
-        }
-
-        if let Ok(rep) = RepetitionStyle::from_str(&repetition) {
-            Ok(CanvasPattern::new(
-                &self.global(),
-                image_data,
-                image_size,
-                rep,
-                self.is_origin_clean(image),
-            ))
-        } else {
-            Err(Error::Syntax)
-        }
+        self.canvas_state
+            .borrow()
+            .CreatePattern(&self.global(), image, repetition)
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-linewidth
     fn LineWidth(&self) -> f64 {
-        let state = self.state.borrow();
-        state.line_width
+        self.canvas_state.borrow().LineWidth()
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-linewidth
     fn SetLineWidth(&self, width: f64) {
-        if !width.is_finite() || width <= 0.0 {
-            return;
-        }
-
-        self.state.borrow_mut().line_width = width;
-        self.send_canvas_2d_msg(Canvas2dMsg::SetLineWidth(width as f32))
+        self.canvas_state.borrow().SetLineWidth(width)
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-linecap
     fn LineCap(&self) -> CanvasLineCap {
-        match self.state.borrow().line_cap {
-            LineCapStyle::Butt => CanvasLineCap::Butt,
-            LineCapStyle::Round => CanvasLineCap::Round,
-            LineCapStyle::Square => CanvasLineCap::Square,
-        }
+        self.canvas_state.borrow().LineCap()
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-linecap
     fn SetLineCap(&self, cap: CanvasLineCap) {
-        let line_cap = match cap {
-            CanvasLineCap::Butt => LineCapStyle::Butt,
-            CanvasLineCap::Round => LineCapStyle::Round,
-            CanvasLineCap::Square => LineCapStyle::Square,
-        };
-        self.state.borrow_mut().line_cap = line_cap;
-        self.send_canvas_2d_msg(Canvas2dMsg::SetLineCap(line_cap));
+        self.canvas_state.borrow().SetLineCap(cap)
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-linejoin
     fn LineJoin(&self) -> CanvasLineJoin {
-        match self.state.borrow().line_join {
-            LineJoinStyle::Round => CanvasLineJoin::Round,
-            LineJoinStyle::Bevel => CanvasLineJoin::Bevel,
-            LineJoinStyle::Miter => CanvasLineJoin::Miter,
-        }
+        self.canvas_state.borrow().LineJoin()
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-linejoin
     fn SetLineJoin(&self, join: CanvasLineJoin) {
-        let line_join = match join {
-            CanvasLineJoin::Round => LineJoinStyle::Round,
-            CanvasLineJoin::Bevel => LineJoinStyle::Bevel,
-            CanvasLineJoin::Miter => LineJoinStyle::Miter,
-        };
-        self.state.borrow_mut().line_join = line_join;
-        self.send_canvas_2d_msg(Canvas2dMsg::SetLineJoin(line_join));
+        self.canvas_state.borrow().SetLineJoin(join)
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-miterlimit
     fn MiterLimit(&self) -> f64 {
-        let state = self.state.borrow();
-        state.miter_limit
+        self.canvas_state.borrow().MiterLimit()
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-miterlimit
     fn SetMiterLimit(&self, limit: f64) {
-        if !limit.is_finite() || limit <= 0.0 {
-            return;
-        }
-
-        self.state.borrow_mut().miter_limit = limit;
-        self.send_canvas_2d_msg(Canvas2dMsg::SetMiterLimit(limit as f32))
+        self.canvas_state.borrow().SetMiterLimit(limit)
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-shadowoffsetx
     fn ShadowOffsetX(&self) -> f64 {
-        self.state.borrow().shadow_offset_x
+        self.canvas_state.borrow().ShadowOffsetX()
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-shadowoffsetx
     fn SetShadowOffsetX(&self, value: f64) {
-        if !value.is_finite() || value == self.state.borrow().shadow_offset_x {
-            return;
-        }
-        self.state.borrow_mut().shadow_offset_x = value;
-        self.send_canvas_2d_msg(Canvas2dMsg::SetShadowOffsetX(value))
+        self.canvas_state.borrow().SetShadowOffsetX(value)
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-shadowoffsety
     fn ShadowOffsetY(&self) -> f64 {
-        self.state.borrow().shadow_offset_y
+        self.canvas_state.borrow().ShadowOffsetY()
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-shadowoffsety
     fn SetShadowOffsetY(&self, value: f64) {
-        if !value.is_finite() || value == self.state.borrow().shadow_offset_y {
-            return;
-        }
-        self.state.borrow_mut().shadow_offset_y = value;
-        self.send_canvas_2d_msg(Canvas2dMsg::SetShadowOffsetY(value))
+        self.canvas_state.borrow().SetShadowOffsetY(value)
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-shadowblur
     fn ShadowBlur(&self) -> f64 {
-        self.state.borrow().shadow_blur
+        self.canvas_state.borrow().ShadowBlur()
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-shadowblur
     fn SetShadowBlur(&self, value: f64) {
-        if !value.is_finite() || value < 0f64 || value == self.state.borrow().shadow_blur {
-            return;
-        }
-        self.state.borrow_mut().shadow_blur = value;
-        self.send_canvas_2d_msg(Canvas2dMsg::SetShadowBlur(value))
+        self.canvas_state.borrow().SetShadowBlur(value)
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-shadowcolor
     fn ShadowColor(&self) -> DOMString {
-        let mut result = String::new();
-        serialize(&self.state.borrow().shadow_color, &mut result).unwrap();
-        DOMString::from(result)
+        self.canvas_state.borrow().ShadowColor()
     }
 
     // https://html.spec.whatwg.org/multipage/#dom-context-2d-shadowcolor
     fn SetShadowColor(&self, value: DOMString) {
-        if let Ok(color) = parse_color(&value) {
-            self.state.borrow_mut().shadow_color = color;
-            self.send_canvas_2d_msg(Canvas2dMsg::SetShadowColor(color))
-        }
+        self.canvas_state.borrow().SetShadowColor(value)
     }
 }