javascript - How can I get width and height of SVG on Image.load in IE 11

Question

It works fine everywhere but not in IE 11 (I have not tested other IE versions yet).

var img = new Image();
img.onload = function(){

   alert( 'img: ' + img.width + 'x' + img.height + 
          '  natural: ' + img.naturalWidth + 'x' + img.naturalHeight );

};
img.src = 'http://upload.wikimedia.org/wikipedia/en/b/b5/Boeing-Logo.svg';

JSFiddle: JSFiddle

Result:

img: 121x30 natural: 121x30 - Real browsers (Chrome, Safari, Firefox, ...)

img: 0x0 natural: 0x0 - IE 11

There is a similar question here: Getting image width on image load fails on IE

None of the solutions from those answers work for svg.

Is there a way to get the width and height of a svg file loaded with Image() in Internet Explorer 11?

Note: I am looking for a solution without having to add the element to the DOM for measuring, as I want to avoid any unnecessary re-flow/repaint.

Answer 1

This code works in IE11:

var img = new Image();
img.onload = function(){
    document.body.appendChild(this);
    alert( 'img: ' + this.offsetWidth + 'x' + this.offsetHeight);
    document.body.removeChild(this);
};
img.src = 'http://upload.wikimedia.org/wikipedia/en/b/b5/Boeing-Logo.svg';

And yes - this solution is not ideal.