inline-style 0.4.10 → 0.5.0

data/Gemfile.lock

@@ -1,8 +1,9 @@
 PATH
   remote: .
   specs:
-    inline-style (0.4.9)
+    inline-style (0.4.10)
       css_parser
+      facets
       maca-fork-csspool
       nokogiri
 
@@ -12,6 +13,7 @@ GEM
     activesupport (3.0.4)
     css_parser (1.1.5)
     diff-lcs (1.1.2)
+    facets (2.9.1)
     ffi (1.0.7)
       rake (>= 0.8.7)
     i18n (0.5.0)
@@ -42,8 +44,12 @@ PLATFORMS
   ruby
 
 DEPENDENCIES
+  css_parser
+  facets
   inline-style!
+  maca-fork-csspool
   mail
+  nokogiri
   rack
   rspec
   rspec-core

data/README.rdoc

@@ -24,8 +24,8 @@ Useful for html email: some clients (gmail, et all) won't render non inline styl
                       
     require 'inline-style'
 
-    html  = File.read("#{ dir }/index.html")
-    puts InlineStyle.process(html, :stylesheets_paths => "#{ dir }/styles")
+    html  = File.read("./index.html")
+    puts InlineStyle.process(html, :stylesheets_paths => "./styles")
         
 index.html contains:
     
@@ -115,20 +115,13 @@ If using ActionMailer (which wraps mail):
 
    ActionMailer::Base.register_interceptor \
      InlineStyle::Mail::Interceptor.new(:stylesheets_path => 'public')
-
     
-== Issues:
-
-* It supports pseudo classes according to W3C specification for style in style attribute: http://www.w3.org/TR/css-style-attr, although browsers
-doesn't seems to.
-
 
 == Requirements:
 
 nokogiri && (css_parser || maca-fork-csspool)
 
 
-
 == Install:
 
     sudo gem install inline-style

data/inline-style.gemspec

@@ -24,6 +24,7 @@ Gem::Specification.new do |s|
   s.add_development_dependency 'mail'
 
   s.add_dependency 'nokogiri'
+  s.add_dependency 'facets'
   s.add_dependency 'css_parser'
   s.add_dependency 'maca-fork-csspool'
 end

data/lib/inline-style.rb

@@ -3,9 +3,9 @@ require 'open-uri'
 
 $:.unshift(File.dirname(__FILE__)) unless $:.include?(File.dirname(__FILE__)) || $:.include?(File.expand_path(File.dirname(__FILE__)))
 
-require "inline-style/selector"
-require "inline-style/rack/middleware" # This two may be should be required by user if she needs it
-require "inline-style/mail/interceptor"
+require "inline-style/rule"
+require "inline-style/rack-middleware" # This two may be should be required by user if she needs it
+require "inline-style/mail-interceptor"
 
 class InlineStyle
   CSSParser =
@@ -20,82 +20,79 @@ class InlineStyle
   # @param [String, Nokogiri::HTML::Document] html Html or Nokogiri html to be inlined
   # @param [Hash] opts Processing options
   #
-  # @option opts [String] :stylesheets_path (env['DOCUMENT_ROOT']) 
+  # @option opts [String] :stylesheets_path (ENV['DOCUMENT_ROOT']) 
   #       Stylesheets root path or app's public directory where the stylesheets are to be found
-  # @option opts [boolean] :pseudo (false) 
-  #       If set to true will inline style for pseudo classes according to the W3C specification:
-  #       http://www.w3.org/TR/css-style-attr.
-  #       Should probably be left as false because browsers don't seem to comply with the specification for pseudo class style in the style attribute.
   def self.process html, opts = {}
     new(html, opts).process
   end
 
   def initialize html, opts = {}
-    @html             = html
-    @stylesheets_path = opts[:stylesheets_path] || ''
-    @pseudo           = opts[:pseudo]
+    @stylesheets_path = opts[:stylesheets_path] || ENV['DOCUMENT_ROOT'] || '.'
+    @html           = html
+    @dom = String === html ? Nokogiri.HTML(html) : html
   end
 
   def process
-    nodes = {}
-
-    css.each_rule_set do |rule_set|
-      rule_set.each_selector do |selector|
-        dom.css(selector.search).each do |node|
-          nodes[node] ||= []
-          nodes[node].push selector
-          
-          next unless node['style']
-          
-          path = node.css_path
-          path << "##{ node['id'] }" if node['id']
-          path << ".#{ node['class'].scan(/\S+/).join('.') }" if node['class']
-
-          CSSParser.new("#{path}{#{node['style']}}").each_rule_set do |rule|
-            rule.each_selector do |selector_inner|
-              nodes[node].push selector_inner
-            end
+    nodes_with_rules.each_pair do |node, rules|
+      rules = rules.sort_by{ |sel| "#{sel.specificity}%04d" % rules.index(sel) }
+
+      styles = []
+      rules.each do |rule|
+        next if rule.dynamic_pseudo_class
+        rule.declarations.each do |declaration| 
+          if defined = styles.assoc(declaration.first)
+            styles[styles.index(defined)] = declaration # overrides defined declaration
+          else
+            styles << declaration
           end
         end
       end
-    end
 
-    nodes.each_pair do |node, selectors|
-      selectors = selectors.sort_by{ |sel| "#{ sel.specificity }%03d" % selectors.index(sel) }
-      selectors = selectors.reject {|sel| !@pseudo && sel.pseudo? }
-      using_pseudo = selectors.any? &:pseudo?
-      
-      node['style'] = selectors.collect do |selector|
-        if using_pseudo && !selector.pseudo?
-          "{#{selector.inline_declarations}}"
-        else
-          selector.inline_declarations
-        end
-      end.join(' ').strip
+      style = styles.map{ |declaration| declaration.join(': ') }.join('; ') 
+      node['style'] = "#{style};" unless style.empty?
     end
