Cleanup

Author: simonihmig

lib/__tests__/__snapshots__/transform.js.snap

@@ -5,7 +5,7 @@ exports[`classic components basic 1`] = `
 
     export default Component.extend({
     });
-
+  
 ~~~~~~~~~~
 foo
 ~~~~~~~~~~
@@ -15,21 +15,21 @@ foo
     export default Component.extend({
         tagName: \\"\\"
     });
-
+  
 ~~~~~~~~~~
 <div ...attributes>
   foo
 </div>
 =========="
 `;
 
-exports[`handles \`ariaRole\` correctly 1`] = `
+exports[`classic components handles \`ariaRole\` correctly 1`] = `
 "==========
 
     export default Component.extend({
       ariaRole: 'button',
     });
-
+  
 ~~~~~~~~~~
 foo
 ~~~~~~~~~~
@@ -39,21 +39,21 @@ foo
     export default Component.extend({
       tagName: \\"\\",
     });
-
+  
 ~~~~~~~~~~
 <div role=\\"button\\" ...attributes>
   foo
 </div>
 =========="
 `;
 
-exports[`handles \`attributeBindings\` correctly 1`] = `
+exports[`classic components handles \`attributeBindings\` correctly 1`] = `
 "==========
 
     export default Component.extend({
       attributeBindings: ['foo', 'bar:baz'],
     });
-
+  
 ~~~~~~~~~~
 foo
 ~~~~~~~~~~
@@ -63,7 +63,7 @@ foo
     export default Component.extend({
       tagName: \\"\\",
     });
-
+  
 ~~~~~~~~~~
 <div foo={{this.foo}} baz={{this.bar}} ...attributes>
   foo
@@ -77,7 +77,7 @@ exports[`classic components handles \`classNameBindings\` correctly 1`] = `
     export default Component.extend({
       classNameBindings: ['a:b', 'x:y:z', 'foo::bar'],
     });
-
+  
 ~~~~~~~~~~
 foo
 ~~~~~~~~~~
@@ -87,7 +87,7 @@ foo
     export default Component.extend({
       tagName: \\"\\",
     });
-
+  
 ~~~~~~~~~~
 <div class=\\"{{if this.a \\"b\\"}} {{if this.x \\"y\\" \\"z\\"}} {{unless this.foo \\"bar\\"}}\\" ...attributes>
   foo
@@ -101,7 +101,7 @@ exports[`classic components handles \`classNames\` correctly 1`] = `
     export default Component.extend({
       classNames: ['foo', 'bar:baz'],
     });
-
+  
 ~~~~~~~~~~
 foo
 ~~~~~~~~~~
@@ -111,7 +111,7 @@ foo
     export default Component.extend({
       tagName: \\"\\",
     });
-
+  
 ~~~~~~~~~~
 <div class=\\"foo bar:baz\\" ...attributes>
   foo
@@ -125,7 +125,7 @@ exports[`classic components handles \`elementId\` correctly 1`] = `
     export default Component.extend({
       elementId: 'qux',
     });
-
+  
 ~~~~~~~~~~
 foo
 ~~~~~~~~~~
@@ -135,7 +135,7 @@ foo
     export default Component.extend({
       tagName: \\"\\",
     });
-
+  
 ~~~~~~~~~~
 <div id=\\"qux\\" ...attributes>
   foo
@@ -149,7 +149,7 @@ exports[`classic components handles \`hasComponentCSS\` option correctly 1`] = `
     export default Component.extend({
       classNames: ['foo', 'bar:baz'],
     });
-
+  
 ~~~~~~~~~~
 foo
 ~~~~~~~~~~
@@ -159,7 +159,7 @@ foo
     export default Component.extend({
       tagName: \\"\\",
     });
-
+  
 ~~~~~~~~~~
 <div class=\\"{{styleNamespace}} foo bar:baz\\" ...attributes>
   foo
@@ -173,7 +173,7 @@ exports[`classic components handles single \`classNames\` item correctly 1`] = `
     export default Component.extend({
       classNames: ['foo'],
     });
-
+  
 ~~~~~~~~~~
 foo
 ~~~~~~~~~~
@@ -183,7 +183,7 @@ foo
     export default Component.extend({
       tagName: \\"\\",
     });
-
+  
 ~~~~~~~~~~
 <div class=\\"foo\\" ...attributes>
   foo
@@ -223,7 +223,7 @@ exports[`classic components replaces existing \`tagName\` 1`] = `
     export default Component.extend({
       tagName: 'span',
     });
-
+  
 ~~~~~~~~~~
 foo
 ~~~~~~~~~~
@@ -233,7 +233,7 @@ foo
     export default Component.extend({
       tagName: \\"\\",
     });
-
+  
 ~~~~~~~~~~
 <span ...attributes>
   foo
@@ -246,7 +246,7 @@ exports[`native components basic 1`] = `
 
       export default class FooComponent extends Component {
       }
-
+  
 ~~~~~~~~~~
 foo
 ~~~~~~~~~~
@@ -257,7 +257,7 @@ foo
       @tagName(\\"\\")
       export default class FooComponent extends Component {
       }
-
+  
 ~~~~~~~~~~
 <div ...attributes>
   foo
