[whatwg/dom] Allow SVGSVGElement as image parameter in CanvasRenderingContext2D.drawImage() (Issue #1281)

### What is the issue with the DOM Standard?

Currently a `SVGSVGElement` can only be rendered in a HTML canvas by
- serializing the containing document to a string
- creating a blob out of it
- convert the blob to an url
- create an image element and assign the src property
- adding an EventListener which draws the loaded image asynchronously.
```js
const svgSource =
`<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
  "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1 1" version="1.1">
  <circle cx="0.5" cy="0.5" r="0.4" fill="red" stroke="blue" stroke-width="10"/>
</svg>
`;
  
addEventListener("load", () => {
  function drawSVGSVGElement(svgsvgElement) {
// serializing the containing document to a string
    const s = new XMLSerializer();
    const str = s.serializeToString(svgsvgElement.ownerDocument);
// creating a blob out of it    
    let blob = new Blob([str], {type: 'image/svg+xml'});
    let url = URL.createObjectURL(blob);
// create an image element and assign the src property    
    let image = document.createElement('img');
    image.src = url;
// adding an EventListener which draws the loaded image.*/    
    image.addEventListener('load', function () {
      const canvas = document.getElementById('canvas');
      const context = canvas.getContext("2d");
      context.drawImage(image, 0, 0);
      URL.revokeObjectURL(url);
    });
  }
  function getSVGSVGElement() {
    const parser = new DOMParser();
    const doc = parser.parseFromString(svgSource, "image/svg+xml");
    return doc.documentElement;
  }
  const svgsvgElement = getSVGSVGElement();
  drawSVGSVGElement(svgsvgElement);
}, false);
```

If  CanvasRenderingContext2D.drawImage() also allows to have an image parameter of type `SVGSVGElement` the code would be
```js
function drawSVGSVGElement(svgsvgElement) {
  const canvas = document.getElementById('canvas');
  const context = canvas.getContext("2d");
  context.drawImage(svgsvgElement, 0, 0);
}
```


-- 
Reply to this email directly or view it on GitHub:
https://github.com/whatwg/dom/issues/1281
You are receiving this because you are subscribed to this thread.

Message ID: <whatwg/dom/issues/1281@github.com>