-prefix-free breaks @import in IE9.

[mkantor]

Despite the fact that -prefix-free doesn't parse imported stylesheets it still manages to break @import rules in IE9.

You can see the problem in in tests 27-33 on this page. Test 38 also fails occasionally —if you reload the page a bunch of times it will sometimes be orange instead of green. The only @import that always seems to work correctly from my tests is an imported CSS data URI in a linked stylesheet.

IE10 works correctly as far as all of these tests are concerned.

I'm surprised nobody else has already posted about this issue.

This might be related to #110.

[mkantor]

There's also a fun way to crash IE9 that seems related to this issue (you probably don't want to click on that link if you're browsing from IE9). If there are nested imports in a style element then manipulating its contents from JavaScript causes a crash. If you check out the source for my tests you'll see that I had to comment out a few test cases to prevent these kinds of crashes.

Surprisingly, this similar code does not produce a crash, which may indicate that it has something to do with the difference between how IE9 internally represents styles which are present in plain CSS versus those which are inserted via JavaScript (maybe the different representations are "at odds" with eachother and this is what causes the crash).

[mkantor]

By the way, using the data-noprefix attribute avoids this issue (since -prefix-free doesn't touch the CSS at all in that case), so a temporary workaround would be to ensure all @import rules occur in elements with that attribute.