@@ -334,7 +334,7 @@ exports[`native components handles \`@attributeBindings\` correctly 1`] = `
       @attributeBindings('foo', 'bar:baz')
       export default class FooComponent extends Component {
       }
-
+    
 ~~~~~~~~~~
 foo
 ~~~~~~~~~~
@@ -346,7 +346,7 @@ foo
       @tagName(\\"\\")
       export default class FooComponent extends Component {
       }
-
+    
 ~~~~~~~~~~
 <div foo={{this.foo}} baz={{this.bar}} ...attributes>
   foo
@@ -449,7 +449,7 @@ exports[`native components handles \`elementId\` correctly 1`] = `
       export default class FooComponent extends Component {
         elementId = 'qux';
       }
-
+    
 ~~~~~~~~~~
 foo
 ~~~~~~~~~~
@@ -459,7 +459,7 @@ foo
       import { tagName } from \\"@ember-decorators/component\\";
       @tagName(\\"\\")
       export default class FooComponent extends Component {}
-
+    
 ~~~~~~~~~~
 <div id=\\"qux\\" ...attributes>
   foo
@@ -557,7 +557,7 @@ exports[`native components replaces existing \`tagName\` 1`] = `
       @tagName('span')
       export default class FooComponent extends Component {
       }
-
+    
 ~~~~~~~~~~
 foo
 ~~~~~~~~~~
@@ -569,7 +569,7 @@ foo
       @tagName(\\"\\")
       export default class FooComponent extends Component {
       }
-
+    
 ~~~~~~~~~~
 <span ...attributes>
   foo

lib/__tests__/transform.js

@@ -111,31 +111,20 @@ describe('classic components', function() {
     expect(generateSnapshot(source, template)).toMatchSnapshot();
   });
 
-test('handles `ariaRole` correctly', () => {
-  let source = `
+  test('handles `ariaRole` correctly', () => {
+    let source = `
     export default Component.extend({
       ariaRole: 'button',
     });
   `;
 
-  let template = `foo`;
-
-  expect(generateSnapshot(source, template)).toMatchSnapshot();
-});
-
-test('throws if `Component.extend({ ... })` is not found', () => {
-  let source = `
-    export default class extends Component {
-    }
-  `;
+    let template = `foo`;
 
-  expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
-    `"Unsupported component type. Only classic components (\`Component.extend({ ... }\`) are supported currently."`
-  );
-});
+    expect(generateSnapshot(source, template)).toMatchSnapshot();
+  });
 
-test('throws if `Component.extend({ ... })` argument is not found', () => {
-  let source = `
+  test('throws if `Component.extend({ ... })` argument is not found', () => {
+    let source = `
     export default Component.extend();
   `;
 
@@ -215,22 +204,22 @@ test('throws if `Component.extend({ ... })` argument is not found', () => {
     );
   });
 
-test('throws if component is using a computed property for `ariaRole`', () => {
-  let source = `
+  test('throws if component is using a computed property for `ariaRole`', () => {
+    let source = `
     export default Component.extend({
       ariaRole: computed(function() {
         return 'button';
       }),
     });
   `;
 
-  expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
-    `"Codemod does not support computed properties for \`ariaRole\`."`
-  );
-});
+    expect(() => transform(source, '')).toThrowErrorMatchingInlineSnapshot(
+      `"Codemod does not support computed properties for \`ariaRole\`."`
+    );
+  });
 
-test('multi-line template', () => {
-  let source = `export default Component.extend({});`;
+  test('multi-line template', () => {
+    let source = `export default Component.extend({});`;
 
     let template = `
 {{#if this.foo}}

lib/transform/native.js

@@ -122,16 +122,6 @@ module.exports = function transformNativeComponent(root, options) {
   // set `@tagName('')`
   addClassDecorator(exportDefaultDeclaration, 'tagName', [j.stringLiteral('')]);
   ensureImport(root, 'tagName', '@ember-decorators/component');
-  // let tagNamePath = j(classBody)
-  //   .find(j.ClassProperty)
-  //   // .filter(path => path.parentPath === properties)
-  //   .filter(path => isProperty(path, 'tagName'));
-  //
-  // if (tagNamePath.length === 1) {
-  //   j(tagNamePath.get('value')).replaceWith(j.stringLiteral(''));
-  // } else {
-  //   classBody.unshift(j.classProperty(j.identifier('tagName'), j.stringLiteral('')));
-  // }
 
   // remove `elementId`, `attributeBindings`, `classNames` and `classNameBindings`
   j(classBody)

lib/transform/template.js

@@ -1,4 +1,4 @@
-const { indentLines } = require('../utils/classic');
+const { indentLines } = require('../utils/template');
 
 const templateRecast = require('ember-template-recast');
 

lib/utils/classic.js

@@ -91,13 +91,6 @@ function findClassNameBindings(properties) {
   return classNameBindings;
 }
 
-function indentLines(content) {
-  return content
-    .split('\n')
-    .map(it => `  ${it}`)
-    .join('\n');
-}
-
 module.exports = {
   isProperty,
   isMethod,
@@ -109,5 +102,4 @@ module.exports = {
   findClassNameBindings,
   findElementId,
   findTagName,
-  indentLines,
 };

lib/utils/native.js

@@ -178,13 +178,6 @@ function removeDecorator(root, classDeclaration, name, source) {
   }
 }
 
-function indentLines(content) {
-  return content
-    .split('\n')
-    .map(it => `  ${it}`)
-    .join('\n');
-}
-
 function ensureImport(root, name, source) {
   let body = root.get().value.program.body;
 
@@ -225,7 +218,6 @@ function removeImport(root, name, source) {
       .remove();
 
     if (declaration.get().value.specifiers.length === 0) {
-      // console.log(root.get('program', 'body'))
       declaration.remove();
     }
   }
@@ -278,5 +270,4 @@ module.exports = {
   removeDecorator,
   ensureImport,
   removeImport,
-  indentLines,
 };

lib/utils/template.js

@@ -0,0 +1,10 @@
+function indentLines(content) {
+  return content
+    .split('\n')
+    .map(it => `  ${it}`)
+    .join('\n');
+}
+
+module.exports = {
+  indentLines,
+};