compass 0.12.4 → 1.0.0

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

@@ -0,0 +1,50 @@
+/* New using px output */
+$base-font-size: 18px;
+$base-line-height: $base-font-size * 1.4;
+$rhythm-unit: px;
+$default-rhythm-border-style: solid #aaaaaa;
+@import "compass/typography/vertical_rhythm";
+
+@include establish-baseline;
+
+.container {
+	@include debug-vertical-alignment;
+}
+
+p {
+	@include margin-leader;
+	@include margin-trailer;
+}
+
+th,
+td {
+	@include rhythm-padding(.25);
+}
+
+/* Incremental leading made easy! */
+.caption {
+	@include adjust-font-size-to(.85rem, 4/5);
+}
+
+.spaced-out {
+	@include adjust-leading-to(1.5);
+}
+
+blockquote {
+	@include rhythm-margins;
+	padding: 0 rhythm();
+}
+
+.fig-quote {
+	> blockquote {
+		@include trailer(.5);
+	}
+	.source {
+		@include adjust-font-size-to(.85rem, auto);
+		@include trailer(.5);
+	}
+}
+
+.panel {
+	@include rhythm-borders;
+}

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

@@ -0,0 +1,50 @@
+/* New using rem output with pixel fallbacks */
+$base-font-size: 18px;
+$base-line-height: $base-font-size * 1.4;
+$rhythm-unit: rem;
+$default-rhythm-border-style: solid #aaaaaa;
+@import "compass/typography/vertical_rhythm";
+
+@include establish-baseline;
+
+.container {
+	@include debug-vertical-alignment;
+}
+
+p {
+	@include margin-leader;
+	@include margin-trailer;
+}
+
+th,
+td {
+	@include rhythm-padding(.25);
+}
+
+/* Incremental leading made easy! */
+.caption {
+	@include adjust-font-size-to(.85rem, 4/5);
+}
+
+.spaced-out {
+	@include adjust-leading-to(1.5);
+}
+
+blockquote {
+	@include rhythm-margins;
+	padding: 0 rhythm();
+}
+
+.fig-quote {
+	> blockquote {
+		@include trailer(.5);
+	}
+	.source {
+		@include adjust-font-size-to(.85rem, auto);
+		@include trailer(.5);
+	}
+}
+
+.panel {
+	@include rhythm-borders;
+}

data/test/fixtures/stylesheets/envtest/css/env.css

@@ -1,2 +1,10 @@
 .env {
   env: <%= options[:environment] %>; }
+.time {
+  time: <%= Time.now.strftime("%F") %>; }
+.date {
+  date: <%= Time.now.strftime("%F") %>; }
+.filename {
+  file: env.scss; }
+.output {
+  output: env.css; }

data/test/fixtures/stylesheets/envtest/sass/env.scss

@@ -1,3 +1,19 @@
 .env {
   env: compass-env();  
 }
+
+.time {
+  time: current-time("%F");
+}
+
+.date {
+  date: current-date("%F");
+}
+
+.filename {
+  file: current-source-file();
+}
+
+.output {
+  output: current-output-file();
+}

data/test/fixtures/stylesheets/sourcemaps/config.rb

@@ -0,0 +1,10 @@
+# Require any additional compass plugins here.
+css_dir = "tmp"
+sass_dir = "sass"
+images_dir = "assets/images"
+javascripts_dir = "assets/javascripts"
+# Set this to the root of your project when deployed:
+http_path = "/"
+# To enable relative paths to assets via compass helper functions. Uncomment:
+relative_assets = true
+sourcemap = true

data/test/fixtures/stylesheets/sourcemaps/css/another_simple.css

@@ -0,0 +1,2 @@
+.another-simple-class{color:blue}
+/*# sourceMappingURL=another_simple.css.map */

data/test/fixtures/stylesheets/sourcemaps/css/another_simple.css.map

@@ -0,0 +1,7 @@
+{
+"version": 3,
+"mappings": "AAAA,qBAAsB,CACpB,KAAK,CAAE,IAAI",
+"sources": ["../sass/another_simple.scss"],
+"names": [],
+"file": "another_simple.css"
+}

data/test/fixtures/stylesheets/sourcemaps/css/simple.css

@@ -0,0 +1,2 @@
+div{color:red}
+/*# sourceMappingURL=simple.css.map */

data/test/fixtures/stylesheets/sourcemaps/css/simple.css.map

@@ -0,0 +1,7 @@
+{
+"version": 3,
+"mappings": "AAAA,GAAG,CACD,KAAK,CAAE,GAAG",
+"sources": ["../sass/simple.sass"],
+"names": [],
+"file": "simple.css"
+}

data/test/fixtures/stylesheets/sourcemaps/css/with_libraries.css

