Fix IE rendering of SVG as overlay image (#4324)

* Fix IE rendering of SVG as overlay image

* Fix IE rendering of SVG as overlay image #2 - Fix coding syntax (CI)

* Fix IE rendering of SVG as overlay image #3 - Fix coding syntax (CI)

* Fix IE rendering of SVG as overlay image #4 - Moved to method 'loadImageInDom'

* Fix IE rendering of SVG as overlay image #5 - Moved some stuff around

* Fix IE rendering of SVG as overlay image #6 - Fixed the setTimeout (removed)

* Update misc.js

src/util/misc.js

@@ -295,11 +295,12 @@
       var img = fabric.util.createImage();
 
       /** @ignore */
-      img.onload = function () {
+      var onLoadCallback = function () {
         callback && callback.call(context, img);
         img = img.onload = img.onerror = null;
       };
 
+      img.onload = onLoadCallback;
       /** @ignore */
       img.onerror = function() {
         fabric.log('Error loading ' + img.src);
@@ -315,9 +316,43 @@
         img.crossOrigin = crossOrigin;
       }
 
+      // IE10 / IE11-Fix: SVG contents from data: URI
+      // will only be available if the IMG is present
+      // in the DOM (and visible)
+      if (url.substring(0,14) === 'data:image/svg') {
+        img.onload = null;
+        fabric.util.loadImageInDom(img, onLoadCallback);
+      }
+
       img.src = url;
     },
 
+    /**
+     * Attaches SVG image with data: URL to the dom
+     * @memberOf fabric.util
+     * @param {Object} img Image object with data:image/svg src
+     * @param {Function} callback Callback; invoked with loaded image
+     * @return {Object} DOM element (div containing the SVG image)
+     */
+    loadImageInDom: function(img, onLoadCallback) {
+      var div = fabric.document.createElement('div');
+      div.style.width = div.style.height = '1px';
+      div.style.left = div.style.top = '-100%';
+      div.style.position = 'absolute';
+      div.appendChild(img);
+      fabric.document.querySelector('body').appendChild(div);
+      /**
+       * Wrap in function to:
+       *   1. Call existing callback
+       *   2. Cleanup DOM
+       */
+      img.onload = function () {
+        onLoadCallback();
+        div.parentNode.removeChild(div);
+        div = null;
+      };
+    },
+
     /**
      * Creates corresponding fabric instances from their object representations
      * @static