csspool 4.0.0.pre → 4.0.0

data/test/css/test_import_rule.rb

@@ -32,9 +32,6 @@ module CSSPool
           new_doc = ir.load do |url|
             "div { background: red; }"
           end
-          new_doc.rule_sets.each do |rs|
-            assert_equal ir.media_list, rs.media.media_list
-          end
         end
       end
     end

data/test/css/test_media_rule.rb

@@ -0,0 +1,92 @@
+require 'helper'
+
+# CSS @media - http://www.w3.org/TR/css3-mediaqueries/
+module CSSPool
+  module CSS
+    class TestMediaRule < CSSPool::TestCase
+
+      def test_type
+        doc = CSSPool.CSS <<-eocss
+          @media print {
+            div { background: red, blue; }
+          }
+        eocss
+        assert_equal 1, doc.rule_sets.first.parent_rule.length
+      end
+
+      def test_expression
+        doc = CSSPool.CSS <<-eocss
+          @media (min-width:400px) {
+            div { background: red, blue; }
+          }
+        eocss
+        assert_equal 1, doc.rule_sets.first.parent_rule.length
+      end
+
+      def test_expression_no_space
+        doc = CSSPool.CSS <<-eocss
+          @media(min-width:400px) {
+            div { background: red, blue; }
+          }
+        eocss
+        assert_equal 1, doc.rule_sets.first.parent_rule.length
+      end
+
+      def test_complex
+        doc = CSSPool.CSS <<-eocss
+          @media screen and (color), projection and (color) { }
+        eocss
+        assert_equal 2, doc.rule_sets.first.parent_rule.length
+      end
+
+      def test_type_not
+        doc = CSSPool.CSS <<-eocss
+          @media not print {
+            div { background: red, blue; }
+          }
+        eocss
+        assert_equal 1, doc.rule_sets.first.parent_rule.length
+      end
+
+      def test_type_only
+        doc = CSSPool.CSS <<-eocss
+          @media only print {
+            div { background: red, blue; }
+          }
+        eocss
+        assert_equal 1, doc.rule_sets.first.parent_rule.length
+      end
+
+      def test_in_document_query
+        doc = CSSPool.CSS <<-eocss
+          @document domain(example.com) {
+          @media(max-height: 800px){.dashboard{position: absolute;}}
+          }
+        eocss
+        assert_equal 1, doc.rule_sets.first.parent_rule.length
+      end
+
+      def test_invalid_media_query_list
+        # needs to have space after 'and'
+        css = <<-eocss
+          @media all and(color) {
+            div { background: red, blue; }
+          }
+        eocss
+        assert_raises Racc::ParseError do
+          CSSPool::CSS(css)
+        end
+      end
+
+      # "and" is a reserved word in @media, but not elsewhere
+      def test_other_use_of_keywords
+        doc = CSSPool.CSS <<-eocss
+          /* and */
+          .and { display: flexbox; content: " and ";}
+          and { and: and; }
+        eocss
+      end
+
+    end
+  end
+end

data/test/css/test_node_position.rb

