middleman-sprockets 4.0.0.rc.1 → 4.0.0.rc.2

data/features/test_cases/long_filenames.feature

@@ -0,0 +1,40 @@
+Feature: Long Filenames
+
+  Background:
+    Given a fixture app "base-app"
+    And a file named "config.rb" with:
+      """
+      activate :sprockets
+      """
+    And a file named "source/images/00000000-0000-0000-0000-000000.svg" with:
+      """
+      <svg xmlns="http://www.w3.org/2000/svg" version="1.1" xlink="http://www.w3.org/1999/xlink" width="300" height="300">
+        <rect width="100" height="100" fill="#f06"></rect>
+      </svg>
+      """
+    And a file named "source/images/00000000-0000-0000-0000-0000001.svg" with:
+      """
+      <svg xmlns="http://www.w3.org/2000/svg" version="1.1" xlink="http://www.w3.org/1999/xlink" width="300" height="300">
+        <rect width="100" height="100" fill="#f06"></rect>
+      </svg>
+      """
+
+  Scenario: Checking built folder for content
+    Given a successfully built app
+
+    When I cd to "build"
+    Then the following files should exist:
+      | images/00000000-0000-0000-0000-000000.svg |
+      | images/00000000-0000-0000-0000-0000001.svg |
+    And the file "images/00000000-0000-0000-0000-000000.svg" should contain "<svg xmlns"
+    And the file "images/00000000-0000-0000-0000-0000001.svg" should contain "<svg xmlns"
+
+
+  Scenario: Rendering html
+    Given the Server is running
+
+    When I go to "/images/00000000-0000-0000-0000-000000.svg"
+    Then I should see "<svg xmlns"
+
+    When I go to "/images/00000000-0000-0000-0000-0000001.svg"
+    Then I should see "<svg xmlns"

data/features/test_cases/path_helpers.feature

@@ -0,0 +1,106 @@
+Feature: Link helpers work in Sprockets & Middleman for sprockets or middleman assets
+
+  Background:
+    Given a fixture app "base-app"
+    And a file named "config.rb" with:
+      """
+      activate :sprockets do |c|
+        c.imported_asset_path = "sprockets"
+      end
+      """
+    And a file named "vendor/js/one.js" with:
+      """
+      console.log('one')
+      """
+    And a file named "vendor/js/two.js.coffee" with:
+      """
+      console.log('two')
+      """
+    And a file named "vendor/js/three.js.erb" with:
+      """
+      console.log('three')
+      """
+    And a file named "vendor/js/four.js.coffee.erb" with:
+      """
+      console.log('four')
+      """
+    And a file named "vendor/css/one.css" with:
+      """
+      .one { color: inherit; }
+      """
+    And a file named "vendor/css/two.css.sass" with:
+      """
+      .two
+        color: inherit
+      """
+    And a file named "vendor/css/three.css.scss" with:
+      """
+      .three { color: inherit; }
+      """
+    And a file named "vendor/css/four.css.erb" with:
+      """
+      .four { color: inherit; }
+      """
+    And a file named "vendor/css/five.css.sass.erb" with:
+      """
+      .five
+        color: inherit
+      """
+    And a file named "vendor/css/six.css.scss.erb" with:
+      """
+      .six { color: inherit; }
+      """
+
+    And a file named "source/links.html.erb" with:
+      """
+      <h2>JS Links</h2>
+      one:   "<%= javascript_path('one') %>"
+      two:   "<%= javascript_path('two') %>"
+      three: "<%= javascript_path('three') %>"
+      four:  "<%= javascript_path('four') %>"
+
+      <h2>CSS Links</h2>
+      one:   "<%= stylesheet_path('one') %>"
+      two:   "<%= stylesheet_path('two') %>"
+      three: "<%= stylesheet_path('three') %>"
+      four:  "<%= stylesheet_path('four') %>"
+      five:  "<%= stylesheet_path('five') %>"
+      six:   "<%= stylesheet_path('six') %>"
+      """
+
+
+  Scenario: Link helpers work in a sprockets asset
+    Given a file named "source/javascripts/links.js.erb" with:
+      """
+      var js_links = {
+        one: "<%= javascript_path('one') %>",
+        two: "<%= javascript_path('two') %>",
+        three: "<%= javascript_path('three') %>",
+        four: "<%= javascript_path('four') %>",
+      }
+
+      var css_links = {
+        one: "<%= stylesheet_path('one') %>",
+        two: "<%= stylesheet_path('two') %>",
+        three: "<%= stylesheet_path('three') %>",
+        four: "<%= stylesheet_path('four') %>",
+        five: "<%= stylesheet_path('five') %>",
+        six: "<%= stylesheet_path('six') %>"
+      }
+      """
+    And the Server is running
+
+    When I go to "/javascripts/links.js"
+    Then I should see 'one: "/sprockets/one.js'
+    And I should see 'two: "/sprockets/two.js'
+    And I should see 'three: "/sprockets/three.js'
+    And I should see 'four: "/sprockets/four.js'
+    And I should see 'one: "/sprockets/one.css'
+    And I should see 'two: "/sprockets/two.css'
+    And I should see 'three: "/sprockets/three.css'
+    And I should see 'four: "/sprockets/four.css'
+    And I should see 'five: "/sprockets/five.css'
+    And I should see 'six: "/sprockets/six.css'
+
+
+

