compass 0.13.alpha.7 → 0.13.alpha.8

data/lib/compass/browser_support.rb

@@ -5,8 +5,8 @@ module Compass
     ASPECTS = %w(webkit moz o ms svg css2)
 
     SIMPLE_FUNCTIONS = {
-           "image" => %w(), # No browsers implement this yet.
-      "cross-fade" => %w()  # No browsers implement this yet.
+           "image" => %w(webkit),
+      "cross-fade" => %w(webkit)
     }
 
     # Adds support for one or more aspects for the given simple function

data/lib/compass/caniuse.rb

@@ -76,34 +76,58 @@ class Compass::CanIUse
     result
   end
 
-  def browser_minimums(capability, prefix = nil)
+  def browser_ranges(capability, prefix = nil, include_unprefixed_versions = true)
     assert_valid_capability capability
     browsers = prefix.nil? ? browsers() : browsers_with_prefix(prefix)
     browsers.inject({}) do |m, browser|
-      version = versions(browser).find do |version|
-                  support = browser_support(browser, version, capability)
-                  if prefix.nil?
-                    support !~ /\bn\b/ && support !~ /\bx\b/
-                  else
-                    actual_prefix = prefix(browser, version)
-                    support !~ /\bn\b/ && support =~ /\bx\b/ && prefix == actual_prefix
-                  end
-                end
-      m.update(browser => version) if version
+      browser_versions = versions(browser)
+      min_version = find_first_prefixed_version(browser, browser_versions, capability, prefix)
+      if min_version
+        max_version = if include_unprefixed_versions
+                        browser_versions.last
+                      else
+                        find_first_prefixed_version(browser, browser_versions.reverse, capability, prefix)
+                      end
+        m.update(browser => [min_version, max_version])
+      end
       m
     end
   end
 
-  # How many users would be omitted if support for the given browser starts
-  # with the given version.
-  def omitted_usage(browser, min_version)
-    assert_valid_browser browser
+  def find_first_prefixed_version(browser, versions, capability, prefix)
+    versions.find do |version|
+      support = browser_support(browser, version, capability)
+      if prefix.nil?
+        support !~ /\bn\b/ && support !~ /\bx\b/
+      else
+        actual_prefix = prefix(browser, version)
+        support !~ /\bn\b/ && support =~ /\bx\b/ && prefix == actual_prefix
+      end
+    end
+  end
+
+  # @overload omitted_usage(browser, min_supported_version)
+  #   How many users would be omitted if support for the given browser starts
+  #   with the given version.
+  #
+  # @overload omitted_usage(browser, min_unsupported_version, max_unsupported_version)
+  #   How many users would be omitted if the browsers with version
+  def omitted_usage(browser, min_version, max_version = nil)
+    versions = versions(browser)
+    if max_version.nil?
+      assert_valid_version browser, min_version
+    else
+      assert_valid_version browser, min_version, max_version
+    end
     usage = 0
-    versions(browser).each do |version|
-      return usage if version == min_version
-      usage += usage(browser, version)
+    in_range = max_version.nil?
+    versions.each do |version|
+      break if max_version.nil? && version == min_version
+      in_range = true if (!max_version.nil? && version == min_version)
+      usage += usage(browser, version) if in_range
+      break if !max_version.nil? && version == max_version
     end
-    raise ArgumentError, "#{min_version} is not a version for #{browser}"
+    return usage
   end
 
   # returns the list of browsers that use the given prefix
@@ -150,6 +174,18 @@ class Compass::CanIUse
     usage
   end
 
+  def next_version(browser, version)
+    versions = versions(browser)
+    index = versions.index(version)
+    index < versions.length - 1 ? versions[index + 1] : nil
+  end
+
+  def previous_version(browser, version)
+    versions = versions(browser)
+    index = versions.index(version)
+    index > 0 ? versions[index - 1] : nil
+  end
+
   # Returns whether the given minimum version of a browser
   # requires the use of a prefix for the stated capability.
   def requires_prefix(browser, min_version, capability, capability_options_list)