-    
-    html_already_parsed? ? @dom : @dom.to_s
+    pre_parsed? ? @dom : @dom.to_s
   end
 
   private
-  def dom
-    @dom ||= html_already_parsed? ? @html : Nokogiri.HTML(@html)
+  def nodes_with_rules
+    nodes, body = {}, @dom.css('body')
+
+    parse_css.rules.each do |rule|
+      body.css(rule.selector).each do |node|
+        nodes[node] ||= []
+        nodes[node].push rule
+      end
+    end
+
+    body.css('[style]').each do |node| 
+      nodes[node] ||= []
+      nodes[node].push Rule.new ':inline', node['style'], '1000' # :inline is not really a pseudoclass
+    end
+
+    nodes
   end
 
-  def html_already_parsed?
-    @html.respond_to? :css
+  def pre_parsed?
+    @html == @dom
   end
 
   # Returns parsed CSS
-  def css
-    @css ||= CSSParser.new dom.css('style, link').collect { |e|
-      next unless e['media'].nil? || ['screen', 'all'].include?(e['media'])
-      next(e.remove and e.content) if e.name == 'style'
-      next unless e['rel'] == 'stylesheet'
-      e.remove
-      
-      uri = %r{^https?://} === e['href'] ? e['href'] : File.join(@stylesheets_path, e['href'].sub(/\?.+$/,'')) 
-      open(uri).read rescue nil
-    }.join("\n")
+  def extract_css
+    @dom.css('style, link[rel=stylesheet]').collect do |node|
+      next unless /^$|screen|all/ === node['media'].to_s
+      node.remove
+
+      if node.name == 'style'
+        node.content 
+      else
+        uri = %r{^https?://} === node['href'] ? node['href'] : File.join(@stylesheets_path, node['href'].sub(/\?.+$/,'')) 
+        open(uri).read
+      end
+    end.join("\n")
+  end
+
+  def parse_css
+    CSSParser.new extract_css 
   end
 end

data/lib/inline-style/css_parser_wrapper.rb

@@ -2,26 +2,13 @@ require 'css_parser'
 
 class InlineStyle
   class CssParserWrapper
-    def initialize(css_code)
-      @parser = ::CssParser::Parser.new
-      @parser.add_block! css_code
-    end
-
-    def each_rule_set(&blk)
-      @parser.each_rule_set do |rule_set|
-        yield Ruleset.new(rule_set)
-      end
-    end
-
-    class Ruleset
-      def initialize(ruleset)
-        @ruleset = ruleset
-      end
+    attr_accessor :rules
 
-      def each_selector
-        @ruleset.each_selector do |sel, dec, spe|
-          yield InlineStyle::Selector.new(sel, dec, spe)
-        end
+    def initialize(css_code)
+      parser, @rules = CssParser::Parser.new, []
+      parser.add_block! css_code
+      parser.each_rule_set do |rule_set| 
+        rule_set.each_selector { |sel, dec, spec| @rules << Rule.new(sel, dec, '%04d' % spec.to_i) } 
       end
     end
   end

data/lib/inline-style/csspool_wrapper.rb

@@ -1,29 +1,12 @@
 class InlineStyle
   class CSSPoolWrapper
+    attr_accessor :rules
 
-    def initialize(css_code)
-      @parser = CSSPool.CSS css_code
-    end
-
-    def each_rule_set
-      @parser.rule_sets.each do |rule_set|
-        yield Ruleset.new(rule_set)
-      end
-    end
-
-    class Ruleset
-
-      def initialize(ruleset)
-        @ruleset = ruleset
-      end
-
-      def each_selector(&blk)
-        @ruleset.selectors.each do |selector|
-          yield InlineStyle::Selector.new(selector.to_s,
-            selector.declarations.map{ |d| d.to_s.squeeze(' ') }.join.strip,
-            selector.specificity.inject(0) {|t, s| t+s})
-        end
-      end
+    def initialize css_code
+      parser = CSSPool.CSS css_code
+      @rules = parser.rule_sets.map do |rule_set| 
+        rule_set.selectors.map { |sel| Rule.new(sel.to_s, sel.declarations.join, "0#{sel.specificity.join}") }
+      end.flatten 
     end
   end
 end

data/lib/inline-style/{mail/interceptor.rb → mail-interceptor.rb}

@@ -9,6 +9,7 @@
 #
 #   ActionMailer::Base.register_interceptor \
 #     InlineStyle::Mail::Interceptor.new(:stylesheets_path => 'public')
+#
 module InlineStyle::Mail
   class Interceptor
     # The mime types we should inline. Basically HTML and XHTML.

data/lib/inline-style/rule.rb

@@ -0,0 +1,18 @@
+class InlineStyle
+  # A simple abstraction of the data we get back from the parsers. CSSPool
+  # actually already does this for us but CSSParser does not so we need
+  # to create the abstraction ourselves.
+  class Rule
+    DYNAMIC_PSEUDO_CLASSES = %w(link visited active hover focus target enabled disabled checked)
+    DYNAMIC_PSEUDO_CLASSES_MATCHER = /:(#{DYNAMIC_PSEUDO_CLASSES.join('|')})$/
+
+    attr_reader :selector, :declarations, :specificity, :dynamic_pseudo_class
+
+    def initialize selector, declarations, specificity
+      @specificity = specificity
+      @selector, @dynamic_pseudo_class = selector.split DYNAMIC_PSEUDO_CLASSES_MATCHER
+      @selector.sub! /$^/, '*'
+      @declarations = declarations.scan /\s*([^:]+):\s*([^;]+);/
+    end
+  end
+end

data/lib/inline-style/version.rb

@@ -1,3 +1,3 @@
 class InlineStyle
-  VERSION = '0.4.10'
+  VERSION = '0.5.0'
 end

data/spec/css_inlining_spec.rb

@@ -3,7 +3,7 @@ require "spec_helper"
 describe InlineStyle do
   shared_examples_for 'inlines styles' do
     before do
-      processed  = InlineStyle.process File.read("#{FIXTURES}/boletin.html"), :pseudo => false, :stylesheets_path => FIXTURES
+      processed  = InlineStyle.process File.read("#{FIXTURES}/boletin.html"), :stylesheets_path => FIXTURES
       @processed = Nokogiri.HTML(processed)
     end
 
@@ -16,7 +16,7 @@ describe InlineStyle do
     end
 
     it "should extract styles from linked stylesheet with media 'all'" do
-      @processed.css('#izq').first['style'].should match_style /padding: 10.0px;/
+      @processed.css('#izq').first['style'].should match_style /border: none;/
     end
 
     it "should ignore styles from linked stylesheet with media other than screen" do
@@ -27,11 +27,6 @@ describe InlineStyle do
       @processed.css('a').first['style'].should_not match_style /^:hover \{background-color: #8ae0ea; color: #126b5d;\}$/
     end
 
-    it "should should process pseudo classes" do
-      processed = InlineStyle.process Nokogiri.HTML(File.read("#{FIXTURES}/boletin.html")), :pseudo => true
-      processed.css('a').first['style'].should match_style /^:hover \{background-color: #8ae0ea; color: #126b5d;\}$/
-    end
-
     it 'should process location-based pseudo classes' do
       @processed.at_css('#izq')['style'].should match_style /padding: 1.0px;/
     end
@@ -40,9 +35,13 @@ describe InlineStyle do
       @processed.css('#logos #der').first['style'].should match_style /float: right;/
     end
 
-    # it 'should overwrite rule with less specificity'
-    # it 'should overwrite rule previously defined'
-    # it 'should not overwrite rules defined inline'
+    it 'should not override rules defined inline' do
+      @processed.css('#aviso').first['style'].should match_style /color: green;/
+    end
+
+    it 'should overwrite rule previously defined' do
+      @processed.css('#izq').first['style'].should_not match_style /padding: 0.0;/
+    end
 
     describe 'Box model' do
       before do

data/spec/css_parsing_spec.rb

@@ -0,0 +1,146 @@
+require "spec_helper"
+
+describe 'CSS parsing' do
+  shared_examples_for 'parses css' do
+    describe 'parsing tag selector' do
+      before do 
+        @wrapper = subject.new 'p {background-color: black; padding: 0.0 0.0 0.0 0.0}'
+      end
+
+      it { @wrapper.should have(1).rules }
+
+      describe 'rule' do
+        before { @rule = @wrapper.rules.first }
+        it { @rule.specificity.should == '0001' }
+        it { @rule.declarations.should == [['background-color', 'black'], ['padding', '0.0 0.0 0.0 0.0']] }
+        it { @rule.selector.should == 'p' }
+        it { @rule.dynamic_pseudo_class.should be_nil }
+      end
+    end
+
+    describe 'parsing body tag selector' do
+      before do 
+        @wrapper = subject.new 'body {background-color: black; padding: 0.0 0.0 0.0 0.0}'
+      end
+
+      it { @wrapper.should have(1).rules }
+
+      describe 'rule' do
+        before { @rule = @wrapper.rules.first }
+        it { @rule.specificity.should == '0001' }
+        it { @rule.declarations.should == [['background-color', 'black'], ['padding', '0.0 0.0 0.0 0.0']] }
+        it { @rule.selector.should == 'body' }
+        it { @rule.dynamic_pseudo_class.should be_nil }
+      end
+    end
+
+    describe 'parsing tag and class selector' do
+      before do 
+        @wrapper = subject.new 'div.article {background-color: black; padding: 0.0 0.0 0.0 0.0}'
+      end
+
+      it { @wrapper.should have(1).rules }
+
+      describe 'rule' do
+        before { @rule = @wrapper.rules.first }
+        it { @rule.specificity.should == '0011' }
+        it { @rule.declarations.should == [['background-color', 'black'], ['padding', '0.0 0.0 0.0 0.0']] }
+        it { @rule.selector.should == 'div.article' }
+        it { @rule.dynamic_pseudo_class.should be_nil }
+      end
+    end
+
+    describe 'parsing tag, class and id selector' do
+      before do 
+        @wrapper = subject.new 'div#headline.article {background-color: black; padding: 0.0 0.0 0.0 0.0}'
+      end
+
+      it { @wrapper.should have(1).rules }
+
+      describe 'rule' do
+        before { @rule = @wrapper.rules.first }
+        it { @rule.specificity.should == '0111' }
+        it { @rule.declarations.should == [['background-color', 'black'], ['padding', '0.0 0.0 0.0 0.0']] }
+        it { @rule.selector.should == 'div#headline.article' }
+        it { @rule.dynamic_pseudo_class.should be_nil }
+      end
+    end
+
+    describe 'parsing tag selector' do
+      before do 
+        @wrapper = subject.new 'p, div {background-color: black; padding: 0.0 0.0 0.0 0.0}'
+      end
+
+      it { @wrapper.should have(2).rules }
+
+      describe 'first rule' do
+        before { @rule = @wrapper.rules.first }
+        it { @rule.specificity.should == '0001' }
+        it { @rule.declarations.should == [['background-color', 'black'], ['padding', '0.0 0.0 0.0 0.0']] }
+        it { @rule.selector.should == 'p' }
+        it { @rule.dynamic_pseudo_class.should be_nil }
+      end
+
+      describe 'last rule' do
+        before { @rule = @wrapper.rules.last }
+        it { @rule.specificity.should == '0001' }
+        it { @rule.declarations.should == [['background-color', 'black'], ['padding', '0.0 0.0 0.0 0.0']] }
+        it { @rule.selector.should == 'div' }
+        it { @rule.dynamic_pseudo_class.should be_nil }
+      end
+    end
+
+    describe 'dynamic pseudo selectors' do
+      InlineStyle::Rule::DYNAMIC_PSEUDO_CLASSES.each do |pseudo_class|
+        describe "parsing tag with :#{pseudo_class}" do
+          before { @dynamic_pseudo_class = pseudo_class }
+          it_should_behave_like 'parses dynamic pseudo selector'
+        end
+      end
+    end
+  end
+
+  shared_examples_for 'parses dynamic pseudo selector' do
+    describe 'with tag' do
+      before do 
+        @wrapper = subject.new "p:#{@dynamic_pseudo_class} {background-color: black; padding: 0.0 0.0 0.0 0.0}"
+      end
+
+      it { @wrapper.should have(1).rules }
+
+      describe 'rule' do
+        before { @rule = @wrapper.rules.first }
+        # it { @rule.specificity.should == '011' }
+        it { @rule.declarations.should == [['background-color', 'black'], ['padding', '0.0 0.0 0.0 0.0']] }
+        it { @rule.selector.should == 'p' }
+        it { @rule.dynamic_pseudo_class.should == @dynamic_pseudo_class }
+      end
+    end
+
+    describe 'without tag' do
+      before do 
+        @wrapper = subject.new ":#{@dynamic_pseudo_class} {background-color: black; padding: 0.0 0.0 0.0 0.0}"
+      end
+
+      it { @wrapper.should have(1).rules }
+
+      describe 'rule' do
+        before { @rule = @wrapper.rules.first }
+        # it { @rule.specificity.should == '011' }
+        it { @rule.declarations.should == [['background-color', 'black'], ['padding', '0.0 0.0 0.0 0.0']] }
+        it { @rule.selector.should == '*' }
+        it { @rule.dynamic_pseudo_class.should == @dynamic_pseudo_class }
+      end
+    end
+  end
+
+  describe InlineStyle::CssParserWrapper do
+    subject { InlineStyle::CssParserWrapper }
+    it_should_behave_like 'parses css'
+  end
+
+  describe InlineStyle::CssParserWrapper do
+    subject { InlineStyle::CSSPoolWrapper }
+    it_should_behave_like 'parses css'
+  end
+end

data/spec/fixtures/all.css

@@ -1,3 +1,3 @@
 #izq {
-  padding: 10px;
-}
+  border: none;
+}

data/spec/fixtures/boletin.html

@@ -52,6 +52,7 @@ p {
 #aviso {
   padding: 25px 0;
   text-align: center;
+  color: blue;
 }
 
 dl.categoria dt {
@@ -143,7 +144,7 @@ div#contacto a {
   
 
 <div id="header">
-  <div id="aviso">Si usted no puede visualizar correctamente este boletín haga <a href="http://localhost:3000/boletines/noviembre-2009">click aquí</a></div>
+  <div id="aviso" style='color: green;'>Si usted no puede visualizar correctamente este boletín haga <a href="http://localhost:3000/boletines/noviembre-2009">click aquí</a></div>
   <div id="banner"><span id="cenart">CENART</span> Noviembre 2009</div>
 </div>
 

data/spec/fixtures/inline.html

@@ -6,97 +6,97 @@
 </title>
 <link href="/print.css?1248460539" rel="stylesheet" media="print" type="text/css">
 </head>
-<body style='font: 13.0px "Lucida Grande", Lucida, Verdana, sans-serif; width: 680.0px; color: #373737; margin-left: auto; margin-right: auto;'>
-  <div id="header" style="margin: 0.0; padding: 0.0;">
-  <div id="aviso" style="margin: 0.0; padding: 0.0; padding: 25.0px 0.0; text-align: center;">Si usted no puede visualizar correctamente este boletín haga <a href="http://localhost:3000/boletines/noviembre-2009" style="margin: 0.0; padding: 0.0; color: #185d6b;">click aquí</a>
+<body style='margin: 0; padding: 0; font: 13px "Lucida Grande", Lucida, Verdana, sans-serif; width: 680px; color: #373737; margin-left: auto; margin-right: auto;'>
+  <div id="header" style="margin: 0; padding: 0;">
+  <div id="aviso" style="margin: 0; padding: 25px 0; text-align: center; color: green;">Si usted no puede visualizar correctamente este boletín haga <a href="http://localhost:3000/boletines/noviembre-2009" style="margin: 0; padding: 0; color: #185d6b;">click aquí</a>
 </div>
-  <div id="banner" style="margin: 0.0; padding: 0.0; margin: 15.0px; text-align: right; color: #639b22;">
-<span id="cenart" style="margin: 0.0; padding: 0.0; font-size: 20.0px;">CENART</span> Noviembre 2009</div>
+  <div id="banner" style="margin: 15px; padding: 0; text-align: right; color: #639b22;">
+<span id="cenart" style="margin: 0; padding: 0; font-size: 20px;">CENART</span> Noviembre 2009</div>
 </div>
 
 
   
 
   
-  <dl class="categoria" id="A" style="margin: 0.0; padding: 0.0;">
-<dt style="margin: 0.0; padding: 0.0; font-size: 20.0px; padding: 10.0px; background-color: #416517; border-bottom: 1.0px dashed #a6a6a6; color: #a0bf57;">A</dt>
-    <dd style="margin: 0.0; padding: 0.0;">
+  <dl class="categoria" id="A" style="margin: 0; padding: 0;">
+<dt style="margin: 0; padding: 10px; font-size: 20px; background-color: #416517; border-bottom: 1px dashed #a6a6a6; color: #a0bf57;">A</dt>
+    <dd style="margin: 0; padding: 0;">
       
         
-        <dl class="evento non" style="margin: 0.0; padding: 0.0; padding: 30.0px 25.0px 20.0px 35.0px; border-bottom: 1.0px dashed #a6a6a6; background-color: #d9e3cf;">
-<dt style="margin: 0.0; padding: 0.0; font-size: 20.0px; padding: 10.0px; background-color: #416517; border-bottom: 1.0px dashed #a6a6a6; color: #a0bf57; padding: 0.0; font-size: 20.0px; background: none; font-weight: bold; border: none;"><a href="" style="margin: 0.0; padding: 0.0; color: #185d6b;">1</a></dt>
+        <dl class="evento non" style="margin: 0; padding: 30px 25px 20px 35px; border-bottom: 1px dashed #a6a6a6; background-color: #d9e3cf;">
+<dt style="margin: 0; padding: 0; font-size: 20px; background-color: #416517; border-bottom: 1px dashed #a6a6a6; color: #a0bf57; background: none; font-weight: bold; border: none;"><a href="" style="margin: 0; padding: 0; color: #185d6b;">1</a></dt>
           
-          <dd class="descripcion" style="margin: 0.0; padding: 0.0; text-align: justify; margin: 10.0px 0.0;">
-<p style="margin: 0.0; padding: 0.0; margin: 10.0px 0.0;">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+          <dd class="descripcion" style="margin: 10px 0; padding: 0; text-align: justify;">
+<p style="margin: 10px 0; padding: 0;">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
 </dd>
-          <dd class="fechas" style="margin: 0.0; padding: 0.0; text-align: justify; margin: 10.0px 0.0;">
-<b style="margin: 0.0; padding: 0.0; color: #185d6b;">Fechas: </b>Fecha</dd>
-          <dd class="locacion" style="margin: 0.0; padding: 0.0; text-align: justify; margin: 10.0px 0.0;">
-<b style="margin: 0.0; padding: 0.0; color: #185d6b;">Lugar: </b>Lugar</dd>
-          <dd class="precio" style="margin: 0.0; padding: 0.0; text-align: justify; margin: 10.0px 0.0;">
-<b style="margin: 0.0; padding: 0.0; color: #185d6b;">Público: </b>Público</dd>
-          <dd class="precio" style="margin: 0.0; padding: 0.0; text-align: justify; margin: 10.0px 0.0;">
-<b style="margin: 0.0; padding: 0.0; color: #185d6b;">Precio: </b>Precio</dd>
+          <dd class="fechas" style="margin: 10px 0; padding: 0; text-align: justify;">
+<b style="margin: 0; padding: 0; color: #185d6b;">Fechas: </b>Fecha</dd>
+          <dd class="locacion" style="margin: 10px 0; padding: 0; text-align: justify;">
+<b style="margin: 0; padding: 0; color: #185d6b;">Lugar: </b>Lugar</dd>
+          <dd class="precio" style="margin: 10px 0; padding: 0; text-align: justify;">
+<b style="margin: 0; padding: 0; color: #185d6b;">Público: </b>Público</dd>
+          <dd class="precio" style="margin: 10px 0; padding: 0; text-align: justify;">
+<b style="margin: 0; padding: 0; color: #185d6b;">Precio: </b>Precio</dd>
         </dl>
 </dd>
   </dl>
-<dl class="categoria" id="B" style="margin: 0.0; padding: 0.0;">
-<dt style="margin: 0.0; padding: 0.0; font-size: 20.0px; padding: 10.0px; background-color: #416517; border-bottom: 1.0px dashed #a6a6a6; color: #a0bf57;">B</dt>
-    <dd style="margin: 0.0; padding: 0.0;">
+<dl class="categoria" id="B" style="margin: 0; padding: 0;">
+<dt style="margin: 0; padding: 10px; font-size: 20px; background-color: #416517; border-bottom: 1px dashed #a6a6a6; color: #a0bf57;">B</dt>
+    <dd style="margin: 0; padding: 0;">
       
         
-        <dl class="evento par" style="margin: 0.0; padding: 0.0; padding: 30.0px 25.0px 20.0px 35.0px; border-bottom: 1.0px dashed #a6a6a6; background-color: #cfdfe3;">
-<dt style="margin: 0.0; padding: 0.0; font-size: 20.0px; padding: 10.0px; background-color: #416517; border-bottom: 1.0px dashed #a6a6a6; color: #a0bf57; padding: 0.0; font-size: 20.0px; background: none; font-weight: bold; border: none;"><a href="" style="margin: 0.0; padding: 0.0; color: #185d6b;">1</a></dt>
+        <dl class="evento par" style="margin: 0; padding: 30px 25px 20px 35px; border-bottom: 1px dashed #a6a6a6; background-color: #cfdfe3;">
+<dt style="margin: 0; padding: 0; font-size: 20px; background-color: #416517; border-bottom: 1px dashed #a6a6a6; color: #a0bf57; background: none; font-weight: bold; border: none;"><a href="" style="margin: 0; padding: 0; color: #185d6b;">1</a></dt>
           
-          <dd class="descripcion" style="margin: 0.0; padding: 0.0; text-align: justify; margin: 10.0px 0.0;">
-<p style="margin: 0.0; padding: 0.0; margin: 10.0px 0.0;">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+          <dd class="descripcion" style="margin: 10px 0; padding: 0; text-align: justify;">
+<p style="margin: 10px 0; padding: 0;">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
 </dd>
-          <dd class="fechas" style="margin: 0.0; padding: 0.0; text-align: justify; margin: 10.0px 0.0;">
-<b style="margin: 0.0; padding: 0.0; color: #185d6b;">Fechas: </b>Fecha</dd>
-          <dd class="locacion" style="margin: 0.0; padding: 0.0; text-align: justify; margin: 10.0px 0.0;">
-<b style="margin: 0.0; padding: 0.0; color: #185d6b;">Lugar: </b>Lugar</dd>
-          <dd class="precio" style="margin: 0.0; padding: 0.0; text-align: justify; margin: 10.0px 0.0;">
-<b style="margin: 0.0; padding: 0.0; color: #185d6b;">Público: </b>Público</dd>
-          <dd class="precio" style="margin: 0.0; padding: 0.0; text-align: justify; margin: 10.0px 0.0;">
-<b style="margin: 0.0; padding: 0.0; color: #185d6b;">Precio: </b>Precio</dd>
+          <dd class="fechas" style="margin: 10px 0; padding: 0; text-align: justify;">
+<b style="margin: 0; padding: 0; color: #185d6b;">Fechas: </b>Fecha</dd>
+          <dd class="locacion" style="margin: 10px 0; padding: 0; text-align: justify;">
+<b style="margin: 0; padding: 0; color: #185d6b;">Lugar: </b>Lugar</dd>
+          <dd class="precio" style="margin: 10px 0; padding: 0; text-align: justify;">
+<b style="margin: 0; padding: 0; color: #185d6b;">Público: </b>Público</dd>
+          <dd class="precio" style="margin: 10px 0; padding: 0; text-align: justify;">
+<b style="margin: 0; padding: 0; color: #185d6b;">Precio: </b>Precio</dd>
         </dl>
 </dd>
   </dl>
-<dl class="categoria" id="C" style="margin: 0.0; padding: 0.0;">
-<dt style="margin: 0.0; padding: 0.0; font-size: 20.0px; padding: 10.0px; background-color: #416517; border-bottom: 1.0px dashed #a6a6a6; color: #a0bf57;">C</dt>
-    <dd style="margin: 0.0; padding: 0.0;">
+<dl class="categoria" id="C" style="margin: 0; padding: 0;">
+<dt style="margin: 0; padding: 10px; font-size: 20px; background-color: #416517; border-bottom: 1px dashed #a6a6a6; color: #a0bf57;">C</dt>
+    <dd style="margin: 0; padding: 0;">
       
         
-        <dl class="evento non" style="margin: 0.0; padding: 0.0; padding: 30.0px 25.0px 20.0px 35.0px; border-bottom: 1.0px dashed #a6a6a6; background-color: #d9e3cf;">
-<dt style="margin: 0.0; padding: 0.0; font-size: 20.0px; padding: 10.0px; background-color: #416517; border-bottom: 1.0px dashed #a6a6a6; color: #a0bf57; padding: 0.0; font-size: 20.0px; background: none; font-weight: bold; border: none;"><a href="" style="margin: 0.0; padding: 0.0; color: #185d6b;">1</a></dt>
+        <dl class="evento non" style="margin: 0; padding: 30px 25px 20px 35px; border-bottom: 1px dashed #a6a6a6; background-color: #d9e3cf;">
+<dt style="margin: 0; padding: 0; font-size: 20px; background-color: #416517; border-bottom: 1px dashed #a6a6a6; color: #a0bf57; background: none; font-weight: bold; border: none;"><a href="" style="margin: 0; padding: 0; color: #185d6b;">1</a></dt>
           
-          <dd class="descripcion" style="margin: 0.0; padding: 0.0; text-align: justify; margin: 10.0px 0.0;">
-<p style="margin: 0.0; padding: 0.0; margin: 10.0px 0.0;">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+          <dd class="descripcion" style="margin: 10px 0; padding: 0; text-align: justify;">
+<p style="margin: 10px 0; padding: 0;">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
 </dd>
-          <dd class="fechas" style="margin: 0.0; padding: 0.0; text-align: justify; margin: 10.0px 0.0;">
-<b style="margin: 0.0; padding: 0.0; color: #185d6b;">Fechas: </b>Fecha</dd>
-          <dd class="locacion" style="margin: 0.0; padding: 0.0; text-align: justify; margin: 10.0px 0.0;">
-<b style="margin: 0.0; padding: 0.0; color: #185d6b;">Lugar: </b>Lugar</dd>
-          <dd class="precio" style="margin: 0.0; padding: 0.0; text-align: justify; margin: 10.0px 0.0;">
-<b style="margin: 0.0; padding: 0.0; color: #185d6b;">Público: </b>Público</dd>
-          <dd class="precio" style="margin: 0.0; padding: 0.0; text-align: justify; margin: 10.0px 0.0;">
-<b style="margin: 0.0; padding: 0.0; color: #185d6b;">Precio: </b>Precio</dd>
+          <dd class="fechas" style="margin: 10px 0; padding: 0; text-align: justify;">
+<b style="margin: 0; padding: 0; color: #185d6b;">Fechas: </b>Fecha</dd>
+          <dd class="locacion" style="margin: 10px 0; padding: 0; text-align: justify;">
+<b style="margin: 0; padding: 0; color: #185d6b;">Lugar: </b>Lugar</dd>
+          <dd class="precio" style="margin: 10px 0; padding: 0; text-align: justify;">
+<b style="margin: 0; padding: 0; color: #185d6b;">Público: </b>Público</dd>
+          <dd class="precio" style="margin: 10px 0; padding: 0; text-align: justify;">
+<b style="margin: 0; padding: 0; color: #185d6b;">Precio: </b>Precio</dd>
         </dl>
 </dd>
   </dl>
-<div id="footer" style="margin: 0.0; padding: 0.0;">
-  <div id="direccion" style="margin: 0.0; padding: 0.0; padding: 30.0px 25.0px 20.0px 35.0px;">
-    <b style="margin: 0.0; padding: 0.0; color: #185d6b; color: #5f792d;">lorem</b><br style="margin: 0.0; padding: 0.0;">
-    ipsum<br style="margin: 0.0; padding: 0.0;">
-    dolor<br style="margin: 0.0; padding: 0.0;">
-    sit<br style="margin: 0.0; padding: 0.0;">
+<div id="footer" style="margin: 0; padding: 0;">
+  <div id="direccion" style="margin: 0; padding: 30px 25px 20px 35px;">
+    <b style="margin: 0; padding: 0; color: #5f792d;">lorem</b><br style="margin: 0; padding: 0;">
+    ipsum<br style="margin: 0; padding: 0;">
+    dolor<br style="margin: 0; padding: 0;">
+    sit<br style="margin: 0; padding: 0;">
 </div>
 
-  <div id="contacto" style="margin: 0.0; padding: 0.0; padding: 30.0px 25.0px 20.0px 35.0px;">
-    contacto <br style="margin: 0.0; padding: 0.0;"><a href="mailto:mail@host.org" style="margin: 0.0; padding: 0.0; color: #185d6b; font-weight: bold; font-size: 1.2em;">mail@host.org</a>
+  <div id="contacto" style="margin: 0; padding: 30px 25px 20px 35px;">
+    contacto <br style="margin: 0; padding: 0;"><a href="mailto:mail@host.org" style="margin: 0; padding: 0; color: #185d6b; font-weight: bold; font-size: 1.2em;">mail@host.org</a>
   </div>
-  <div id="logos" style="margin: 0.0; padding: 0.0; width: 100.0%; margin-top: 40.0px; background-image: url(/images/boletines/Noviembre/logos_fondo.jpg);">
-    <img src="A" id="izq" alt="A" style="margin: 0.0; padding: 0.0; float: left; margin: 30.0px; padding: 10.0px; color: red; padding: 1.0px;"><img src="B" id="der" alt="B" style="margin: 0.0; padding: 0.0; float: right;"><div class="clearer" style="margin: 0.0; padding: 0.0; clear: both;">
+  <div id="logos" style="margin: 0; padding: 0; width: 100%; margin-top: 40px; background-image: url('/images/boletines/Noviembre/logos_fondo.jpg');">
+    <img src="A" id="izq" alt="A" style="margin: 30px; padding: 1px; float: left; border: none; color: red;"><img src="B" id="der" alt="B" style="margin: 0; padding: 0; float: right;"><div class="clearer" style="margin: 0; padding: 0; clear: both;">
   </div>
 </div>
 

data/spec/interceptor_spec.rb

@@ -1,27 +1,16 @@
-require "spec_helper"
-require "inline-style/mail/interceptor"
-require "mail"
+require "#{ File.dirname __FILE__ }/spec_helper"
 
+require 'mail'
 Mail.defaults do
   delivery_method :test
 end
-
-Mail.register_interceptor InlineStyle::Mail::Interceptor.new(:stylesheets_path => FIXTURES)
+Mail.register_interceptor \
+  InlineStyle::Mail::Interceptor.new(:stylesheets_path => FIXTURES)
 
 describe InlineStyle::Mail::Interceptor do
+
   before do
     Mail::TestMailer.deliveries.clear
-    class InlineStyle
-      remove_const :CSSParser
-      CSSParser = InlineStyle::CSSPoolWrapper 
-    end
-  end
-
-  after do
-    class InlineStyle
-      remove_const :CSSParser
-      CSSParser = InlineStyle::CssParserWrapper 
-    end
   end
 
   it 'should inline html e-mail' do
@@ -70,4 +59,6 @@ describe InlineStyle::Mail::Interceptor do
     Mail::TestMailer.deliveries.first.parts[1].body.to_s.
     should == File.read("#{ FIXTURES }/inline.html")
   end
+
 end
+

data/spec/rack_middleware_spec.rb

@@ -1,5 +1,5 @@
 require "spec_helper"
-require "inline-style/rack/middleware"
+require "inline-style/rack-middleware"
 
 describe InlineStyle::Rack::Middleware do
   def get_response path, body, opts = {}

data/spec/spec_helper.rb

@@ -5,6 +5,8 @@ require 'rack/mock'
 
 require "inline-style"
 require "inline-style/csspool_wrapper"
+
+gem 'maca-fork-csspool'
 require "csspool"
 
 FIXTURES = "#{File.dirname __FILE__}/fixtures"
@@ -40,11 +42,11 @@ module InlineStyleMatchers
     end
 
     def failure_message
-      "expected #{@style} to match #{@actual}"
+      "expected #{@actual} to match #{@style}"
     end
 
     def negative_failure_message
-      "expected #{@style} not to match #{@actual}"
+      "expected #{@actual} not to match #{@style}"
     end
   end
 

metadata

@@ -1,13 +1,12 @@
 --- !ruby/object:Gem::Specification 
 name: inline-style
 version: !ruby/object:Gem::Version 
-  hash: 27
-  prerelease: 
+  prerelease: false
   segments: 
   - 0
-  - 4
-  - 10
-  version: 0.4.10
+  - 5
+  - 0
+  version: 0.5.0
 platform: ruby
 authors: 
 - Macario Ortega
@@ -16,7 +15,7 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2011-03-23 00:00:00 -06:00
+date: 2011-03-24 00:00:00 -06:00
 default_executable: 
 dependencies: 
 - !ruby/object:Gem::Dependency 
@@ -27,7 +26,6 @@ dependencies:
     requirements: 
     - - ">="
       - !ruby/object:Gem::Version 
-        hash: 3
         segments: 
         - 0
         version: "0"
@@ -41,7 +39,6 @@ dependencies:
     requirements: 
     - - ">="
       - !ruby/object:Gem::Version 
-        hash: 3
         segments: 
         - 0
         version: "0"
@@ -55,7 +52,6 @@ dependencies:
     requirements: 
     - - ">="
       - !ruby/object:Gem::Version 
-        hash: 3
         segments: 
         - 0
         version: "0"
@@ -69,7 +65,6 @@ dependencies:
     requirements: 
     - - ">="
       - !ruby/object:Gem::Version 
-        hash: 3
         segments: 
         - 0
         version: "0"
@@ -83,40 +78,50 @@ dependencies:
     requirements: 
     - - ">="
       - !ruby/object:Gem::Version 
-        hash: 3
         segments: 
         - 0
         version: "0"
   type: :runtime
   version_requirements: *id005
 - !ruby/object:Gem::Dependency 
-  name: css_parser
+  name: facets
   prerelease: false
   requirement: &id006 !ruby/object:Gem::Requirement 
     none: false
     requirements: 
     - - ">="
       - !ruby/object:Gem::Version 
-        hash: 3
         segments: 
         - 0
         version: "0"
   type: :runtime
   version_requirements: *id006
 - !ruby/object:Gem::Dependency 
-  name: maca-fork-csspool
+  name: css_parser
   prerelease: false
   requirement: &id007 !ruby/object:Gem::Requirement 
     none: false
     requirements: 
     - - ">="
       - !ruby/object:Gem::Version 
-        hash: 3
         segments: 
         - 0
         version: "0"
   type: :runtime
   version_requirements: *id007
+- !ruby/object:Gem::Dependency 
+  name: maca-fork-csspool
+  prerelease: false
+  requirement: &id008 !ruby/object:Gem::Requirement 
+    none: false
+    requirements: 
+    - - ">="
+      - !ruby/object:Gem::Version 
+        segments: 
+        - 0
+        version: "0"
+  type: :runtime
+  version_requirements: *id008
 description: Inlines CSS for html email delivery
 email: 
 - macarui@gmail.com
@@ -140,12 +145,12 @@ files:
 - lib/inline-style.rb
 - lib/inline-style/css_parser_wrapper.rb
 - lib/inline-style/csspool_wrapper.rb
-- lib/inline-style/mail/interceptor.rb
-- lib/inline-style/rack/middleware.rb
-- lib/inline-style/selector.rb
+- lib/inline-style/mail-interceptor.rb
+- lib/inline-style/rack-middleware.rb
+- lib/inline-style/rule.rb
 - lib/inline-style/version.rb
 - spec/css_inlining_spec.rb
-- spec/css_parsers_spec.rb
+- spec/css_parsing_spec.rb
 - spec/fixtures/all.css
 - spec/fixtures/boletin.html
 - spec/fixtures/box-model.html
@@ -171,7 +176,6 @@ required_ruby_version: !ruby/object:Gem::Requirement
   requirements: 
   - - ">="
     - !ruby/object:Gem::Version 
-      hash: 3
       segments: 
       - 0
       version: "0"
@@ -180,14 +184,13 @@ required_rubygems_version: !ruby/object:Gem::Requirement
   requirements: 
   - - ">="
     - !ruby/object:Gem::Version 
-      hash: 3
       segments: 
       - 0
       version: "0"
 requirements: []
 
 rubyforge_project: 
-rubygems_version: 1.6.2
+rubygems_version: 1.3.7
 signing_key: 
 specification_version: 3
 summary: Inlines CSS for html email delivery

data/lib/inline-style/selector.rb

@@ -1,41 +0,0 @@
-
-
-# A simple abstraction of the data we get back from the parsers. CSSPool
-# actually already does this for us but CSSParser does not so we need
-# to create the abstraction ourselves.
-class InlineStyle
-  class Selector < Struct.new :selector_text, :declarations, :specificity
-    # A slightly adjusted version of the selector_text that should be
-    # used for finding nodes. Will remove the pseudo selector and prepend
-    # 'body '.
-    def search
-      selector_text.dup.tap do |s|
-        state_based_pseudo_selectors.each {|p| s.gsub! /:#{p}$/, ''}
-          s.insert(0, 'body ') unless s =~ /^body/
-      end
-    end
-
-    # For the most part is just declarations unless a pseudo selector.
-    # Then it uses the inline pseudo declarations 
-    def inline_declarations
-      if pseudo?
-        "\n#{ selector_text.gsub /\w(?=:)/, '' } {#{ declarations }}"
-      else
-        declarations
-      end
-    end
-
-    # Is this selector using a pseudo class?
-    def pseudo?
-      state_based_pseudo_selectors.any? {|p| selector_text.end_with? ":#{p}"} 
-    end
-
-    # A list of state based pseudo selectors (like hover) that should
-    # be handled based on the pseudo option. Unlike position-based
-    # pseudo selectors (like :first-child) which once resolved to the
-    # correct node effectively get inlined like a normal selector.
-    def state_based_pseudo_selectors
-      %w(link visited active hover focus target enabled disabled checked)
-    end
-  end
-end

data/spec/css_parsers_spec.rb

@@ -1,53 +0,0 @@
-require "spec_helper"
-
-describe InlineStyle::CssParserWrapper do
-
-  it 'should wrap css_parser' do
-    rs_count = 0
-    sel_count = 0
-    selectors = %w(p b i)
-    decs = ['color: black;', 'color: black;', 'color: green; text-decoration: none;']
-    spes = [1, 1, 1]
-    p = InlineStyle::CssParserWrapper.new "p, b {color: black}\ni {color: green; text-decoration: none}"
-
-    p.each_rule_set do |rs|
-      rs_count += 1
-      rs.each_selector do |sel|
-        sel_count += 1
-        sel.selector_text.should == selectors.shift
-        sel.declarations.should == decs.shift
-        sel.specificity.should == spes.shift
-      end
-    end
-
-    rs_count.should == 2
-    sel_count.should == 3
-  end
-
-end
-
-describe InlineStyle::CSSPoolWrapper do
-
-  it 'should wrap csspool' do
-    rs_count = 0
-    sel_count = 0
-    selectors = %w(p b i)
-    decs = ['color: black;', 'color: black;', 'color: green; text-decoration: none;']
-    spes = [1, 1, 1]
-    p = InlineStyle::CSSPoolWrapper.new "p, b {color: black}\ni {color: green; text-decoration: none}"
-
-    p.each_rule_set do |rs|
-      rs_count += 1
-      rs.each_selector do |sel|
-        sel_count += 1
-        sel.selector_text.should == selectors.shift
-        sel.declarations.should == decs.shift
-        sel.specificity.should == spes.shift
-      end
-    end
-
-    rs_count.should == 2
-    sel_count.should == 3
-  end
-
-end