@@ -0,0 +1,81 @@
+require 'helper'
+
+module CSSPool
+  module CSS
+    class TestNodePosition < CSSPool::TestCase
+
+      def test_no_whitespace
+        child_content = '* { color: blue !important }'
+        css = "@document url(\"http://www.example.com\") {#{child_content}}"
+        doc = CSSPool.CSS css
+        assert_equal 1, doc.document_queries.size
+        dq = doc.document_queries.first
+        assert !dq.outer_start_pos.nil?
+        assert !dq.inner_start_pos.nil?
+        assert !dq.inner_end_pos.nil?
+        assert !dq.outer_end_pos.nil?
+        assert_equal css, css[dq.outer_start_pos..dq.outer_end_pos-1]
+        assert_equal child_content, css[dq.inner_start_pos..dq.inner_end_pos-1]
+      end
+
+      def test_whitespace
+        child_content = '  
+            * { color: blue !important } 
+        '
+        css = "
+          @document url(\"http://www.example.com\") {#{child_content}}
+        "
+        doc = CSSPool.CSS css
+        assert_equal 1, doc.document_queries.size
+        dq = doc.document_queries.first
+        assert !dq.outer_start_pos.nil?
+        assert !dq.inner_start_pos.nil?
+        assert !dq.inner_end_pos.nil?
+        assert !dq.outer_end_pos.nil?
+        # the whitespace on the "outside" should not be included
+        assert_equal css.strip, css[dq.outer_start_pos..dq.outer_end_pos-1]
+        # the whitespace on the "inside" should be retained
+        assert_equal child_content, css[dq.inner_start_pos..dq.inner_end_pos-1]
+      end
+
+      def test_comments
+        child_content = '  /* comment two */ 
+          * { color: blue !important } 
+          /* comment three */
+        '
+        css = "  /* comment one */
+          @document url(\"http://www.example.com\") {#{child_content}}
+        /* comment four */
+        "
+        doc = CSSPool.CSS css
+        assert_equal 1, doc.document_queries.size
+        dq = doc.document_queries.first
+        assert !dq.outer_start_pos.nil?
+        assert !dq.inner_start_pos.nil?
+        assert !dq.inner_end_pos.nil?
+        assert !dq.outer_end_pos.nil?
+        # the comments and whitespace to the "outside" should not be retained
+        assert_equal css.sub('/* comment one */', '').sub('/* comment four */', '').strip, css[dq.outer_start_pos..dq.outer_end_pos-1]
+        # the comments and whitespace on the "inside" should be retained
+        assert_equal child_content, css[dq.inner_start_pos..dq.inner_end_pos-1]
+      end
+
+      # this only works in ruby 2+
+      def test_multibyte_characters
+        child_content = '/* â */ * { color: blue !important }'
+        css = "@document url(\"http://www.example.com\") {#{child_content}}"
+        doc = CSSPool.CSS css
+        assert_equal 1, doc.document_queries.size
+        dq = doc.document_queries.first
+        assert !dq.outer_start_pos.nil?
+        assert !dq.inner_start_pos.nil?
+        assert !dq.inner_end_pos.nil?
+        assert !dq.outer_end_pos.nil?
+        assert_equal css, css[dq.outer_start_pos..dq.outer_end_pos-1]
+        assert_equal child_content, css[dq.inner_start_pos..dq.inner_end_pos-1]
+      end
+
+    end
+  end
+end
+

data/test/css/test_parser.rb

@@ -132,7 +132,7 @@ module CSSPool
         @parser.scan_str css
         property = @parser.handler.calls.find { |x|
           x.first == :property
-        }[1][1].first
+        }[1][0].expressions.first
 
         term.each do |k,v|
           assert_equal v, property.send(k)
@@ -159,7 +159,7 @@ module CSSPool
         @parser.scan_str 'div { background: red; padding: 0; }'
         names = @parser.handler.calls.find_all { |x|
           x.first == :property
-        }.map { |y| y[1].first }
+        }.map { |y| y[1].first.property }
         assert_equal %w{ background padding }, names
       end
 
@@ -176,7 +176,7 @@ module CSSPool
         declarations = @parser.handler.calls.find_all { |x|
           x.first == :property
         }
-        names = declarations.map { |y| y[1].first }
+        names = declarations.map { |y| y[1].first.property }
         assert_equal %w{color color *color _color}, names
         # values = declarations.map { |y| y[1][1].first.to_s }
         # assert_equal %w{black green\\9 blue red}, values
@@ -284,7 +284,7 @@ module CSSPool
       end
 
       def test_ruleset_div_pseudo_function_with_arg
-        assert_attribute 'div:foo.bar(bar) { }'
+        assert_attribute 'div:foo(bar) { }'
       end
 
       def test_ruleset_div_pseudo_function
@@ -363,15 +363,15 @@ module CSSPool
       def test_missing_semicolon
         @parser.scan_str 'div { border: none }'
         assert_equal 'div', doc.calls[1][1][0].join
-        assert_equal 'border', doc.calls[2][1][0]
-        assert_equal 'none', doc.calls[2][1][1].join
+        assert_equal 'border', doc.calls[2][1][0].property
+        assert_equal 'none', doc.calls[2][1][0].expressions.first.value
       end
 
       def test_whitespaces
         @parser.scan_str 'div { border : none }'
         assert_equal 'div', doc.calls[1][1][0].join