@@ -0,0 +1,2 @@
+*{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
+/*# sourceMappingURL=with_libraries.css.map */

data/test/fixtures/stylesheets/sourcemaps/css/with_libraries.css.map

@@ -0,0 +1,7 @@
+{
+"version": 3,
+"mappings": "AAEA,CAAE,CC0VA,eAAwC,CC1U5B,UAAmB,CD0U/B,kBAAwC,CC1U5B,UAAmB,CD0U/B,UAAwC,CC1U5B,UAAmB",
+"sources": ["../sass/with_libraries.scss","../../../../../../core/stylesheets/compass/_support.scss","../../../../../../core/stylesheets/compass/css3/_box-sizing.scss"],
+"names": [],
+"file": "with_libraries.css"
+}

data/test/fixtures/stylesheets/sourcemaps/sass/another_simple.scss

@@ -0,0 +1,3 @@
+.another-simple-class {
+  color: blue;
+}

data/test/fixtures/stylesheets/sourcemaps/sass/simple.sass

@@ -0,0 +1,2 @@
+div
+  color: red

data/test/fixtures/stylesheets/sourcemaps/sass/with_libraries.scss

@@ -0,0 +1,5 @@
+@import "compass/css3/box-sizing";
+
+* {
+  @include box-sizing;
+}

data/test/fixtures/stylesheets/valid/sass/another_simple.scss

@@ -0,0 +1,3 @@
+.another-simple-class {
+  color: blue;
+}

data/test/fixtures/stylesheets/with_sass_globbing/config.rb

@@ -0,0 +1,26 @@
+require 'sass-globbing'
+require 'compass/import-once/activate'
+# Require any additional compass plugins here.
+
+# Set this to the root of your project when deployed:
+http_path = "/"
+css_dir = "tmp"
+sass_dir = "sass"
+images_dir = "images"
+javascripts_dir = "javascripts"
+
+# You can select your preferred output style here (can be overridden via the command line):
+output_style = :expanded
+
+# To enable relative paths to assets via compass helper functions. Uncomment:
+relative_assets = true
+
+# To disable debugging comments that display the original location of your selectors. Uncomment:
+line_comments = true
+
+
+# If you prefer the indented syntax, you might want to regenerate this
+# project again passing --syntax sass, or you can uncomment this:
+# preferred_syntax = :sass
+# and then run:
+# sass-convert -R --from scss --to sass sass scss && rm -rf sass && mv scss sass

data/test/fixtures/stylesheets/with_sass_globbing/css/screen.css

@@ -0,0 +1,19 @@
+/* line 1, ../sass/partials/_1.scss */
+.one {
+  value: 1;
+}
+
+/* line 1, ../sass/partials/_2.scss */
+.two {
+  value: 2;
+}
+
+/* line 1, ../sass/partials/_3.scss */
+.three {
+  value: 3;
+}
+
+/* line 3, ../sass/screen.scss */
+.something {
+  awww: yeah;
+}

data/test/fixtures/stylesheets/with_sass_globbing/sass/partials/_1.scss

@@ -0,0 +1,3 @@
+.one {
+  value: 1;
+}

data/test/fixtures/stylesheets/with_sass_globbing/sass/partials/_2.scss

@@ -0,0 +1,3 @@
+.two {
+  value: 2;
+}

data/test/fixtures/stylesheets/with_sass_globbing/sass/partials/_3.scss

@@ -0,0 +1,4 @@
+.three {
+  value: 3;
+}
+

data/test/fixtures/stylesheets/with_sass_globbing/sass/screen.scss

@@ -0,0 +1,3 @@
+@import "partials/*";
+
+.something { awww: yeah; }

data/test/helpers/diff.rb

@@ -3,7 +3,7 @@ require 'diff/lcs/hunk'
 module Compass
   module Diff
     #stole this from rspec who stole this from the gem
-    def diff_as_string(data_new, data_old)
+    def diff_as_string(data_old, data_new)
       data_old = data_old.split(/\n/).map! { |e| e.chomp }
       data_new = data_new.split(/\n/).map! { |e| e.chomp }
       output = ""

data/test/integrations/compass_test.rb

@@ -11,8 +11,10 @@ class CompassTest < Test::Unit::TestCase
   end
 
   def teardown
-    [:blueprint, :empty, :compass, :image_urls, :relative].each do |project_name|
+    Dir.glob(absolutize("fixtures/stylesheets/*")).each do |dir|
+      project_name = File.basename(dir)
       ::FileUtils.rm_rf tempfile_path(project_name)
+      ::FileUtils.rm_rf File.join(project_path(project_name), ".sass-cache")
     end
   end
 
@@ -23,7 +25,7 @@ class CompassTest < Test::Unit::TestCase
     before_compile = Proc.new do |config|
       config.on_stylesheet_saved {|filepath| path = filepath; saved = true }
     end
-    within_project(:blueprint, before_compile)
+    within_project(:compass, before_compile)
     assert saved, "Stylesheet callback didn't get called"
     assert path.is_a?(String), "Path is not a string. Got: #{path.class.name}"
   end
@@ -36,7 +38,7 @@ class CompassTest < Test::Unit::TestCase
       before_compile = Proc.new do |config|
         config.on_stylesheet_error {|filename, message| file = filename; error = true }
       end
-      within_project(:error, before_compile) rescue nil;
+      within_project(:error, before_compile) rescue nil
       assert error, "Project did not throw a compile error"
       assert file.is_a?(String), "Filename was not a string"
     end
@@ -51,10 +53,10 @@ class CompassTest < Test::Unit::TestCase
     end
   end
 
-  def test_blueprint
-    within_project(:blueprint) do |proj|
+  def test_compass
+    within_project('compass') do |proj|
       each_css_file(proj.css_path) do |css_file|
-        assert_no_errors css_file, :blueprint
+        assert_no_errors css_file, 'compass'
       end
       each_sass_file do |sass_file|
         assert_renders_correctly sass_file, :ignore_charset => true
@@ -62,10 +64,10 @@ class CompassTest < Test::Unit::TestCase
     end
   end
 
-  def test_compass
-    within_project('compass') do |proj|
+  def test_sourcemaps
+    within_project('sourcemaps') do |proj|
       each_css_file(proj.css_path) do |css_file|
-        assert_no_errors css_file, 'compass'
+        assert_no_errors css_file, 'sourcemaps'
       end
       each_sass_file do |sass_file|
         assert_renders_correctly sass_file, :ignore_charset => true
@@ -95,6 +97,17 @@ class CompassTest < Test::Unit::TestCase
     end
   end
 
+  def test_busted_font_urls
+    within_project('busted_font_urls') do |proj|
+      each_css_file(proj.css_path) do |css_file|
+        assert_no_errors css_file, 'busted_font_urls'
+      end
+      each_sass_file do |sass_file|
+        assert_renders_correctly sass_file
+      end
+    end
+  end
+
   def test_busted_image_urls
     within_project('busted_image_urls') do |proj|
       each_css_file(proj.css_path) do |css_file|
@@ -106,6 +119,17 @@ class CompassTest < Test::Unit::TestCase
     end
   end
 
+  def test_with_sass_globbing
+    within_project('with_sass_globbing') do |proj|
+      each_css_file(proj.css_path) do |css_file|
+        assert_no_errors css_file, 'with_sass_globbing'
+      end
+      each_sass_file do |sass_file|
+        assert_renders_correctly sass_file
+      end
+    end
+  end
+
   def test_image_urls
     within_project('image_urls') do |proj|
       each_css_file(proj.css_path) do |css_file|
@@ -138,8 +162,9 @@ private
   def assert_renders_correctly(*arguments)
     options = arguments.last.is_a?(Hash) ? arguments.pop : {}
     for name in arguments
-      actual_result_file = "#{tempfile_path(@current_project)}/#{name}.css"
+      @output_file = actual_result_file = "#{tempfile_path(@current_project)}/#{name}.css"
       expected_result_file = "#{result_path(@current_project)}/#{name}.css"
+      @filename = expected_result_file.gsub('css', 'scss')
       actual_lines = File.read(actual_result_file)
       actual_lines.gsub!(/^@charset[^;]+;/,'') if options[:ignore_charset]
       actual_lines = actual_lines.split("\n").reject{|l| l=~/\A\Z/}
@@ -154,7 +179,7 @@ private
         end
       end
       if expected_lines.size < actual_lines.size
-        assert(false, "#{actual_lines.size - expected_lines.size} Trailing lines found in #{actual_result_file}.css: #{actual_lines[expected_lines.size..-1].join('\n')}")
+        assert(false, "#{actual_lines.size - expected_lines.size} Trailing lines found in #{actual_result_file}: #{actual_lines[expected_lines.size..-1].join('\n')}")
       end
     end
   end
@@ -164,16 +189,17 @@ private
     Compass.add_configuration(configuration_file(project_name)) if File.exists?(configuration_file(project_name))
     Compass.configuration.project_path = project_path(project_name)
     Compass.configuration.environment = :production
-    args = Compass.configuration.to_compiler_arguments(:logger => Compass::NullLogger.new)
+    Compass.configuration.sourcemap = false unless Compass.configuration.sourcemap_set?
 
     if config_block
       config_block.call(Compass.configuration)
     end
 
     if Compass.configuration.sass_path && File.exists?(Compass.configuration.sass_path)
-      compiler = Compass::Compiler.new *args
+      compiler = Compass.sass_compiler
+      compiler.logger = Compass::NullLogger.new
       compiler.clean!
-      compiler.run
+      compiler.compile!
     end
     yield Compass.configuration if block_given?
   rescue
@@ -188,6 +214,7 @@ private
   def each_sass_file(sass_dir = nil)
     sass_dir ||= template_path(@current_project)
     Dir.glob("#{sass_dir}/**/*.s[ac]ss").each do |sass_file|
+      next if File.basename(sass_file).start_with?("_")
       yield sass_file[(sass_dir.length+1)..-6]
     end
   end
@@ -221,4 +248,12 @@ private
     File.join(project_path(project_name), "saved")
   end
 
+  def filename
+    @filename
+  end
+
+  def output_file
+    @output_file
+  end
+
 end

data/test/integrations/sprites_test.rb

@@ -9,11 +9,19 @@ class SpritesTest < Test::Unit::TestCase
   
   def setup
     Compass.reset_configuration!
-    @images_src_path = File.join(File.dirname(__FILE__), '..', 'fixtures', 'sprites', 'public', 'images')
-    @images_tmp_path = File.join(File.dirname(__FILE__), '..', 'fixtures', 'sprites', 'public', 'images-tmp')
-    @generated_images_tmp_path = File.join(File.dirname(__FILE__), '..', 'fixtures', 'sprites', 'public', 'generated-images-tmp')
+    @images_project_path = File.expand_path(File.join(File.dirname(__FILE__), '..', 'fixtures', 'sprites', 'public'))
+    @images_src_dir = 'images'
+    @images_src_path = File.join(@images_project_path, @images_src_dir)
+    @images_tmp_dir = 'images-tmp'
+    @images_tmp_path = File.join(@images_project_path, @images_tmp_dir)
+    @generated_images_tmp_dir = 'generated-images-tmp'
+    @generated_images_tmp_path = File.join(@images_project_path, @generated_images_tmp_dir)
     ::FileUtils.cp_r @images_src_path, @images_tmp_path
-    file = StringIO.new("images_path = #{@images_tmp_path.inspect}\n")
+    ::FileUtils.mkdir_p @generated_images_tmp_path
+    file = StringIO.new(<<-CONFIG)
+      project_path = "#{@images_project_path}"
+      images_dir = "#{@images_tmp_dir}"
+    CONFIG
     Compass.add_configuration(file, "sprite_config")
     Compass.configure_sass_plugin!
   end
@@ -34,7 +42,7 @@ class SpritesTest < Test::Unit::TestCase
   end
 
   def image_size(file)
-    open(map_location(file), "rb").read[0x10..0x18].unpack('NN')
+    Compass::Core::SassExtensions::Functions::ImageSize::ImageProperties.new(map_location(file)).size
   end
 
   def image_md5(file)
@@ -44,7 +52,6 @@ class SpritesTest < Test::Unit::TestCase
   end
 
   def render(scss)
-    scss = %Q(@import "compass"; #{scss})
     options = Compass.sass_engine_options
     options[:line_comments] = false
     options[:style] = :expanded
@@ -65,9 +72,10 @@ class SpritesTest < Test::Unit::TestCase
       @import "squares/*.png";
       @include all-squares-sprites;
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .squares-sprite, .squares-ten-by-ten, .squares-twenty-by-twenty {
-        background: url('/squares-sbbc18e2129.png') no-repeat;
+        background-image: url('/images-tmp/squares-sbbc18e2129.png');
+        background-repeat: no-repeat;
       }
       
       .squares-ten-by-ten {
@@ -98,7 +106,8 @@ class SpritesTest < Test::Unit::TestCase
     assert_not_nil Dir.glob("#{@generated_images_tmp_path}/squares-s*.png").first
     assert_correct <<-CSS, css
       .squares-sprite, .squares-ten-by-ten, .squares-twenty-by-twenty {
-        background: url('/images/generated/squares-sbbc18e2129.png') no-repeat;
+        background-image: url('/images/generated/squares-sbbc18e2129.png');
+        background-repeat: no-repeat;
       }
       
       .squares-ten-by-ten {
@@ -117,9 +126,10 @@ class SpritesTest < Test::Unit::TestCase
       @import "squares/*.png";
       @include all-squares-sprites;
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .squares-sprite, .squares-ten-by-ten, .squares-twenty-by-twenty {
-        background: url('/squares-sbbc18e2129.png') no-repeat;
+        background-image: url('/images-tmp/squares-sbbc18e2129.png');
+        background-repeat: no-repeat;
       }
       
       .squares-ten-by-ten {
@@ -149,9 +159,10 @@ class SpritesTest < Test::Unit::TestCase
         @include squares-sprite("twenty-by-twenty", true);
       }
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .squares-sprite, .cubicle, .large-cube {
-        background: url('/squares-sbbc18e2129.png') no-repeat;
+        background-image: url('/images-tmp/squares-sbbc18e2129.png');
+        background-repeat: no-repeat;
       }
       
       .cubicle {
@@ -174,9 +185,10 @@ class SpritesTest < Test::Unit::TestCase
       $squares-sprite-base-class: ".circles";
       @import "squares/*.png";
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .circles {
-        background: url('/squares-sbbc18e2129.png') no-repeat;
+        background-image: url('/images-tmp/squares-sbbc18e2129.png');
+        background-repeat: no-repeat;
       }
     CSS
     assert_equal image_size('squares-s*.png'), [20, 30]
@@ -188,9 +200,10 @@ class SpritesTest < Test::Unit::TestCase
       @import "squares/*.png";
       @include all-squares-sprites;
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .squares-sprite, .squares-ten-by-ten, .squares-twenty-by-twenty {
-        background: url('/squares-s563a5e0855.png') no-repeat;
+        background-image: url('/images-tmp/squares-s563a5e0855.png');
+        background-repeat: no-repeat;
       }
       
       .squares-ten-by-ten {
@@ -210,9 +223,10 @@ class SpritesTest < Test::Unit::TestCase
       @import "squares/*.png";
       @include all-squares-sprites;
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .squares-sprite, .squares-ten-by-ten, .squares-twenty-by-twenty {
-        background: url('/squares-s4ea353fa6d.png') no-repeat;
+        background-image: url('/images-tmp/squares-s4ea353fa6d.png');
+        background-repeat: no-repeat;
       }
       
       .squares-ten-by-ten {
@@ -233,9 +247,10 @@ class SpritesTest < Test::Unit::TestCase
       @import "squares/*.png";
       @include all-squares-sprites;
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .squares-sprite, .squares-ten-by-ten, .squares-twenty-by-twenty {
-        background: url('/squares-sf4771cb124.png') no-repeat;
+        background-image: url('/images-tmp/squares-sf4771cb124.png');
+        background-repeat: no-repeat;
       }
       
       .squares-ten-by-ten {
@@ -256,9 +271,10 @@ class SpritesTest < Test::Unit::TestCase
       @import "squares/*.png";
       @include all-squares-sprites;
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .squares-sprite, .squares-ten-by-ten, .squares-twenty-by-twenty {
-        background: url('/squares-sc82d6f3cf4.png') no-repeat;
+        background-image: url('/images-tmp/squares-sc82d6f3cf4.png');
+        background-repeat: no-repeat;
       }
       
       .squares-ten-by-ten {
@@ -278,9 +294,10 @@ class SpritesTest < Test::Unit::TestCase
       @import "squares/*.png";
       @include all-squares-sprites;
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .squares-sprite, .squares-ten-by-ten, .squares-twenty-by-twenty {
-        background: url('/squares-s2f4aa65dcf.png') no-repeat;
+        background-image: url('/images-tmp/squares-s2f4aa65dcf.png');
+        background-repeat: no-repeat;
       }
       
       .squares-ten-by-ten {
@@ -298,7 +315,8 @@ class SpritesTest < Test::Unit::TestCase
     css = render <<-SCSS
       $squares: sprite-map("squares/*.png", $position: 100%);
       .squares-sprite {
-        background: $squares no-repeat;
+        background-image: $squares;
+        background-repeat: no-repeat;
       }
 
       .adjusted-percentage {
@@ -313,9 +331,10 @@ class SpritesTest < Test::Unit::TestCase
         background-position: sprite-position($squares, twenty-by-twenty, -3px, 2px);
       }
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .squares-sprite {
-        background: url('/squares-sce5dc30797.png') no-repeat;
+        background-image: url('/images-tmp/squares-sce5dc30797.png');
+        background-repeat: no-repeat;
       }
       
       .adjusted-percentage {
@@ -351,9 +370,10 @@ class SpritesTest < Test::Unit::TestCase
         @include squares-sprite("twenty-by-twenty", $offset-x: -3px, $offset-y: 2px);
       }
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .squares-sprite, .adjusted-percentage, .adjusted-px-1, .adjusted-px-2 {
-        background: url('/squares-sce5dc30797.png') no-repeat;
+        background-image: url('/images-tmp/squares-sce5dc30797.png');
+        background-repeat: no-repeat;
       }
       
       .adjusted-percentage {
@@ -378,9 +398,10 @@ class SpritesTest < Test::Unit::TestCase
       @import "squares/*.png";
       @include all-squares-sprites;
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .squares-sprite, .squares-ten-by-ten, .squares-twenty-by-twenty {
-        background: url('/squares-s65c43cd573.png') no-repeat;
+        background-image: url('/images-tmp/squares-s65c43cd573.png');
+        background-repeat: no-repeat;
       }
       
       .squares-ten-by-ten {
@@ -402,9 +423,10 @@ class SpritesTest < Test::Unit::TestCase
       @import "squares/*.png";
       @include all-squares-sprites;
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .squares-sprite, .squares-ten-by-ten, .squares-twenty-by-twenty {
-        background: url('/squares-sb9d9a8ca6a.png') no-repeat;
+        background-image: url('/images-tmp/squares-sb9d9a8ca6a.png');
+        background-repeat: no-repeat;
       }
       
       .squares-ten-by-ten {
@@ -423,23 +445,19 @@ class SpritesTest < Test::Unit::TestCase
     assert_raise(Sass::SyntaxError) do
       render <<-SCSS
         .squares {
-          background: sprite-url("squares/*.png") no-repeat;
-        }
-      SCSS
-    end
-    assert_raise(Sass::SyntaxError) do
-      css = render <<-SCSS
-        .squares {
-          background: sprite-image("squares/twenty-by-twenty.png") no-repeat;
+          background-image: sprite-url("squares/*.png");
+          background-repeat: no-repeat;
         }
       SCSS
     end
+    
     assert_raise(Sass::SyntaxError) do
       css = render <<-SCSS
         @import "squares/*.png";
 
         .squares {
-          background: sprite-position("squares/twenty-by-twenty.png") no-repeat;
+          background-image: sprite-position("squares/twenty-by-twenty.png");
+          background-repeat: no-repeat;
         }
       SCSS
     end
@@ -448,12 +466,152 @@ class SpritesTest < Test::Unit::TestCase
   it "should work even if @import is missing" do
     css = render <<-SCSS
       .squares {
-        background: sprite(sprite-map("squares/*.png"), twenty-by-twenty) no-repeat;
+        background-image: sprite(sprite-map("squares/*.png"), twenty-by-twenty);
+        background-repeat: no-repeat;
       }
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .squares {
-        background: url('/squares-sd817b59156.png') 0 -10px no-repeat;
+        background-image: url('/images-tmp/squares-sd817b59156.png') 0 -10px;
+        background-repeat: no-repeat;
+      }
+    CSS
+  end
+
+  it "should import sprites with numeric filenames via #738" do
+    css = render <<-SCSS
+      @import "numeric/*.png";
+      @include all-numeric-sprites;
+    SCSS
+    assert_correct <<-CSS, css
+      .numeric-sprite, .numeric-200 {
+        background-image: url('/images-tmp/numeric-saa92d65a89.png');
+        background-repeat: no-repeat;
+      }
+      
+      .numeric-200 {
+        background-position: 0 0;
+      }
+    CSS
+  end
+ 
+  it "should use percentage positions when use_percentages is true" do
+    css = render <<-SCSS
+      @import "squares/*.png";
+      $squares-use-percentages: true;
+      .foo {
+        @include squares-sprite-position("twenty-by-twenty");
+      }
+      .bar {
+        @include squares-sprite-position("ten-by-ten");
+        @include squares-sprite-dimensions("ten-by-ten");
+      }
+    SCSS
+    assert_correct <<-CSS, css
+      .squares-sprite {
+        background-image: url('/images-tmp/squares-sbbc18e2129.png');
+        background-repeat: no-repeat;
+      }
+      
+      .foo {
+        background-position: 0 100%;
+      }
+      
+      .bar {
+        background-position: 0 0;
+        height: 10px;
+        width: 10px;
+      }
+    CSS
+  end
+  
+  it "should use correct percentages when use_percentages is with horizontal layout" do
+    css = render <<-SCSS
+      $squares-layout: horizontal;
+      @import "squares/*.png";
+      $squares-use-percentages: true;
+      .foo {
+        @include squares-sprite-position("twenty-by-twenty");
+      }
+      .bar {
+        @include squares-sprite-position("ten-by-ten");
+      }
+    SCSS
+    assert_correct <<-CSS, css
+      .squares-sprite {
+        background-image: url('/images-tmp/squares-s4bd95c5c56.png');
+        background-repeat: no-repeat;
+      }
+      
+      .foo {
+        background-position: 100% 0;
+      }
+      
+      .bar {
+        background-position: 0 0;
+      }
+    CSS
+  end
+
+  it "should use correct percentages when use_percentages is true with smart layout" do
+    css = render <<-SCSS
+      $image_row-layout: smart;
+      @import "image_row/*.png";
+      $image_row-use-percentages: true;
+      .foo {
+        @include image_row-sprite-position("medium");
+      }
+      .bar {
+        @include image_row-sprite-position("large_square");
+      }
+    SCSS
+    assert_correct <<-CSS, css
+      .image_row-sprite {
+        background-image: url('/images-tmp/image_row-sc5082a6b9f.png');
+        background-repeat: no-repeat;
+      }
+      
+      .foo {
+        background-position: 0 50%;
+      }
+      
+      .bar {
+        background-position: 33.33333% 100%;
+      }
+    CSS
+  end
+
+  it "should use correct percentages when use_percentages is true" do
+    css = render <<-SCSS
+      $image_row-use-percentages: true;
+      $image_row-sort-by : '!width';
+      @import "image_row/*.png";
+      @include all-image_row-sprites;
+    SCSS
+    assert_correct <<-CSS, css
+      .image_row-sprite, .image_row-large, .image_row-large_square, .image_row-medium, .image_row-small, .image_row-tall {
+        background-image: url('/images-tmp/image_row-sdf383d45a3.png');
+        background-repeat: no-repeat;
+      }
+      
+      .image_row-large {
+        background-position: 0 0;
+      }
+      
+      .image_row-large_square {
+        background-position: 0 40%;
+      }
+      
+      .image_row-medium {
+        background-position: 0 16.66667%;
+      }
+      
+      .image_row-small {
+        background-position: 0 100%;
+      }
+      
+      .image_row-tall {
+        background-position: 0 80%;
       }
     CSS
   end
@@ -470,9 +628,10 @@ class SpritesTest < Test::Unit::TestCase
       }
     SCSS
     assert_equal image_size('squares-s*.png'), [20, 40]
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .squares-sprite {
-        background: url('/squares-s555875d730.png') no-repeat;
+        background-image: url('/images-tmp/squares-s555875d730.png');
+        background-repeat: no-repeat;
       }
       
       .foo {
@@ -490,21 +649,22 @@ class SpritesTest < Test::Unit::TestCase
       @import "selectors/*.png";
       @include all-selectors-sprites;
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .selectors-sprite, .selectors-ten-by-ten {
-        background: url('/selectors-s7e84acb3d2.png') no-repeat;
+        background-image: url('/images-tmp/selectors-s7e84acb3d2.png');
+        background-repeat: no-repeat;
       }
       
       .selectors-ten-by-ten {
         background-position: 0 0;
       }
-      .selectors-ten-by-ten:hover, .selectors-ten-by-ten.ten-by-ten_hover, .selectors-ten-by-ten.ten-by-ten-hover {
+      .selectors-ten-by-ten:hover, .selectors-ten-by-ten.ten-by-ten-hover {
         background-position: 0 -20px;
       }
-      .selectors-ten-by-ten:target, .selectors-ten-by-ten.ten-by-ten_target, .selectors-ten-by-ten.ten-by-ten-target {
+      .selectors-ten-by-ten:target, .selectors-ten-by-ten.ten-by-ten-target {
         background-position: 0 -30px;
       }
-      .selectors-ten-by-ten:active, .selectors-ten-by-ten.ten-by-ten_active, .selectors-ten-by-ten.ten-by-ten-active {
+      .selectors-ten-by-ten:active, .selectors-ten-by-ten.ten-by-ten-active {
         background-position: 0 -10px;
       }
     CSS
@@ -515,21 +675,22 @@ class SpritesTest < Test::Unit::TestCase
       @import "selectors/*.png";
       @include all-selectors-sprites($offset-x: 20px, $offset-y: 20px);
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .selectors-sprite, .selectors-ten-by-ten {
-        background: url('/selectors-s7e84acb3d2.png') no-repeat;
+        background-image: url('/images-tmp/selectors-s7e84acb3d2.png');
+        background-repeat: no-repeat;
       }
       
       .selectors-ten-by-ten {
         background-position: 20px 20px;
       }
-      .selectors-ten-by-ten:hover, .selectors-ten-by-ten.ten-by-ten_hover, .selectors-ten-by-ten.ten-by-ten-hover {
+      .selectors-ten-by-ten:hover, .selectors-ten-by-ten.ten-by-ten-hover {
         background-position: 20px 0;
       }
-      .selectors-ten-by-ten:target, .selectors-ten-by-ten.ten-by-ten_target, .selectors-ten-by-ten.ten-by-ten-target {
+      .selectors-ten-by-ten:target, .selectors-ten-by-ten.ten-by-ten-target {
         background-position: 20px -10px;
       }
-      .selectors-ten-by-ten:active, .selectors-ten-by-ten.ten-by-ten_active, .selectors-ten-by-ten.ten-by-ten-active {
+      .selectors-ten-by-ten:active, .selectors-ten-by-ten.ten-by-ten-active {
         background-position: 20px 10px;
       }
     CSS
@@ -542,21 +703,22 @@ class SpritesTest < Test::Unit::TestCase
         @include selectors-sprite(ten-by-ten)
       }
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .selectors-sprite, a {
-        background: url('/selectors-s7e84acb3d2.png') no-repeat;
+        background-image: url('/images-tmp/selectors-s7e84acb3d2.png');
+        background-repeat: no-repeat;
       }
       
       a {
         background-position: 0 0;
       }
-      a:hover, a.ten-by-ten_hover, a.ten-by-ten-hover {
+      a:hover, a.ten-by-ten-hover {
         background-position: 0 -20px;
       }
-      a:target, a.ten-by-ten_target, a.ten-by-ten-target {
+      a:target, a.ten-by-ten-target {
         background-position: 0 -30px;
       }
-      a:active, a.ten-by-ten_active, a.ten-by-ten-active {
+      a:active, a.ten-by-ten-active {
         background-position: 0 -10px;
       }
     CSS
@@ -567,13 +729,14 @@ class SpritesTest < Test::Unit::TestCase
     css = render <<-SCSS
       @import "selectors/*.png";
       a {
-        $disable-magic-sprite-selectors:true;
+        $disable-magic-sprite-selectors:true !global;
         @include selectors-sprite(ten-by-ten)
       }
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .selectors-sprite, a {
-        background: url('/selectors-s7e84acb3d2.png') no-repeat;
+        background-image: url('/images-tmp/selectors-s7e84acb3d2.png');
+        background-repeat: no-repeat;
       }
       
       a {
@@ -589,35 +752,45 @@ class SpritesTest < Test::Unit::TestCase
         @include selectors-sprite(ten-by-ten, false, 5, -5)
       }
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .selectors-sprite, a {
-        background: url('/selectors-s7e84acb3d2.png') no-repeat;
+        background-image: url('/images-tmp/selectors-s7e84acb3d2.png');
+        background-repeat: no-repeat;
       }
       
       a {
         background-position: 5px -5px;
       }
-      a:hover, a.ten-by-ten_hover, a.ten-by-ten-hover {
+      a:hover, a.ten-by-ten-hover {
         background-position: 5px -25px;
       }
-      a:target, a.ten-by-ten_target, a.ten-by-ten-target {
+      a:target, a.ten-by-ten-target {
         background-position: 5px -35px;
       }
-      a:active, a.ten-by-ten_active, a.ten-by-ten-active {
+      a:active, a.ten-by-ten-active {
         background-position: 5px -15px;
       }
     CSS
   end
   
-  it "should raise error on filenames that are not valid sass syntax" do
-    assert_raise(Compass::Error) do
-      css = render <<-SCSS
-        @import "prefix/*.png";
-        a {
-          @include squares-sprite(20-by-20);
-        }
-      SCSS
-    end
+  it "should not raise error on filenames that are invalid classnames if the selector generation is not used" do
+    css = render <<-SCSS
+      $prefix-sort-by : 'width';
+      @import "prefix/*.png";
+      a {
+        @include prefix-sprite("20-by-20");
+      }
+    SCSS
+    assert_correct <<-CSS, css
+      .prefix-sprite, a {
+        background-image: url('/images-tmp/prefix-s949dea513d.png');
+        background-repeat: no-repeat;
+      }
+      
+      a {
+        background-position: 0 -10px;
+      }
+    CSS
   end
 
   it "should generate sprite with bad repeat-x dimensions" do
@@ -626,9 +799,10 @@ class SpritesTest < Test::Unit::TestCase
       @import "ko/*.png";
       @include all-ko-sprites;
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .ko-sprite, .ko-default_background, .ko-starbg26x27 {
-        background: url('/ko-sd46dfbab4f.png') no-repeat;
+        background-image: url('/images-tmp/ko-sd46dfbab4f.png');
+        background-repeat: no-repeat;
       }
       
       .ko-default_background {
@@ -647,7 +821,7 @@ class SpritesTest < Test::Unit::TestCase
     css = render <<-SCSS
       @import "selectors/*.png";
       a {
-        $disable-magic-sprite-selectors:true;
+        $disable-magic-sprite-selectors:true !global;
         @include selectors-sprite(ten-by-ten)
       }
     SCSS
@@ -661,7 +835,7 @@ class SpritesTest < Test::Unit::TestCase
       $selectors-clean-up: false;
       @import "selectors/*.png";
       a {
-        $disable-magic-sprite-selectors:true;
+        $disable-magic-sprite-selectors:true !global;
         @include selectors-sprite(ten-by-ten)
       }
     SCSS
@@ -697,9 +871,10 @@ class SpritesTest < Test::Unit::TestCase
       @import "nested/**/*.png";
       @include all-nested-sprites;
     SCSS
-    assert_correct css, <<-CSS
+    assert_correct <<-CSS, css
       .nested-sprite, .nested-ten-by-ten {
-        background: url('/nested-s7b93e0b6bf.png') no-repeat;
+        background-image: url('/images-tmp/nested-s7b93e0b6bf.png');
+        background-repeat: no-repeat;
       }
       
       .nested-ten-by-ten {
@@ -722,7 +897,8 @@ class SpritesTest < Test::Unit::TestCase
     assert_equal [30, 20], image_size('squares-s*.png')
     other_css = <<-CSS
       .squares-sprite {
-        background: url('/squares-s4bd95c5c56.png') no-repeat;
+        background-image: url('/images-tmp/squares-s4bd95c5c56.png');
+        background-repeat: no-repeat;
       }
 
       .foo {
@@ -733,7 +909,7 @@ class SpritesTest < Test::Unit::TestCase
         background-position: 0 0;
       }
     CSS
-    assert_correct clean(css), clean(other_css)
+    assert_correct clean(other_css), clean(css)
   end
 
   it "should allow use of demension functions" do
@@ -748,18 +924,20 @@ class SpritesTest < Test::Unit::TestCase
     SCSS
     other_css = <<-CSS
       .squares-sprite {
-        background: url('/squares-sbbc18e2129.png') no-repeat;
+        background-image: url('/images-tmp/squares-sbbc18e2129.png');
+        background-repeat: no-repeat;
       }
       .div {
         height:21px;
         width:22px;
       }
     CSS
-    assert_correct clean(css), clean(other_css)
+    assert_correct clean(other_css), clean(css)
   end
 
   it "should replace text with images and dimensions using sprites" do
      css = render <<-SCSS
+     @import "compass/utilities/sprites/sprite-img";
      @import "colors/*.png";
      .blue { 
        @include sprite-replace-text($colors-sprites, blue); 
@@ -769,15 +947,17 @@ class SpritesTest < Test::Unit::TestCase
      }
      SCSS
      other_css = <<-CSS
-      .colors-sprite { 
-        background:url('/colors-s58671cb5bb.png') no-repeat;
+      .colors-sprite {
+        background-image:url('/images-tmp/colors-s58671cb5bb.png');
+        background-repeat: no-repeat;
       }
       .blue { 
         text-indent:-119988px;
         overflow:hidden;
         text-align:left;
+        text-transform: capitalize;
         background-position:0 0;
-        background-image:url('/colors-s58671cb5bb.png');
+        background-image:url('/images-tmp/colors-s58671cb5bb.png');
         background-repeat:no-repeat;
       }
       
@@ -785,18 +965,26 @@ class SpritesTest < Test::Unit::TestCase
         text-indent:-119988px;
         overflow:hidden;
         text-align:left;
+        text-transform: capitalize;
         background-position:0 -10px;
         height:10px;
         width:10px;
-        background-image:url('/colors-s58671cb5bb.png');
+        background-image:url('/images-tmp/colors-s58671cb5bb.png');
         background-repeat:no-repeat;
         }
      CSS
-     assert_correct clean(css), clean(other_css)
+     assert_correct clean(other_css), clean(css)
    end
    
    it "should inline the sprite file" do
-     css = render <<-SCSS
+    Compass.reset_configuration!
+    file = StringIO.new(<<-CONFIG)
+      images_path = #{@images_tmp_path.inspect}
+      generated_images_path = #{@generated_images_tmp_path.inspect}
+    CONFIG
+    Compass.add_configuration(file, "sprite_config")
+    Compass.configure_sass_plugin!
+    css = render <<-SCSS
       $colors-inline:true;
       @import "colors/*.png";
       @include all-colors-sprites;
@@ -812,12 +1000,11 @@ class SpritesTest < Test::Unit::TestCase
         background-position:0 -10px;
       }
     CSS
-    assert_correct clean(css), clean(other_css)
+    assert_correct clean(other_css), clean(css)
    end
 
   it "should have a sprite_name function that returns the names of the sprites in a sass list" do
     css = render <<-SCSS
-      $colors-inline:true;
       @import "colors/*.png";
       @each $color in sprite_names($colors-sprites) {
         .\#{$color} {
@@ -827,7 +1014,8 @@ class SpritesTest < Test::Unit::TestCase
     SCSS
     other_css = <<-CSS
       .colors-sprite {
-        background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAUCAAAAACRhfOKAAAAHElEQVR42mM5wQADLP8JMRlIUIvE/IdgctLTNgCHDhEQVD4ceAAAAABJRU5ErkJggg==');
+        background-image: url('/images-tmp/colors-s58671cb5bb.png');
+        background-repeat: no-repeat;
       }
       .blue { 
         width:0px;
@@ -836,8 +1024,100 @@ class SpritesTest < Test::Unit::TestCase
         width:0px;
       }
     CSS
-    assert_correct clean(css), clean(other_css)
+    assert_correct clean(other_css), clean(css)
+
+  end
 
+  it "should respect global spacing" do
+    css = render <<-SCSS
+      $colors-spacing:5px;
+      @import "colors/*.png";
+      @include all-colors-sprites;
+    SCSS
+    other_css = <<-CSS
+      .colors-sprite, .colors-blue, .colors-yellow {
+        background-image: url('/images-tmp/colors-s747dec274e.png');
+        background-repeat: no-repeat;
+      }
+      .colors-blue { 
+        background-position:0 0;
+      }
+      .colors-yellow {
+        background-position:0 -15px;
+      }
+    CSS
+    assert_correct clean(other_css), clean(css)
+  end
+
+  it "should return width and height of the map" do
+    css = render <<-SCSS
+      @import "colors/*.png";
+      .height { height : sprite_height($colors-sprites); }
+      .width { width : sprite_width($colors-sprites); }
+    SCSS
+    other_css = <<-CSS
+      .colors-sprite {
+        background-image: url('/images-tmp/colors-s58671cb5bb.png');
+        background-repeat: no-repeat;
+      }
+      .height {
+        height : 20px;
+      }
+      .width {
+        width : 10px;
+      }
+    CSS
+    assert_correct clean(other_css), clean(css)
+  end
+
+    it "should return width and height of a sprite" do
+    css = render <<-SCSS
+      @import "colors/*.png";
+      .height { height : sprite_height($colors-sprites, blue); }
+      .width { width : sprite_width($colors-sprites, blue); }
+    SCSS
+    other_css = <<-CSS
+      .colors-sprite {
+        background-image: url('/images-tmp/colors-s58671cb5bb.png');
+        background-repeat: no-repeat;
+      }
+      .height {
+        height : 10px;
+      }
+      .width {
+        width : 10px;
+      }
+    CSS
+    assert_correct clean(other_css), clean(css)
+  end
+
+  it "should render correct sprite with focus selector" do
+    css = render <<-SCSS
+      @import "focus/*.png";
+      @include all-focus-sprites;
+    SCSS
+    assert_correct <<-CSS, css
+      .focus-sprite, .focus-ten-by-ten {
+        background-image: url('/images-tmp/focus-sb5d1467be1.png');
+        background-repeat: no-repeat;
+      }
+      
+      .focus-ten-by-ten {
+        background-position: 0 0;
+      }
+      .focus-ten-by-ten:hover, .focus-ten-by-ten.ten-by-ten-hover {
+        background-position: 0 -30px;
+      }
+      .focus-ten-by-ten:target, .focus-ten-by-ten.ten-by-ten-target {
+        background-position: 0 -40px;
+      }
+      .focus-ten-by-ten:active, .focus-ten-by-ten.ten-by-ten-active {
+        background-position: 0 -10px;
+      }
+      .focus-ten-by-ten:focus, .focus-ten-by-ten.ten-by-ten-focus {
+        background-position: 0 -20px;
+      }
+    CSS
   end
 
 end