transform: Add hasComponentCSS option

Author: Turbo87

lib/__tests__/__snapshots__/transform.js.snap

@@ -119,6 +119,30 @@ foo
 =========="
 `;
 
+exports[`handles \`hasComponentCSS\` option correctly 1`] = `
+"==========
+
+    export default Component.extend({
+      classNames: ['foo', 'bar:baz'],
+    });
+  
+~~~~~~~~~~
+foo
+~~~~~~~~~~
+ => tagName: div
+~~~~~~~~~~
+
+    export default Component.extend({
+      tagName: \\"\\",
+    });
+  
+~~~~~~~~~~
+<div class=\\"{{styleNamespace}} foo bar:baz\\" ...attributes>
+  foo
+</div>
+=========="
+`;
+
 exports[`handles single \`classNames\` item correctly 1`] = `
 "==========
 

lib/__tests__/transform.js

@@ -1,7 +1,7 @@
 const { transform } = require('../transform');
 
-function generateSnapshot(source, template) {
-  let result = transform(source, template);
+function generateSnapshot(source, template, options = {}) {
+  let result = transform(source, template, options);
 
   return `==========
 ${source}
@@ -190,3 +190,15 @@ test('multi-line template', () => {
 
   expect(generateSnapshot(source, template)).toMatchSnapshot();
 });
+
+test('handles `hasComponentCSS` option correctly', () => {
+  let source = `
+    export default Component.extend({
+      classNames: ['foo', 'bar:baz'],
+    });
+  `;
+
+  let template = `foo`;
+
+  expect(generateSnapshot(source, template, { hasComponentCSS: true })).toMatchSnapshot();
+});

lib/transform.js

@@ -178,6 +178,9 @@ function transform(source, template, options = {}) {
 
   // wrap existing template with root element
   let classNodes = [];
+  if (options.hasComponentCSS) {
+    classNodes.push(b.mustache('styleNamespace'));
+  }
   for (let className of classNames) {
     classNodes.push(b.text(className));
   }