-        assert_equal 'border', doc.calls[2][1][0]
-        assert_equal 'none', doc.calls[2][1][1].join
+        assert_equal 'border', doc.calls[2][1][0].property
+        assert_equal 'none', doc.calls[2][1][0].expressions.first.value
       end
 
       def test_import_medium
@@ -389,33 +389,6 @@ module CSSPool
         assert_equal 'print', doc.calls[1][1].first[1].value
       end
 
-      def test_document_query_url
-        @parser.scan_str '@document url("http://example.com") { div {} }'
-        assert_equal :start_document_query, doc.calls[1].first
-        assert_equal 1, doc.calls[1][1][0].size
-        assert_equal CSSPool::Terms::URI, doc.calls[1][1][0][0].class
-      end
-
-      def test_document_query_function
-        @parser.scan_str '@document domain("example.com") { div {} }'
-        assert_equal :start_document_query, doc.calls[1].first
-        assert_equal 1, doc.calls[1][1][0].size
-        assert_equal CSSPool::Terms::Function, doc.calls[1][1][0][0].class
-      end
-
-      def test_document_query_function_no_quotes
-        @parser.scan_str '@document domain(example.com) { div {} }'
-        assert_equal :start_document_query, doc.calls[1].first
-        assert_equal 1, doc.calls[1][1][0].size
-        assert_equal CSSPool::Terms::Function, doc.calls[1][1][0][0].class
-      end
-
-      def test_document_query_multiple
-        @parser.scan_str '@document url("http://example.com"), domain("example.com") { div {} }'
-        assert_equal :start_document_query, doc.calls[1].first
-        assert_equal 2, doc.calls[1][1][0].size
-      end
-
       def test_start_stop
         @parser.scan_str "@import 'foo';"
         assert_equal [:start_document, []], @doc.calls.first
@@ -441,12 +414,12 @@ module CSSPool
         assert_equal :property, @parser.handler.calls[2].first
         assert_equal :end_selector, @parser.handler.calls[3].first
 
-        property = @parser.handler.calls[2][1]
-        assert_equal name, property.first
+        declaration = @parser.handler.calls[2][1].first
+        assert_equal name, declaration.property
 
-        assert_equal values, property[1].map { |x| x.value }
+        assert_equal values, declaration.expressions.map { |x| x.value }
         if ops
-          assert_equal ops, property[1].map { |x| x.operator }
+          assert_equal ops, declaration.expressions.map { |x| x.operator }
         end
       end
 

data/test/css/test_supports_rule.rb

