title: foreignobject is not working in IE10
body: <p>I want to draw HTML text in canvas using foreignobject element, In MDN i can see the below link (see reference), this is working fine in Chrome and Mozilla browser but not in IE10, I am using IE10.</p>
  
  <p>Browser Mode: IE10 &amp; Document Mode: Standards </p>
  
  <p>Reference:
  <a href="https://developer.mozilla.org/en/docs/HTML/Canvas/Drawing_DOM_objects_into_a_canvas">https://developer.mozilla.org/en/docs/HTML/Canvas/Drawing_DOM_objects_into_a_canvas</a></p>
  
  <p>Error:</p>
  
  <pre><code>DOM7000: Access Denied. Resource access is restricted for cross-origin URL: 'blob:7C72C95F-3E3F-4CD6-804C-C2D8CCC06283'. 
  </code></pre>
  
  <p>file:</p>
  
  <p>Below is the code snippet : -</p>
  
  <pre><code>            &lt;!DOCTYPE html&gt;
              &lt;html&gt;
              &lt;body&gt;
              &lt;p&gt;&lt;canvas id="canvas" style="border:2px solid black;" width="200" height="200"&gt;&lt;/canvas&gt;
              &lt;script&gt;
              var canvas = document.getElementById("canvas");
              var ctx = canvas.getContext("2d");
              var data = "&lt;svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'&gt;" +
                           "&lt;foreignObject width='100%' height='100%'&gt;" +
                             "&lt;div xmlns='http://www.w3.org/1999/xhtml' style='font-size:40px'&gt;" +
                               "&lt;em&gt;I&lt;/em&gt; like &lt;span style='color:white; text-shadow:0 0 2px blue;'&gt;cheese&lt;/span&gt;" +
                             "&lt;/div&gt;" +
                           "&lt;/foreignObject&gt;" +
                         "&lt;/svg&gt;";
              var DOMURL = self.URL || self.webkitURL || self;
              var img = new Image();
              var svg = new Blob([data], {type: "image/svg+xml;charset=utf-8"});
              var url = DOMURL.createObjectURL(svg);
              img.onload = function() {
                  ctx.drawImage(img, 0, 0);
                  DOMURL.revokeObjectURL(url);
              };
              img.src = url;
              &lt;/script&gt;
              &lt;/body&gt;
              &lt;/html&gt;
  </code></pre>