data/lib/compass/sass_extensions/functions/cross_browser_support.rb

@@ -139,12 +139,34 @@ module Compass::SassExtensions::Functions::CrossBrowserSupport
 
   # The percent of users that are omitted by setting the min_version of browser
   # as specified.
-  def omitted_usage(browser, min_version)
+  def omitted_usage(browser, min_version, max_version = nil)
     assert_type browser, :String
-    assert_type min_version, :String
-    number(Compass::CanIUse.instance.omitted_usage(browser.value, min_version.value))
+    assert_type min_version, :String, :min_version
+    assert_type(max_version, :String, :max_version) if max_version
+    versions = [min_version.value]
+    versions << max_version.value if max_version
+    number(Compass::CanIUse.instance.omitted_usage(browser.value, *versions))
   end
   Sass::Script::Functions.declare(:omitted_usage, [:browser, :min_version])
+  Sass::Script::Functions.declare(:omitted_usage, [:browser, :min_version, :max_version])
+
+  # The version before the version for the browser specified
+  def previous_version(browser, version)
+    assert_type browser, :String
+    assert_type version, :String
+    previous = Compass::CanIUse.instance.previous_version(browser.value, version.value)
+    previous.nil? ? null() : quoted_string(previous)
+  end
+  Sass::Script::Functions.declare(:previous_version, [:browser, :version])
+
+  # The version before the version for the browser specified
+  def next_version(browser, version)
+    assert_type browser, :String
+    assert_type version, :String
+    next_version = Compass::CanIUse.instance.next_version(browser.value, version.value)
+    next_version.nil? ? null() : quoted_string(next_version)
+  end
+  Sass::Script::Functions.declare(:next_version, [:browser, :version])
 
   # The percent of users relying on a particular prefix
   def prefix_usage(prefix, capability, capability_options)
@@ -164,9 +186,9 @@ module Compass::SassExtensions::Functions::CrossBrowserSupport
   # * <0 if the first version is less than the second
   # * >0 if the first version is more than the second
   def compare_browser_versions(browser, version1, version2)
-    assert_type browser, :String
-    assert_type version1, :String
-    assert_type version2, :String
+    assert_type browser, :String, :browser
+    assert_type version1, :String, :version1
+    assert_type version2, :String, :version2
     index1 = index2 = nil
     Compass::CanIUse.instance.versions(browser.value).each_with_index do |v, i|
       index1 = i if v == version1.value
@@ -191,12 +213,14 @@ module Compass::SassExtensions::Functions::CrossBrowserSupport
   # without a prefix.
   #
   # If a browser does not have the capability, it will not included in the map.
-  def browser_minimums(capability, prefix = null())
+  def browser_ranges(capability, prefix = null(), include_unprefixed_versions = bool(true))
     assert_type capability, :String
     assert_type(prefix, :String) unless prefix == null()
-    mins = Compass::CanIUse.instance.browser_minimums(capability.value, prefix.value)
-    Sass::Script::Value::Map.new(mins.inject({}) do |m, (h, k)|
-      m[identifier(h)] = quoted_string(k)
+    mins = Compass::CanIUse.instance.browser_ranges(capability.value,
+                                                    prefix.value,
+                                                    include_unprefixed_versions.to_bool)
+    Sass::Script::Value::Map.new(mins.inject({}) do |m, (h, range)|
+      m[identifier(h)] = list(range.map{|version| quoted_string(version)}, :space)
       m
     end)
   end

data/test/fixtures/stylesheets/compass/css/animation-with-legacy-ie.css

@@ -4,21 +4,18 @@
 
   50% {
     opacity: 0; } }
-
 @-webkit-keyframes test {
   0%, 100% {
     opacity: 1; }
 
   50% {
     opacity: 0; } }
-
 @keyframes test {
   0%, 100% {
     opacity: 1; }
 
   50% {
     opacity: 0; } }
