Nomisoft
Menu

IE11 SVG font-face bug

20th April 2016

I'm adding a post about this strange bug I came across in case anyone else has the same issue and is struggling to find the cause.

A project I was working on involved pre-loading a bunch of SVG images. During browser testing it was discovered that Internet Explorer 11 would crash when either refreshing or leaving the site without any error messages.

After a lot of trial and error the bug was narrowed down to being the loading of an SVG via Javascript which has an embedded css font-face declaration results. The following example demonstrates this.

The Code


#broken.svg
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" 
xmlns:xlink="http://www.w3.org/1999/xlink" width="100px" height="100px">
<defs>
<style type="text/css">
/* <![CDATA[ */
@font-face {}
/* ]]> */
</style>
</defs>
  <text>SVG Text</text>
</svg> 

#script.js
var image = new Image();
image.src = 'broken.svg';

Note that the font-face can be empty without any fonts actually being loaded and it will still result in crashing.