data/features/test_cases/processible_outside_asset_dir.feature

@@ -0,0 +1,49 @@
+Feature: Processible assets outside js_dir or css_dir still compile
+
+  Scenario: Can process css & js outside the js_dir or css_dir
+    Given a fixture app "base-app"
+    And a file named "config.rb" with:
+      """
+      activate :sprockets
+      """
+    And a file named "source/root.js.coffee" with:
+      """
+      console.log 'root'
+      """
+    And a file named "source/dir/nested.js.coffee" with:
+      """
+      console.log 'nested'
+      """
+    And a file named "source/root.css.scss" with:
+      """
+      body {
+        content: 'root';
+      }
+      """
+    And a file named "source/dir/nested.css.scss" with:
+      """
+      body {
+        content: 'nested';
+      }
+      """
+    And the Server is running
+
+    When I go to "/root.js"
+    Then I should see "console.log('root');"
+
+    When I go to "/dir/nested.js"
+    Then I should see "console.log('nested');"
+
+    When I go to "/root.css"
+    Then I should see:
+      """
+      body {
+        content: 'root'; }
+      """
+
+    When I go to "/dir/nested.css"
+    Then I should see:
+      """
+      body {
+        content: 'nested'; }
+      """

data/features/test_cases/sass_globs.feature

@@ -0,0 +1,76 @@
+Feature: Sass should glob partials like sass-rails
+  Including the `sass-globbing` gem ins required for sass globs to work.
+
+  Background:
+    Given a fixture app "base-app"
+    And a file named "config.rb" with:
+      """
+      require 'sass-globbing'
+      activate :sprockets
+      """
+    And a file named "source/stylesheets/main.css.scss" with:
+      """
+      @import "**/*";
+      """
+    And a file named "source/stylesheets/d1/_s1.scss" with:
+      """
+      .d1s1 { content: 'd1'; }
+      """
+    And a file named "source/stylesheets/d2/_s1.sass" with:
+      """
+      .d2s1
+        content: 'd2'
+      """
+    And a file named "source/stylesheets/d2/d3/_s1.sass" with:
+      """
+      .d3s1
+        content: 'd3'
+      """
+    And a file named "source/stylesheets/d2/d3/_s2.scss" with:
+      """
+      .d3s2 { content: 'd3'; }
+      """
+
+  @sprockets3
+  Scenario: Sass globbing should work
+    Given the Server is running
+    When I go to "/stylesheets/main.css"
+    Then I should see ".d1s1"
+    And I should see ".d2s1"
+    And I should see ".d3s1"
+    And I should see ".d3s2"
+
+  @sprockets4
+  Scenario: Sass globbing should work
+    Sass globbing does not work with SassC, but does still work with Sprockets 4 if using ruby Sass.
+
+    Given a file named "config.rb" with:
+      """
+      Object.send :remove_const, :SassC # simulate not having sassc
+      require 'sass-globbing'
+      activate :sprockets
+      """
+    Given the Server is running
+    When I go to "/stylesheets/main.css"
+    Then I should see ".d1s1"
+    And I should see ".d2s1"
+    And I should see ".d3s1"
+    And I should see ".d3s2"
+
+  @sprockets3
+  Scenario: New files are spotted and imported
+    Because of how sass-globbing works, new or changed dependencies aren't spotted. You'll need to change/save the importing stylesheet for them to show up. Adding or removing a newline is a "cheap" trick to trigger the change.
+
+    Given the Server is running
+    And a file named "source/stylesheets/d2/_s2.scss" with:
+      """
+      .d2s2 { content: 'd2s2'; }
+      """
+    And the file "source/stylesheets/main.css.scss" content is changed to:
+      """
+      @import "**/*";
+
+      """
+
+    When I go to "/stylesheets/main.css"
+    Then I should see ".d2s2"

data/features/test_cases/sass_partials.feature

@@ -0,0 +1,49 @@
+Feature: Sass partials should work with Sprockets
+  Confirm that changing assets will be reflected in a files output, even if it is included as a partial.
+
+  Background:
+    Given a fixture app "base-app"
+    And a file named "config.rb" with:
+      """
+      activate :sprockets
+      """
+    And a file named "source/stylesheets/_partial.scss" with:
+      """
+      body { color: red; }
+      """
+
+  Scenario: The stylesheet shows updated content when Sprockets partials change
+    Given a file named "source/stylesheets/main.css.scss" with:
+      """
+      @import "partial";
+      """
+    And the Server is running
+
+    When I go to "/stylesheets/main.css"
+    Then I should see "color: red;"
+
+    And the file "source/stylesheets/_partial.scss" content is changed to:
+      """
+      body { color: blue; }
+      """
+
+    When I go to "/stylesheets/main.css"
+    Then I should see "color: blue;"
+
+  Scenario: The stylesheet shows updated content when an imported partial changes
+    Given a file named "source/stylesheets/main.css.scss" with:
+      """
+      //= require _partial
+      """
+    And the Server is running
+
+    When I go to "/stylesheets/main.css"
+    Then I should see "color: red;"
+
+    And the file "source/stylesheets/_partial.scss" content is changed to:
+      """
+      body { color: blue; }
+      """
+
+    When I go to "/stylesheets/main.css"
+    Then I should see "color: blue;"

