Also keep individual CssImage relations if there's no group selector …

…(same as if -one-sprite-no-group-selector:yes is specified).

lib/index.js

@@ -193,7 +193,7 @@ module.exports = function () {
                                 ['group', 'padding', 'no-group-selector', 'important'].forEach(function (propertyName) {
                                     incomingRelation.cssRule.style.removeProperty(vendorPrefix + '-sprite-' + propertyName);
                                 });
-                                if (relationSpriteInfo.noGroupSelector) {
+                                if (relationSpriteInfo.noGroupSelector || !spriteGroup.placeHolder) {
                                     // The user specified that this selector needs its own background-image/background
                                     // property pointing at the sprite rather than relying on the Html elements also being
                                     // matched by the sprite group's "main" selector, which would have been preferable.

test/spriteBackgroundImages-test.js

@@ -4,9 +4,9 @@ var vows = require('vows'),
     transforms = AssetGraph.transforms;
 
 vows.describe('Sprite background images').addBatch({
-    'After loading a test case with images and spriting instructions': {
+    'After loading a simple test case with images and spriting instructions': {
         topic: function () {
-            new AssetGraph({root: __dirname + '/spriteBackgroundImages'}).queue(
+            new AssetGraph({root: __dirname + '/spriteBackgroundImages/simple/'}).queue(
                 transforms.loadAssets('style.css'),
                 transforms.populate()
             ).run(this.callback);
@@ -34,7 +34,7 @@ vows.describe('Sprite background images').addBatch({
     },
     'After loading the same test case again, set the -one-sprite-image-format to jpg and sprite the background images': {
         topic: function () {
-            new AssetGraph({root: __dirname + '/spriteBackgroundImages'}).queue(
+            new AssetGraph({root: __dirname + '/spriteBackgroundImages/simple/'}).queue(
                 transforms.loadAssets('style.css'),
                 transforms.populate(),
                 function (assetGraph) {
@@ -53,5 +53,31 @@ vows.describe('Sprite background images').addBatch({
             assert.equal(jpegAssets.length, 1);
             assert.equal(jpegAssets[0].rawSrc.slice(6, 10).toString('ascii'), 'JFIF');
         }
+    },
+    'After loading a simple test case with two background-images to be sprited, but with no group selector': {
+        topic: function () {
+            new AssetGraph({root: __dirname + '/spriteBackgroundImages/noGroupSelector/'}).queue(
+                transforms.loadAssets('style.css'),
+                transforms.populate()
+            ).run(this.callback);
+        },
+        'the graph contains 2 Pngs': function (assetGraph) {
+            assert.equal(assetGraph.findAssets({type: 'Png'}).length, 2);
+        },
+        'then spriting the background images': {
+            topic: function (assetGraph) {
+                assetGraph.queue(require('../lib')()).run(this.callback);
+            },
+            'the number of Png assets should be down to one': function (assetGraph) {
+                assert.equal(assetGraph.findAssets({type: 'Png'}).length, 1);
+            },
+            'the graph should contain 2 CssImage relations': function (assetGraph) {
+                assert.equal(assetGraph.findRelations({type: 'CssImage'}).length, 2);
+            },
+            'the stylesheet should have the expected contents': function (assetGraph) {
+                assert.equal(assetGraph.findAssets({type: 'Css'})[0].text,
+                             '.icon-foo{background-image:url(20.png);background-position:0 0}.icon-bar{background-image:url(20.png);background-position:-12px 0}');
+            }
+        }
     }
 })['export'](module);

test/spriteBackgroundImages/noGroupSelector/style.css

@@ -0,0 +1,9 @@
+.icon-foo {
+    -one-sprite-group: icons;
+    background-image: url(foo.png);
+}
+
+.icon-bar {
+    -one-sprite-group: icons;
+    background-image: url(bar.png);
+}