Fix linting

Author: Ives van Hoorne

.babelrc

@@ -10,7 +10,8 @@
         "babel-plugin-transform-object-rest-spread",
         "babel-plugin-transform-class-properties",
         "babel-plugin-transform-runtime",
-        "babel-plugin-lodash"
+        "babel-plugin-lodash",
+        "babel-plugin-system-import-transformer"
       ]
     }
   }

package.json

@@ -67,6 +67,8 @@
   },
   "dependencies": {
     "axios": "^0.16.1",
+    "babel-plugin-system-import": "^1.1.5",
+    "babel-plugin-system-import-transformer": "3.1.0",
     "babel-plugin-transform-async-to-generator": "^6.24.1",
     "babel-plugin-transform-decorators-legacy": "^1.3.4",
     "babel-plugin-transform-remove-strict-mode": "^0.0.2",

src/app/utils/codemirror/__snapshots__/prettify.test.js.snap

@@ -0,0 +1,18 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`prettify should prettify code 1`] = `
+"const a = '32';
+"
+`;
+
+exports[`prettify should prettify static class props 1`] = `
+"class Ives extends React.Component {
+  property = {};
+}
+"
+`;
+
+exports[`prettify should prettify syntax errors 1`] = `
+"apofdawoifefjaweoifj;
+"
+`;

src/app/utils/codemirror/prettify.js

@@ -1,17 +1,22 @@
 export default (async function prettify(code, eslintEnabled) {
   const prettier = await System.import('prettier');
-  let newCode = prettier.format(code, {
+  const prettifiedCode = prettier.format(code, {
     singleQuote: true,
     trailingComma: 'all',
   });
 
   if (eslintEnabled) {
     const { fix } = await System.import('app/utils/codemirror/eslint-lint');
     try {
-      newCode = fix(newCode).output;
+      const lintedCode = fix(prettifiedCode).output;
+
+      // If linter can't parse, it will return an empty string. Unwanted, so fall
+      // back to prettified code
+      if (lintedCode) return lintedCode;
     } catch (e) {
       console.error(e);
     }
   }
-  return newCode;
+
+  return prettifiedCode;
 });

src/app/utils/codemirror/prettify.test.js

@@ -0,0 +1,28 @@
+import prettify from './prettify';
+
+const testCode = async (code: string) => {
+  const prettified = await prettify(code);
+  expect(prettified).toMatchSnapshot();
+};
+
+describe('prettify', () => {
+  it('should prettify code', async () => {
+    await testCode(`const a='32'`);
+  });
+
+  it('should prettify static class props', async () => {
+    await testCode(
+      `
+      class Ives extends React.Component {
+        property = {
+
+        }
+      }
+    `,
+    );
+  });
+
+  it('should prettify syntax errors', async () => {
+    await testCode(`apofdawoifefjaweoifj`);
+  });
+});

yarn.lock

@@ -648,6 +648,16 @@ babel-plugin-syntax-trailing-function-commas@^6.22.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-trailing-function-commas/-/babel-plugin-syntax-trailing-function-commas-6.22.0.tgz#ba0360937f8d06e40180a43fe0d5616fff532cf3"
 
+[email protected]:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-system-import-transformer/-/babel-plugin-system-import-transformer-3.1.0.tgz#d37f0cae8e61ef39060208331d931b5e630d7c5f"
+  dependencies:
+    babel-plugin-syntax-dynamic-import "^6.18.0"
+
+babel-plugin-system-import@^1.1.5:
+  version "1.1.5"
+  resolved "https://registry.yarnpkg.com/babel-plugin-system-import/-/babel-plugin-system-import-1.1.5.tgz#d8910a7b98a289bfa92ad9c8b204ba5fe73358f0"
+
 babel-plugin-transform-async-generator-functions@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-async-generator-functions/-/babel-plugin-transform-async-generator-functions-6.24.1.tgz#f058900145fd3e9907a6ddf28da59f215258a5db"