Convert all 3-digit hex codes to 6-digits

lib/css_parser/regexps.rb

@@ -238,7 +238,9 @@ def self.regex_possible_values *values
   ]
   RE_COLOUR_NUMERIC = /\b(hsl|rgb)\s*\(-?\s*-?\d+(\.\d+)?%?\s*%?,-?\s*-?\d+(\.\d+)?%?\s*%?,-?\s*-?\d+(\.\d+)?%?\s*%?\)/i
   RE_COLOUR_NUMERIC_ALPHA = /\b(hsla|rgba)\s*\(-?\s*-?\d+(\.\d+)?%?\s*%?,-?\s*-?\d+(\.\d+)?%?\s*%?,-?\s*-?\d+(\.\d+)?%?\s*%?,-?\s*-?\d+(\.\d+)?%?\s*%?\)/i
-  RE_COLOUR_HEX = /\s*#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})\b/
+  RE_COLOUR_HEX_3_DIGIT = /\s*#([0-9a-fA-F]{3})\b/
+  RE_COLOUR_HEX_6_DIGIT = /\s*#([0-9a-fA-F]{6})\b/
+  RE_COLOUR_HEX = Regexp.union(RE_COLOUR_HEX_3_DIGIT, RE_COLOUR_HEX_6_DIGIT)
   RE_COLOUR_NAMED = /\s*\b(#{NAMED_COLOURS.join('|')})\b/i
   RE_COLOUR = Regexp.union(RE_COLOUR_NUMERIC, RE_COLOUR_NUMERIC_ALPHA, RE_COLOUR_HEX, RE_COLOUR_NAMED)
   # :startdoc:

lib/css_parser/rule_set.rb

@@ -59,6 +59,7 @@ def add_declaration!(property, value)
       value.gsub!(/;\Z/, '')
       is_important = !value.gsub!(CssParser::IMPORTANT_IN_PROPERTY_RX, '').nil?
       property = property.downcase.strip
+      value = ensure_six_digit_hex_value(value)
       #puts "SAVING #{property}  #{value} #{is_important.inspect}"
       @declarations[property] = {
         :value => value, :is_important => is_important, :order => @order += 1
@@ -466,6 +467,16 @@ def create_list_style_shorthand! # :nodoc:
       create_shorthand_properties! LIST_STYLE_PROPERTIES, 'list-style'
     end
 
+    # For a 3-digit hex code (like '#abc'),
+    # return the 6-digit equivalent ('#aabbcc')
+    def ensure_six_digit_hex_value(value)
+    if value.match(RE_COLOUR_HEX_3_DIGIT)
+      return '#' + value.split('')[1..-1].map{|char| char + char}.join
+    end
+
+    return value
+  end
+
   private
 
     # utility method for re-assign shorthand elements to longhand versions

test/test_css_parser_basic.rb

@@ -22,6 +22,16 @@ def test_finding_by_selector
     assert_equal 'color: red;', @cp.find_by_selector('.content').join(' ')
   end
 
+  def test_3_and_6_digit_hex_codes
+    css = <<-CSS
+      .three-digit-hex { color: #123; }
+      .six-digit-hex { color: #112233; }
+    CSS
+    @cp.add_block!(css)
+    assert_equal 'color: #112233;', @cp.find_by_selector('.three-digit-hex').join(' ')
+    assert_equal 'color: #112233;', @cp.find_by_selector('.six-digit-hex').join(' ')
+  end
+
   def test_adding_block
     @cp.add_block!(@css)
     assert_equal 'margin: 0px;', @cp.find_by_selector('body').join

test/test_rule_set.rb

@@ -21,22 +21,22 @@ def test_setting_property_values
 
   def test_getting_property_values
     rs = RuleSet.new('#content p, a', 'color: #fff;')
-    assert_equal('#fff;', rs['color'])
+    assert_equal('#ffffff;', rs['color'])
   end
 
   def test_getting_property_value_ignoring_case
     rs = RuleSet.new('#content p, a', 'color: #fff;')
-    assert_equal('#fff;', rs['  ColoR '])
+    assert_equal('#ffffff;', rs['  ColoR '])
   end
 
   def test_each_selector
     expected = [
-      {:selector => "#content p", :declarations => "color: #fff;", :specificity => 101},
-      {:selector => "a", :declarations => "color: #fff;", :specificity => 1}
+      {:selector => "#content p", :declarations => "color: #ffffff;", :specificity => 101},
+      {:selector => "a", :declarations => "color: #ffffff;", :specificity => 1}
     ]
 
     actual = []
-    rs = RuleSet.new('#content p, a', 'color: #fff;')
+    rs = RuleSet.new('#content p, a', 'color: #ffffff;')
     rs.each_selector do |sel, decs, spec|
       actual << {:selector => sel, :declarations => decs, :specificity => spec}
     end
@@ -48,11 +48,11 @@ def test_each_declaration
     expected = Set.new([
       {:property => 'margin', :value => '1px -0.25em', :is_important => false},
       {:property => 'background', :value => 'white none no-repeat', :is_important => true},
-      {:property => 'color', :value => '#fff', :is_important => false}
+      {:property => 'color', :value => '#ffffff', :is_important => false}
     ])
 
     actual = Set.new
-    rs = RuleSet.new(nil, 'color: #fff; Background: white none no-repeat !important; margin: 1px -0.25em;')
+    rs = RuleSet.new(nil, 'color: #ffffff; Background: white none no-repeat !important; margin: 1px -0.25em;')
     rs.each_declaration do |prop, val, imp|
       actual << {:property => prop, :value => val, :is_important => imp}
     end
@@ -89,13 +89,13 @@ def test_multiple_selectors_to_s
   end
 
   def test_declarations_to_s
-    declarations = 'color: #fff; font-weight: bold;'
+    declarations = 'color: #ffffff; font-weight: bold;'
     rs = RuleSet.new('#content p, a', declarations)
     assert_equal(declarations.split(' ').sort, rs.declarations_to_s.split(' ').sort)
   end
 
   def test_important_declarations_to_s
-    declarations = 'color: #fff; font-weight: bold !important;'
+    declarations = 'color: #ffffff; font-weight: bold !important;'
     rs = RuleSet.new('#content p, a', declarations)
     assert_equal(declarations.split(' ').sort, rs.declarations_to_s.split(' ').sort)
   end
@@ -116,4 +116,20 @@ def test_not_raised_issue68
     end
     assert_equal true, ok
   end
+
+  def test_ensure_six_digit_hex_value
+    rs = RuleSet.new(nil, nil)
+    # Test a non-hex value
+    value = '12px'
+    assert_equal value, rs.ensure_six_digit_hex_value(value)
+    # Test a 2-digit hex (not valid)
+    value = '#ab'
+    assert_equal value, rs.ensure_six_digit_hex_value(value)
+    # Test a 3-digit hex
+    value = '#abc'
+    assert_equal '#aabbcc', rs.ensure_six_digit_hex_value(value)
+    # Test a 6-digit hex
+    value = '#abcdef'
+    assert_equal value, rs.ensure_six_digit_hex_value(value)
+  end
 end

test/test_rule_set_expanding_shorthand.rb

@@ -193,7 +193,7 @@ def test_getting_background_size_from_shorthand
   end
 
   def test_getting_background_colour_from_shorthand
-    ['blue', 'lime', 'rgb(10,10,10)', 'rgb (  -10%, 99, 300)', '#ffa0a0', '#03c', 'trAnsparEnt', 'inherit'].each do |colour|
+    ['blue', 'lime', 'rgb(10,10,10)', 'rgb (  -10%, 99, 300)', '#ffa0a0', '#0033cc', 'trAnsparEnt', 'inherit'].each do |colour|
       shorthand = "background:#{colour} url('chess.png') center repeat fixed ;"
       declarations = expand_declarations(shorthand)
       assert_equal(colour, declarations['background-color'])