From 6840c5e2bbe65e27828bf8d5666afe824d9534c2 Mon Sep 17 00:00:00 2001
From: Mark David Avery <mark@webark.cc>
Date: Fri, 24 Feb 2017 11:10:58 -0800
Subject: [PATCH] fix(scss @ rules): now allowing namespaceing of rules deinfed
 inside of a scss @ for rule. Fixes #216

---
 ember-cli-build.js                                    |  8 +++++---
 package.json                                          |  1 +
 tests/acceptance/scss-test.js                         | 11 +++++++++++
 tests/dummy/app/components/scss/for-loop/component.js |  9 +++++++++
 tests/dummy/app/components/scss/for-loop/styles.scss  |  5 +++++
 tests/dummy/app/components/scss/for-loop/template.hbs |  3 +++
 tests/dummy/app/scss/template.hbs                     |  1 +
 7 files changed, 35 insertions(+), 3 deletions(-)
 create mode 100644 tests/dummy/app/components/scss/for-loop/component.js
 create mode 100644 tests/dummy/app/components/scss/for-loop/styles.scss
 create mode 100644 tests/dummy/app/components/scss/for-loop/template.hbs

diff --git a/ember-cli-build.js b/ember-cli-build.js
index 7b2d48e..d7bbe00 100644
--- a/ember-cli-build.js
+++ b/ember-cli-build.js
@@ -1,11 +1,13 @@
 /* eslint-env node */
 'use strict';
 
-var EmberAddon = require('ember-cli/lib/broccoli/ember-addon');
+let EmberAddon = require('ember-cli/lib/broccoli/ember-addon');
 
 module.exports = function(defaults) {
-  var app = new EmberAddon(defaults, {
-    // Add options here
+  let app = new EmberAddon(defaults, {
+    "ember-cli-babel": {
+      includePolyfill: true
+    },
   });
 
   /*
diff --git a/package.json b/package.json
index 5e71288..5ad073e 100644
--- a/package.json
+++ b/package.json
@@ -64,6 +64,7 @@
     "eslint-plugin-ember-suave": "^1.0.0",
     "loader.js": "^4.0.10",
     "no-style-files-yet": "file:./tests/dummy/lib/no-style-files-yet",
+    "postcss-selector-namespace": "^1.3.0",
     "second-test-addon": "file:./tests/dummy/lib/second-test-addon",
     "test-addon": "file:./tests/dummy/lib/test-addon"
   },
diff --git a/tests/acceptance/scss-test.js b/tests/acceptance/scss-test.js
index 3a4a107..3b30321 100644
--- a/tests/acceptance/scss-test.js
+++ b/tests/acceptance/scss-test.js
@@ -54,3 +54,14 @@ test('mixin psudo elements do not get scoped', function(assert) {
     assert.equal(item.css('color'), 'rgb(0, 0, 6)');
   });
 });
+
+test('children of root @for rules are namspaced', function(assert) {
+  visit(`/${TYPE}`);
+
+  andThen(function() {
+    for (let index of Array(10).keys()) {
+      let item = find(`[class$=__element--${index}]`);
+      assert.equal(item.css('color'), `rgb(0, 0, ${index})`);
+    }
+  });
+});
diff --git a/tests/dummy/app/components/scss/for-loop/component.js b/tests/dummy/app/components/scss/for-loop/component.js
new file mode 100644
index 0000000..77b7315
--- /dev/null
+++ b/tests/dummy/app/components/scss/for-loop/component.js
@@ -0,0 +1,9 @@
+import Ember from 'ember';
+
+const {
+  Component,
+} = Ember;
+
+export default Component.extend({
+  items: [...Array(10).keys()],
+});
diff --git a/tests/dummy/app/components/scss/for-loop/styles.scss b/tests/dummy/app/components/scss/for-loop/styles.scss
new file mode 100644
index 0000000..cf8d1c0
--- /dev/null
+++ b/tests/dummy/app/components/scss/for-loop/styles.scss
@@ -0,0 +1,5 @@
+@for $index from 0 through 9 {
+  &__element--#{$index} {
+    color: rgb(0, 0, $index);
+  }
+}
diff --git a/tests/dummy/app/components/scss/for-loop/template.hbs b/tests/dummy/app/components/scss/for-loop/template.hbs
new file mode 100644
index 0000000..0fc04fc
--- /dev/null
+++ b/tests/dummy/app/components/scss/for-loop/template.hbs
@@ -0,0 +1,3 @@
+{{#each items as |item|}}
+  <span class="{{componentCssClassName}}__element--{{item}}"></span>
+{{/each}}
diff --git a/tests/dummy/app/scss/template.hbs b/tests/dummy/app/scss/template.hbs
index 5159d12..ef1ae71 100644
--- a/tests/dummy/app/scss/template.hbs
+++ b/tests/dummy/app/scss/template.hbs
@@ -1 +1,2 @@
 {{scss/base-rules}}
+{{scss/for-loop}}