Rasterizing an in-document SVG to Canvas

In order to answer this question properly I thought that I would:

1. Convert an in-document SVG file to a data URL
2. Load it into an <img>
3. Draw that <img> to a <canvas>
4. Convert that <canvas> to a PNG data URL
5. Load that data URL into an image.

I have an example of this attempt here:
http://phrogz.net/SVG/svg_to_png.xhtml

In Firefox I get (NS_ERROR_NOT_AVAILABLE) [nsIDOMCanvasRenderingContext2D.drawImage] when attempting to draw the image to the canvas in step 3.

Why do I get this error in Firefox, or how do I work around it?

In Chrome I get a SECURITY_ERR exception when I try to call toDataURL() in step 4.

Why would I get this error in Chrome, or how do I work around it?

The WhatWG specs state that the origin for an image "generated from a data: URL found in another Document or in a script" should be the same as that document. All data in this test is from the same document.