@@ -0,0 +1,133 @@
+require 'helper'
+
+module CSSPool
+  module CSS
+    class TestSupportsRule < CSSPool::TestCase
+
+      def test_basic
+        doc = CSSPool.CSS <<-eocss
+          @supports ( display: flexbox ) {
+            body { display: flexbox; }
+          }
+        eocss
+        assert_equal 1, doc.supports_rules.size
+        assert_match '( display: flexbox )', doc.supports_rules[0].conditions
+        assert_equal 1, doc.supports_rules[0].rule_sets.size
+      end
+
+      def test_not
+        doc = CSSPool.CSS <<-eocss
+          @supports not ( display: flexbox ) {
+            body { display: flexbox; }
+          }
+        eocss
+        assert_equal 1, doc.supports_rules.size
+        assert_match 'not ( display: flexbox )', doc.supports_rules[0].conditions
+        assert_equal 1, doc.supports_rules[0].rule_sets.size
+      end
+
+      def test_or
+        doc = CSSPool.CSS <<-eocss
+          @supports ( display: flexbox ) or ( display: block ) {
+            body { display: flexbox; }
+          }
+        eocss
+        assert_equal 1, doc.supports_rules.size
+        assert_match '( display: flexbox ) or ( display: block )', doc.supports_rules[0].conditions
+        assert_equal 1, doc.supports_rules[0].rule_sets.size
+      end
+
+      def test_and
+        doc = CSSPool.CSS <<-eocss
+          @supports ( display: flexbox ) and ( display: block ) {
+            body { display: flexbox; }
+          }
+        eocss
+        assert_equal 1, doc.supports_rules.size
+        assert_match '( display: flexbox ) and ( display: block )', doc.supports_rules[0].conditions
+        assert_equal 1, doc.supports_rules[0].rule_sets.size
+      end
+
+      def test_complex
+        doc = CSSPool.CSS <<-eocss
+          @supports ((display: inline) or (( display: flexbox ) and ( display: block ))) {
+            body { display: flexbox; }
+          }
+        eocss
+        assert_equal 1, doc.supports_rules.size
+        assert_match '((display: inline) or (( display: flexbox ) and ( display: block ))', doc.supports_rules[0].conditions
+        assert_equal 1, doc.supports_rules[0].rule_sets.size
+      end
+
+      def test_double_parens
+        doc = CSSPool.CSS <<-eocss
+          @supports ((display: flexbox)) {
+            body { display: flexbox; }
+          }
+        eocss
+        assert_equal 1, doc.supports_rules.size
+        assert_match '((display: flexbox))', doc.supports_rules[0].conditions
+        assert_equal 1, doc.supports_rules[0].rule_sets.size
+      end
+
+      def test_important
+        doc = CSSPool.CSS <<-eocss
+          @supports ( display: flexbox !important) {
+            body { display: flexbox; }
+          }
+        eocss
+        assert_equal 1, doc.supports_rules.size
+        assert_match '( display: flexbox !important)', doc.supports_rules[0].conditions
+        assert_equal 1, doc.supports_rules[0].rule_sets.size
+      end
+
+      def test_other_use_of_keyword
+        doc = CSSPool.CSS <<-eocss
+          /* and */
+          .and { display: flexbox; content: " and ";}
+          and { and: and; }
+        eocss
+      end
+
+      def test_invalid_keyword_in_place_of_and_or
+        exception_happened = false
+        begin
+          doc = CSSPool.CSS <<-eocss
+            @supports ( display: flexbox ) xor ( display: block ) {
+              body { display: flexbox; }
+            }
+          eocss
+        rescue
+          exception_happened = true
+        end
+        assert exception_happened
+      end
+
+      def test_invalid_keyword_in_place_of_not
+        exception_happened = false
+        begin
+          doc = CSSPool.CSS <<-eocss
+            @supports isnt ( display: flexbox ) {
+              body { display: flexbox; }
+            }
+          eocss
+        rescue
+          exception_happened = true
+        end
+        assert exception_happened
+      end
+
+      def test_with_parens
+        doc = CSSPool.CSS <<-eocss
+          @supports ( filter: url(http://example.com) ) {
+            body { filter: url(http://example.com) }
+          }
+        eocss
+        assert_equal 1, doc.supports_rules.size
+        assert_match 'filter: url("http://example.com")', doc.supports_rules[0].conditions
+        assert_equal 1, doc.supports_rules[0].rule_sets.size
+      end
+
+    end
+  end
+end

data/test/css/test_tokenizer.rb

@@ -14,8 +14,8 @@ module CSSPool
       end
 
       {
-        'em'    => :EMS,
-        'ex'    => :EXS,
+        'em'    => :LENGTH,
+        'ex'    => :LENGTH,
         'px'    => :LENGTH,
         'cm'    => :LENGTH,
         'mm'    => :LENGTH,
@@ -206,7 +206,7 @@ module CSSPool
       def test_scan_pseudo
         @scanner.scan('a:visited')
         assert_tokens([ [:IDENT, 'a'],
-                        [':', ':'],
+                        [:COLON, ':'],
                         [:IDENT, 'visited']
         ], @scanner)
       end
@@ -256,7 +256,7 @@ module CSSPool
       def test_scan_function_selector
         @scanner.scan('x:eq(0)')
         assert_tokens([ [:IDENT, 'x'],
-                        [':', ':'],
+                        [:COLON, ':'],
                         [:FUNCTION, 'eq('],
                         [:NUMBER, "0"],
                         [:RPAREN, ')'],

data/test/css/test_variables.rb

@@ -0,0 +1,33 @@
+require 'helper'
+
+# CSS variables - http://dev.w3.org/csswg/css-variables/
+module CSSPool
+  module CSS
+    class TestVariables < CSSPool::TestCase
+
+      # just checking that there's no parse error
+      def test_basic
+        doc = CSSPool.CSS <<-eocss
+          :root {
+            --main-bg-color: brown;
+          }
+          .one {
+            background-color: var(--main-bg-color);
+          }
+        eocss
+      end
+
+      def test_var_in_calc
+        doc = CSSPool.CSS <<-eocss
+          :root {
+            --right-margin: 10px;
+          }
+          .one {
+            width: calc(100% + var(--right-margin));
+          }
+        eocss
+      end
+
+    end
+  end
+end

data/test/helper.rb

@@ -12,7 +12,7 @@ module CSSPool
     class MyDoc < CSSPool::CSS::DocumentHandler
       attr_accessor :start_documents, :end_documents
       attr_accessor :charsets, :import_styles, :document_queries, :comments, :start_selectors
-      attr_accessor :end_selectors, :properties
+      attr_accessor :end_selectors, :properties, :supports_rules
 
       def initialize
         @start_documents  = []
@@ -26,8 +26,8 @@ module CSSPool
         @properties       = []
       end
 
-      def property name, expression, important
-        @properties << [name, expression]
+      def property declaration
+        @properties << [declaration.property, declaration.expressions]
       end
 
       def start_document

data/test/sac/test_parser.rb

@@ -90,6 +90,7 @@ module CSSPool
         assert_nil simple_selector.additional_selectors.first.extra
       end
 
+      # div#a, a.foo, a::hover, a[href][int="10"]{ background: red; }
       def test_attribute_selector
         selectors_for_rule = @doc.start_selectors[1]
         selector = selectors_for_rule[3] # => a[href][int="10"]

data/test/test_parser.rb

@@ -29,15 +29,6 @@ module CSSPool
       assert_equal 'background', rule_set.declarations.first.property
     end
 
-    def test_media
-      doc = CSSPool.CSS <<-eocss
-        @media print {
-          div { background: red, blue; }
-        }
-      eocss
-      assert_equal 1, doc.rule_sets.first.media.media_list.length
-    end
-
     def test_universal_to_css
       doc = CSSPool.CSS <<-eocss
         * { background: red, blue; }
@@ -120,5 +111,27 @@ module CSSPool
       #assert_equal "http://\\\r\nexample.com/image.png", doc.rule_sets.first.declarations.first.expressions.first.value
     end
 
+    def test_error_message_context
+      begin
+        doc = CSSPool.CSS "syntax } error"
+        # should not reach this
+        assert false
+      rescue ParseError => ex
+        # ensure the context around the failing token (the bracket) are included
+        assert_match 'syntax } error', ex.message 
+      end
+    end
+
+    def test_error_message_line
+      begin
+        doc = CSSPool.CSS "\n\n\nsyntax } error"
+        # should not reach this
+        assert false
+      rescue ParseError => ex
+        # ensure the context around the failing token (the bracket) are included
+        assert_match 'line 4', ex.message 
+      end
+    end
+
   end
 end

data/test/test_selector.rb

@@ -4,14 +4,14 @@ module CSSPool
   class TestSelector < CSSPool::TestCase
     def test_specificity
       doc = CSSPool.CSS <<-eocss
-        *, foo > bar, #hover, :hover, div#a, a.foo, a:hover, a[href][int="10"], :before, ::before { background: red; }
+        *, foo > bar, #hover, :hover, div#a, a.foo, a:hover, a[href][int="10"], p::selection { background: red; }
       eocss
       selectors = doc.rule_sets.first.selectors
       specs = selectors.map do |sel|
         sel.specificity
       end
       assert_equal [
-       [0, 0, 1],
+       [0, 0, 0],
        [0, 0, 2],
        [1, 0, 0],
        [0, 1, 0],
@@ -19,8 +19,7 @@ module CSSPool
        [0, 1, 1],
        [0, 1, 1],
        [0, 2, 1],
-       [0, 0, 1],
-       [0, 0, 1]
+       [0, 0, 2]
       ], specs
     end
 
@@ -146,6 +145,47 @@ module CSSPool
       assert_equal 'even', rs.selectors.first.simple_selectors.first.additional_selectors.first.extra
     end
 
+    def test_mozilla_pseudo_element
+      doc = CSSPool.CSS <<-eocss
+        treechildren::-moz-tree-line { background: red; }
+      eocss
+      rs = doc.rule_sets.first
+      assert_equal '-moz-tree-line', rs.selectors.first.simple_selectors.first.additional_selectors.first.name
+    end
+
+    def test_mozilla_pseudo_element_brackets_without_parameters
+      doc = CSSPool.CSS <<-eocss
+        treechildren::-moz-tree-line() { background: red; }
+      eocss
+      rs = doc.rule_sets.first
+      assert_equal '-moz-tree-line', rs.selectors.first.simple_selectors.first.additional_selectors.first.name
+    end
+
+    def test_mozilla_pseudo_element_single_parameter
+      doc = CSSPool.CSS <<-eocss
+        treechildren::-moz-tree-line(one) { background: red; }
+      eocss
+      rs = doc.rule_sets.first
+      assert_equal '-moz-tree-line', rs.selectors.first.simple_selectors.first.additional_selectors.first.name
+    end
+
+    def test_mozilla_pseudo_element_multiple_parameters
+      doc = CSSPool.CSS <<-eocss
+        treechildren::-moz-tree-line(one, two, three) { background: red; }
+      eocss
+      rs = doc.rule_sets.first
+      assert_equal '-moz-tree-line', rs.selectors.first.simple_selectors.first.additional_selectors.first.name
+    end
+
+    # -moz-tree-cell and -moz-tree-cell-text are both mozilla pseudo-elements, make sure we don't stop at -moz-tree-cell
+    def test_mozilla_pseudo_element_name_within
+      doc = CSSPool.CSS <<-eocss
+        treechildren::-moz-tree-cell-text() { background: red; }
+      eocss
+      rs = doc.rule_sets.first
+      assert_equal '-moz-tree-cell-text', rs.selectors.first.simple_selectors.first.additional_selectors.first.name
+    end
+
     def test_element_with_namespace
       doc = CSSPool.CSS <<-eocss
         a|b { background: red; }

data/test/test_term.rb

@@ -19,5 +19,34 @@ module CSSPool
       assert_equal '100%/3 - 2*1em - 2*1px', rs.declarations.first.expressions.first.expression
     end
 
+    def test_math_with_params
+      doc = CSSPool.CSS <<-eocss
+        a { top: calc((1em + 16px) / 2) }
+      eocss
+      rs = doc.rule_sets.first
+      assert_equal '(1em + 16px)/2', rs.declarations.first.expressions.first.expression
+    end
+
+    def test_negative_multiplication
+      doc = CSSPool.CSS <<-eocss
+        a { top: calc(1.4 * -8px) }
+      eocss
+      rs = doc.rule_sets.first
+      assert_equal '1.4*-8px', rs.declarations.first.expressions.first.expression
+    end
+
+    def test_two_in_a_row
+      doc = CSSPool.CSS <<-eocss
+        a { background-size: calc(-2px + 100%) calc(-2px + 100%); }
+      eocss
+      rs = doc.rule_sets.first
+      assert_equal '-2px + 100%', rs.declarations.first.expressions.first.expression
+    end
+
+    def test_function_no_params
+      CSSPool.CSS <<-eocss
+        a { -webkit-filter: invert() }
+      eocss
+    end
   end
 end

data/test/visitors/test_comparable.rb

@@ -97,6 +97,14 @@ module CSSPool
         equalitest '@import "foo.css" screen, print;'
         equalitest '@import "foo.css";'
       end
+
+      def test_media_query_list_with_empty_body
+        equalitest "@media screen and (min-width:400px) and (max-width:600px) {}"
+      end
+
+      def test_media_query_list_with_body
+        equalitest "@media screen and (min-width:400px) and (max-width:600px) { div { color: inherit; } }"
+      end
     end
   end
 end