-
 .animation {
   -moz-animation: test;
   -webkit-animation: test;

data/test/fixtures/stylesheets/compass/css/animation.css

@@ -4,21 +4,18 @@
 
   50% {
     background-color: blue; } }
-
 @-webkit-keyframes test {
   0%, 100% {
     background-color: red; }
 
   50% {
     background-color: blue; } }
-
 @keyframes test {
   0%, 100% {
     background-color: red; }
 
   50% {
     background-color: blue; } }
-
 .animation {
   -moz-animation: test;
   -webkit-animation: test;

data/test/fixtures/stylesheets/compass/css/filters.css

@@ -1,29 +1,53 @@
 .blur {
-  /* Capability css-filters is prefixed with -webkit because omitting it would affect 42.57254% of users and the threshold is 0.1%. */
+  /* Capability css-filters is not prefixed with -moz because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-filters is not prefixed with -ms because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-filters is not prefixed with -o because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-filters is prefixed with -webkit because 42.57254% of users need it which is more than the threshold of 0.1%. */
+  /* Creating new -webkit context. */
   -webkit-filter: blur(5px);
   filter: blur(5px); }
 
 .brightness {
-  /* Capability css-filters is prefixed with -webkit because omitting it would affect 42.57254% of users and the threshold is 0.1%. */
+  /* Capability css-filters is not prefixed with -moz because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-filters is not prefixed with -ms because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-filters is not prefixed with -o because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-filters is prefixed with -webkit because 42.57254% of users need it which is more than the threshold of 0.1%. */
+  /* Creating new -webkit context. */
   -webkit-filter: brightness(0.2);
   filter: brightness(0.2); }
 
 .hue-rotate {
-  /* Capability css-filters is prefixed with -webkit because omitting it would affect 42.57254% of users and the threshold is 0.1%. */
+  /* Capability css-filters is not prefixed with -moz because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-filters is not prefixed with -ms because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-filters is not prefixed with -o because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-filters is prefixed with -webkit because 42.57254% of users need it which is more than the threshold of 0.1%. */
+  /* Creating new -webkit context. */
   -webkit-filter: hue-rotate(20deg);
   filter: hue-rotate(20deg); }
 
 .contrast {
-  /* Capability css-filters is prefixed with -webkit because omitting it would affect 42.57254% of users and the threshold is 0.1%. */
+  /* Capability css-filters is not prefixed with -moz because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-filters is not prefixed with -ms because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-filters is not prefixed with -o because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-filters is prefixed with -webkit because 42.57254% of users need it which is more than the threshold of 0.1%. */
+  /* Creating new -webkit context. */
   -webkit-filter: contrast(150%);
   filter: contrast(150%); }
 
 .grayscale {
-  /* Capability css-filters is prefixed with -webkit because omitting it would affect 42.57254% of users and the threshold is 0.1%. */
+  /* Capability css-filters is not prefixed with -moz because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-filters is not prefixed with -ms because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-filters is not prefixed with -o because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-filters is prefixed with -webkit because 42.57254% of users need it which is more than the threshold of 0.1%. */
+  /* Creating new -webkit context. */
   -webkit-filter: grayscale(150%);
   filter: grayscale(150%); }
 
 .sepia {
-  /* Capability css-filters is prefixed with -webkit because omitting it would affect 42.57254% of users and the threshold is 0.1%. */
+  /* Capability css-filters is not prefixed with -moz because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-filters is not prefixed with -ms because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-filters is not prefixed with -o because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-filters is prefixed with -webkit because 42.57254% of users need it which is more than the threshold of 0.1%. */
+  /* Creating new -webkit context. */
   -webkit-filter: sepia(150%);
   filter: sepia(150%); }

data/test/fixtures/stylesheets/compass/css/gradients.css

@@ -128,9 +128,14 @@
 
 .border-image-gradient {
   -moz-border-image: -moz-radial-gradient(#00ff00, #ff0000 100px) 100 stretch;
+  -moz-border-image: radial-gradient(#00ff00, #ff0000 100px) 100 stretch;
   -o-border-image: -o-radial-gradient(#00ff00, #ff0000 100px) 100 stretch;
+  -o-border-image: radial-gradient(#00ff00, #ff0000 100px) 100 stretch;
   -webkit-border-image: -webkit-radial-gradient(#00ff00, #ff0000 100px) 100 stretch;
+  -webkit-border-image: radial-gradient(#00ff00, #ff0000 100px) 100 stretch;
+  border-image: -moz-radial-gradient(#00ff00, #ff0000 100px) 100 stretch;
   border-image: -o-radial-gradient(#00ff00, #ff0000 100px) 100 stretch;
+  border-image: -webkit-radial-gradient(#00ff00, #ff0000 100px) 100 stretch;
   border-image: radial-gradient(#00ff00, #ff0000 100px) 100 stretch; }
 
 .direct-list-image-plain {
@@ -178,13 +183,13 @@
 .image-fallback {
   background-image: image(-moz-radial-gradient(#dddddd, #aaaaaa 100px), url('/images/4x6.png?busted=true'), #cc0000);
   background-image: image(-o-radial-gradient(#dddddd, #aaaaaa 100px), url('/images/4x6.png?busted=true'), #cc0000);
-  background-image: image(-webkit-radial-gradient(#dddddd, #aaaaaa 100px), url('/images/4x6.png?busted=true'), #cc0000);
+  background-image: -webkit-image(-webkit-radial-gradient(#dddddd, #aaaaaa 100px), url('/images/4x6.png?busted=true'), #cc0000);
   background-image: image(radial-gradient(#dddddd, #aaaaaa 100px), url('/images/4x6.png?busted=true'), #cc0000); }
 
 .cross-fade {
   background-image: cross-fade(-moz-radial-gradient(#dddddd, #aaaaaa 100px), url('/images/4x6.png?busted=true'));
   background-image: cross-fade(-o-radial-gradient(#dddddd, #aaaaaa 100px), url('/images/4x6.png?busted=true'));
-  background-image: cross-fade(-webkit-radial-gradient(#dddddd, #aaaaaa 100px), url('/images/4x6.png?busted=true'));
+  background-image: -webkit-cross-fade(-webkit-radial-gradient(#dddddd, #aaaaaa 100px), url('/images/4x6.png?busted=true'));
   background-image: cross-fade(radial-gradient(#dddddd, #aaaaaa 100px), url('/images/4x6.png?busted=true')); }
 
 .unknown-function-wrapper {

data/test/fixtures/stylesheets/compass/css/support.css

@@ -8,55 +8,62 @@
 /*  - [function] support-legacy-browser() from threshold (2 assertions, 2 passed, 0 failed) */
 /*  - [function] support-legacy-browser() from minimums (2 assertions, 2 passed, 0 failed) */
 /*  - [function] browser-out-of-scope() with no scope (2 assertions, 2 passed, 0 failed) */
+/*  - prefix context tracking (9 assertions, 9 passed, 0 failed) */
 /*  - [function] browser-out-of-scope() with a scope (2 assertions, 2 passed, 0 failed) */
 /*  - [function] browser-out-of-scope() with version (3 assertions, 3 passed, 0 failed) */
 /*  - [mixin] with-prefix() (4 assertions, 4 passed, 0 failed) */
 /*  - [mixin] with-each-prefix() (1 assertions, 1 passed, 0 failed) */
 /*  - [mixin] with-each-prefix() respects $supported-browsers (1 assertions, 1 passed, 0 failed) */
-/*  - [mixin] with-each-prefix() respects $current-prefix (2 assertions, 2 passed, 0 failed) */
+/*  - [mixin] with-each-prefix() respects $current-prefix (3 assertions, 3 passed, 0 failed) */
+/*  - [fuction] has-browser-subset() (5 assertions, 5 passed, 0 failed) */
 /*  
     Summary:
-    - 13 Tests
-    - 13 Passed
+    - 15 Tests
+    - 15 Passed
     - 0 Failed */
-/* Capability css-animation is prefixed with -moz because omitting it would affect 1.03559% of users and the threshold is 0.1%. */
+/* Capability css-animation is prefixed with -moz because 1.03559% of users need it which is more than the threshold of 0.1%. */
+/* Creating new -moz context. */
 @-moz-keyframes foo {
   0% {
     /* Content for ie 8 omitted.
-       Not allowed in the current scope: The ie 8 is incompatible with -moz. */
+       Not allowed in the current scope: ie 8 is incompatible with -moz. */
     opacity: 0; }
 
   100% {
     /* Content for ie 8 omitted.
-       Not allowed in the current scope: The ie 8 is incompatible with -moz. */
+       Not allowed in the current scope: ie 8 is incompatible with -moz. */
     opacity: 1; } }
-
-/* Capability css-animation is prefixed with -webkit because omitting it would affect 51.42143% of users and the threshold is 0.1%. */
+/* Capability css-animation is not prefixed with -ms because 0% of users are affected which is less than the threshold of 0.1. */
+/* Capability css-animation is not prefixed with -o because 0.04931% of users are affected which is less than the threshold of 0.1. */
+/* Capability css-animation is prefixed with -webkit because 51.42143% of users need it which is more than the threshold of 0.1%. */
+/* Creating new -webkit context. */
 @-webkit-keyframes foo {
   0% {
     /* Content for ie 8 omitted.
-       Not allowed in the current scope: The ie 8 is incompatible with -webkit. */
+       Not allowed in the current scope: ie 8 is incompatible with -webkit. */
     opacity: 0; }
 
   100% {
     /* Content for ie 8 omitted.
-       Not allowed in the current scope: The ie 8 is incompatible with -webkit. */
+       Not allowed in the current scope: ie 8 is incompatible with -webkit. */
     opacity: 1; } }
-
 @keyframes foo {
   0% {
     /* Content for ie 8 omitted.
-       Not allowed in the current scope: The current scope only works with ie 10 or greater. */
+       Not allowed in the current scope: The current scope only works with ie 10 - 11. */
     opacity: 0; }
 
   100% {
     /* Content for ie 8 omitted.
-       Not allowed in the current scope: The current scope only works with ie 10 or greater. */
+       Not allowed in the current scope: The current scope only works with ie 10 - 11. */
     opacity: 1; } }
-
 .foo {
-  /* Capability css-animation is prefixed with -moz because omitting it would affect 1.03559% of users and the threshold is 0.1%. */
+  /* Capability css-animation is prefixed with -moz because 1.03559% of users need it which is more than the threshold of 0.1%. */
+  /* Creating new -moz context. */
   -moz-animation: foo 1s;
-  /* Capability css-animation is prefixed with -webkit because omitting it would affect 51.42143% of users and the threshold is 0.1%. */
+  /* Capability css-animation is not prefixed with -ms because 0% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-animation is not prefixed with -o because 0.04931% of users are affected which is less than the threshold of 0.1. */
+  /* Capability css-animation is prefixed with -webkit because 51.42143% of users need it which is more than the threshold of 0.1%. */
+  /* Creating new -webkit context. */
   -webkit-animation: foo 1s;
   animation: foo 1s; }

data/test/fixtures/stylesheets/compass/sass/support.scss

@@ -44,17 +44,17 @@ $some-default-value: some default value;
   }
 
   @include test('[function] support-legacy-browser() from threshold') {
-    @include assert-true(support-legacy-browser('ie', '6', 0.00000001),
+    @include assert-true(support-legacy-browser('ie', '6', $threshold: 0.00000001),
                          "should be supported because of user support threshold.");
-    @include assert-false(support-legacy-browser('ie', '6', 10.000),
+    @include assert-false(support-legacy-browser('ie', '6', $threshold: 10.000),
                           "should not be supported because of support threshold.");
   }
 
   @include test('[function] support-legacy-browser() from minimums') {
     @include with-declared-minimums(('ie': '7')) {
-      @include assert-true(support-legacy-browser('ie', '7', 10.00),
+      @include assert-true(support-legacy-browser('ie', '7', $threshold: 10.00),
       "should be supported because of minimum version.");
-      @include assert-false(support-legacy-browser('ie', '6', 10.000),
+      @include assert-false(support-legacy-browser('ie', '6', $threshold: 10.000),
       "should not be supported because of minimum version.");
     }
   }
@@ -64,6 +64,30 @@ $some-default-value: some default value;
     @include assert-true(not browser-out-of-scope('chrome'), "should be in scope.");
   }
 
+  @include test('prefix context tracking') {
+    $outer-prefix-invoked: false;
+    $inner-prefix-invoked: false;
+    $mismatched-prefix-invoked: false;
+    @include with-prefix(-webkit) {
+      $outer-prefix-invoked: true;
+      @include assert-equal(-webkit, $current-prefix, "should be equal.");
+      @include assert-equal(-webkit, $prefix-context, "should be equal.");
+      @include with-prefix(null) {
+        $inner-prefix-invoked: true;
+        @include assert-equal(null, $current-prefix, "should be equal.");
+        @include assert-equal(-webkit, $prefix-context, "should be equal.");
+      }
+      @include with-prefix(-ms) {
+        $mismatched-prefix-invoked: true;
+      }
+    }
+    @include assert-true($inner-prefix-invoked, "should have been invoked");
+    @include assert-true($outer-prefix-invoked, "should have been invoked");
+    @include assert-false($mismatched-prefix-invoked, "should not have been invoked");
+    @include assert-equal(null, $prefix-context, "should be null");
+    @include assert-equal(null, $current-prefix, "should be null");
+  }
+
   @include test('[function] browser-out-of-scope() with a scope') {
     @include with-prefix(browser-prefix('chrome')) {
       @include assert-true(not browser-out-of-scope('chrome'), "should be in scope.");
@@ -72,7 +96,7 @@ $some-default-value: some default value;
   }
 
   @include test('[function] browser-out-of-scope() with version') {
-    @include with-browser-minimums((ie: '8')) {
+    @include with-browser-ranges((ie: '8' '8')) {
       @include assert-true(not browser-out-of-scope('ie', '10'), "should be in scope.");
       @include assert-true(not browser-out-of-scope('ie', '8'), "should be in scope.");
       @include assert-false(not browser-out-of-scope('ie', '7'), "should not be in scope.");
@@ -115,14 +139,27 @@ $some-default-value: some default value;
   }
 
   @include test('[mixin] with-each-prefix() respects $current-prefix') {
+    $contexts: ();
+    $prefixes: ();
     @include with-prefix(-webkit) {
-      $prefixes: ();
+      $prefixes: append($prefixes, $current-prefix);
+      $contexts: append($contexts, $prefix-context);
       @include with-each-prefix(css-regions, 0.0001) {
         $prefixes: append($prefixes, $current-prefix);
+        $contexts: append($contexts, $prefix-context);
       }
-      @include assert-equal(false, index($prefixes, null), "Not not have a null");
-      @include assert-equal("-webkit", #{$prefixes}, "Not equal");
     }
+    @include assert-true(index($prefixes, null), "Must have a null");
+    @include assert-equal((-webkit -webkit null), $prefixes, "Not equal");
+    @include assert-equal((-webkit -webkit -webkit), $contexts, "Not equal");
+  }
+
+  @include test('[fuction] has-browser-subset()') {
+    @include assert-true(has-browser-subset((firefox: "16" "25"), (firefox: "2" "25")), "Should detect version overlap");
+    @include assert-true(not has-browser-subset((firefox: "16" "25"), (firefox: "2" "15")), "Should not detect version overlap");
+    @include assert-true(not has-browser-subset((firefox: "2" "15"), (firefox: "16" "25")), "Should not detect version overlap");
+    @include assert-true(has-browser-subset((firefox: "16" "24"), (firefox: "2" "25")), "Should detect version overlap");
+    @include assert-true(has-browser-subset((firefox: "2" "25"), (firefox: "16" "24")), "Should detect version overlap");
   }
 }