Force rem in at-rules only if IE9-10 are in scope

robwierzbowski · Jun 30, 2015 · 8576499 · 8576499
1 parent ff4c0d2
commit 8576499
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/lib/pixrem.js b/lib/pixrem.js
@@ -64,8 +64,8 @@ Pixrem.prototype.postcss = function (css) {
   //Then, for each rules
   css.eachRule(function (rule) {
 
-    // do not convert rem if in at-rule
-    if (!_options.atrules) {
+    // if options.at-rules is false AND it's not IE9-10: skip @rules
+    if (!_options.atrules && !specialCaseIE) {
       if (rule.type === 'atrule' || (rule.parent && rule.parent.type === 'atrule')) { return; }
     }
 

diff --git a/spec/pixrem-spec.js b/spec/pixrem-spec.js
@@ -105,6 +105,13 @@ describe('pixrem', function () {
     expect(processed).toBe(expected);
   });
 
+  it('should convert rem in at-rules for IE9 hacks', function () {
+    var css = '@media screen { .rule { font-size: 2rem } .rule::after { font-size: 2rem } }';
+    var expected = '@media screen { .rule { font-size: 2rem } .rule::after { font-size: 32px; font-size: 2rem } }';
+    var processed = pixrem.process(css, undefined, {browsers: 'ie 9'});
+    expect(processed).toBe(expected);
+  });
+
   it('should not convert rem in nested at-rules', function () {
     var css = '@media screen { .rule { font-size: 2rem } @media screen { .rule { font-size: 2rem } @media screen { .rule { font-size: 2rem } } } }';
     var processed = pixrem.process(css);