data/features/test_cases/sassc.feature

@@ -0,0 +1,27 @@
+Feature: Usage of SassC
+
+  Scenario: Using SassC
+    Given a fixture app "base-app"
+    And a file named "config.rb" with:
+      """
+      require "sassc"
+      activate :sprockets
+      """
+    And a file named "source/stylesheets/site.css.scss" with:
+      """
+      $color: #fff;
+
+      html {
+        body {
+          color: #fff;
+        }
+      }
+      """
+    And the Server is running
+
+    When I go to "/stylesheets/site.css"
+    Then I should see:
+      """
+      html body {
+        color: #fff; }
+      """

data/features/test_cases/use_from_templates.feature

@@ -0,0 +1,21 @@
+Feature: Sprockets is available for use in templates
+
+  Scenario: Render a sprockets svg from a template
+    Given a fixture app "base-app"
+    And a file named "config.rb" with:
+      """
+      activate :sprockets
+      sprockets.append_path "vendor/images"
+      """
+    And a file named "vendor/images/logo.svg" with:
+      """
+      <?xml version="1.0" encoding="iso-8859-1"?>
+      """
+    And a file named "source/index.html.erb" with:
+      """
+      <%= sprockets['logo.svg'].source %>
+      """
+    And the Server is running
+
+    When I go to "/"
+    Then I should see '<?xml version="1.0" encoding="iso-8859-1"?>'

data/features/test_cases/using_assets_gem_assets.feature

@@ -0,0 +1,88 @@
+Feature: Using assets gems assets
+
+  Background:
+    Given a fixture app "base-app"
+    And a file named "config.rb" with:
+      """
+      activate :sprockets
+      sprockets.append_path File.join(root, 'vendor')
+      """
+    And a file named "source/javascripts/require_from_assets_gem.js" with:
+      """
+      //= require _imports/import
+      """
+    And a file named "source/stylesheets/require_from_assets_gem.css" with:
+      """
+      //= require test
+      """
+    And a file named "vendor/javascripts/vendor_import.js" with:
+      """
+      console.log('vendor');
+      """
+    And a file named "source/javascripts/require_from_vendor.js" with:
+      """
+      //= require vendor_import
+      """
+    And a file named "vendor/stylesheets/vendor_import.css" with:
+      """
+      body { content: 'vendor'; }
+      """
+    And a file named "source/stylesheets/require_from_vendor.css" with:
+      """
+      //= require vendor_import
+      //= require with_img
+      """
+    And a file named "vendor/stylesheets/with_img.css.scss" with:
+      """
+      body { background: image-url('vendor_gem/logo.png'); }
+      """
+    And a file named "vendor/images/vendor_gem/logo.png" with:
+      """
+      """
+
+  Scenario: Assets are requirable from a gem
+    Given the Server is running
+
+    When I go to "/javascripts/require_from_assets_gem.js"
+    Then I should see 'alert("imported");'
+
+    When I go to "/stylesheets/require_from_assets_gem.css"
+    Then I should see "background: #fd0;"
+
+
+  Scenario: Assets are requirable from a custom vendor dir
+    Given the Server is running
+
+    When I go to "/javascripts/require_from_vendor.js"
+    Then I should see "console.log('vendor');"
+
+    When I go to "/stylesheets/require_from_vendor.css"
+    Then I should see "content: 'vendor';"
+
+  Scenario: Gem images have correct path in preview
+    Given the Server is running
+
+    When I go to "/stylesheets/require_from_vendor.css"
+    Then I should see "url(/assets/images/vendor_gem/logo.png)"
+
+
+  Scenario: Gem images have correct path in build
+    Given a successfully built app
+    When I cd to "build"
+    Then the following files should exist:
+      | stylesheets/require_from_vendor.css |
+      | assets/images/vendor_gem/logo.png |
+    And the file "stylesheets/require_from_vendor.css" should contain 'url(/assets/images/vendor_gem/logo.png)'
+
+  Scenario: Gem images have correct paths when :relative_assets is activated
+    And a file named "config.rb" with:
+      """
+      activate :sprockets
+      sprockets.append_path File.join(root, 'vendor')
+
+      activate :relative_assets
+      """
+    And the Server is running
+
+    When I go to "/stylesheets/require_from_vendor.css"
+    Then I should see 'url(../assets/images/vendor_gem/logo.png)'