Close #109 Modular lint (#643)

* lint changed files * abstract jest-runner-eslint + add onlyDiff option * added tests & fixture files + default is onlyDiff * add changeset + fix js fixture * updated index.test and app.test tests * update jest-runner-eslint folder name in pkg json * use git config default branch if no remote origin * use ternary * update yarn.lock * update getworkspaceinfo snapshot * clean up snapshot * moved jest.setTimeout + eslint-config-modular-app * refresh yarn * use modular lint in lint-staged * delete config.js file and move into index.js * update snapshot * update snapshots Co-authored-by: Cang Truong <[email protected]> Co-authored-by: Luke Sheard <[email protected]>
jpmorganchase · Jul 23, 2021 · 89574bc · 89574bc
1 parent 429b124
commit 89574bc
Show file tree

Hide file tree

Showing 24 changed files with 720 additions and 366 deletions.
diff --git a/.changeset/three-parrots-divide.md b/.changeset/three-parrots-divide.md
@@ -0,0 +1,7 @@
+---
+'modular-scripts': minor
+---
+
+Added `modular lint` command which tests diffed files against eslint and reports
+on passing and failing files, set to not tolerate any warnings and cache
+results.
diff --git a/modular/setupTests.ts b/modular/setupTests.ts
@@ -1 +1,4 @@
 import '@testing-library/jest-dom';
+
+// Certain tests perform installs that take a while
+jest.setTimeout(10 * 60 * 1000);
diff --git a/package.json b/package.json
@@ -9,7 +9,7 @@
   },
   "scripts": {
     "format": "prettier --write .",
-    "lint": "eslint --cache --ext .js,.ts,.tsx --max-warnings 0",
+    "lint": "yarn modular lint",
     "lint:fix": "yarn lint --fix",
     "create-modular-react-app": "ts-node packages/create-modular-react-app/src/cli.ts",
     "modular": "ts-node packages/modular-scripts/src/cli.ts",
@@ -66,7 +66,8 @@
     "type": "root"
   },
   "lint-staged": {
-    "*.{js,ts,tsx}": "eslint --cache --ext .js,.ts,.tsx --max-warnings 0"
+    "*.{ts,tsx}": "yarn typecheck",
+    "*.{js,ts,tsx}": "yarn lint"
   },
   "resolutions": {
     "rollup": "^2.38.3",

diff --git a/packages/create-modular-react-app/src/__tests__/cli.test.ts b/packages/create-modular-react-app/src/__tests__/cli.test.ts
@@ -4,9 +4,6 @@ import * as path from 'path';
 import * as tmp from 'tmp';
 import tree from 'tree-view-for-tests';
 
-// this can take a while...
-jest.setTimeout(10 * 60 * 1000);
-
 describe('Creating a new modular app via the CLI', () => {
   let cwd: string;
   beforeEach(async () => {

diff --git a/packages/create-modular-react-app/src/__tests__/index.test.ts b/packages/create-modular-react-app/src/__tests__/index.test.ts
@@ -4,8 +4,6 @@ import path from 'path';
 import tree from 'tree-view-for-tests';
 import tmp from 'tmp';
 
-jest.setTimeout(10 * 60 * 1000);
-
 // We want to omit any information that makes our snapshots
 // fragile and therefore censor the author and package versions
 // using `?`.
@@ -98,54 +96,53 @@ describe('create-modular-react-app', () => {
     expect(
       await readCensoredPackageJson(path.join(destination, 'package.json')),
     ).toMatchInlineSnapshot(`
-                  Object {
-                    "author": "?",
-                    "dependencies": Object {
-                      "@testing-library/dom": "?",
-                      "@testing-library/jest-dom": "?",
-                      "@testing-library/react": "?",
-                      "@testing-library/user-event": "?",
-                      "@types/jest": "?",
-                      "@types/node": "?",
-                      "@types/react": "?",
-                      "@types/react-dom": "?",
-                      "eslint": "?",
-                      "eslint-config-modular-app": "?",
-                      "modular-scripts": "?",
-                      "prettier": "?",
-                      "react": "?",
-                      "react-dom": "?",
-                      "typescript": "?",
-                    },
-                    "eslintConfig": Object {
-                      "extends": "modular-app",
-                    },
-                    "license": "MIT",
-                    "main": "index.js",
-                    "modular": Object {
-                      "type": "root",
-                    },
-                    "name": "test-repo",
-                    "prettier": Object {
-                      "printWidth": 80,
-                      "proseWrap": "always",
-                      "singleQuote": true,
-                      "trailingComma": "all",
-                    },
-                    "private": true,
-                    "scripts": Object {
-                      "build": "modular build app",
-                      "lint": "eslint . --ext .js,.ts,.tsx",
-                      "prettier": "prettier --write .",
-                      "start": "modular start app",
-                      "test": "modular test",
-                    },
-                    "version": "1.0.0",
-                    "workspaces": Array [
-                      "packages/**",
-                    ],
-                  }
-              `);
+      Object {
+        "author": "?",
+        "dependencies": Object {
+          "@testing-library/dom": "?",
+          "@testing-library/jest-dom": "?",
+          "@testing-library/react": "?",
+          "@testing-library/user-event": "?",
+          "@types/jest": "?",
+          "@types/node": "?",
+          "@types/react": "?",
+          "@types/react-dom": "?",
+          "eslint-config-modular-app": "?",
+          "modular-scripts": "?",
+          "prettier": "?",
+          "react": "?",
+          "react-dom": "?",
+          "typescript": "?",
+        },
+        "eslintConfig": Object {
+          "extends": "modular-app",
+        },
+        "license": "MIT",
+        "main": "index.js",
+        "modular": Object {
+          "type": "root",
+        },
+        "name": "test-repo",
+        "prettier": Object {
+          "printWidth": 80,
+          "proseWrap": "always",
+          "singleQuote": true,
+          "trailingComma": "all",
+        },
+        "private": true,
+        "scripts": Object {
+          "build": "modular build app",
+          "lint": "eslint . --ext .js,.ts,.tsx",
+          "prettier": "prettier --write .",
+          "start": "modular start app",
+          "test": "modular test",
+        },
+        "version": "1.0.0",
+        "workspaces": Array [
+          "packages/**",
+        ],
+      }
+    `);
     expect(
       await readCensoredPackageJson(
         path.join(destination, 'packages', 'app', 'package.json'),
@@ -219,54 +216,53 @@ describe('create-modular-react-app', () => {
     expect(
       await readCensoredPackageJson(path.join(destination, 'package.json')),
     ).toMatchInlineSnapshot(`
-                  Object {
-                    "author": "?",
-                    "dependencies": Object {
-                      "@testing-library/dom": "?",
-                      "@testing-library/jest-dom": "?",
-                      "@testing-library/react": "?",
-                      "@testing-library/user-event": "?",
-                      "@types/jest": "?",
-                      "@types/node": "?",
-                      "@types/react": "?",
-                      "@types/react-dom": "?",
-                      "eslint": "?",
-                      "eslint-config-modular-app": "?",
-                      "modular-scripts": "?",
-                      "prettier": "?",
-                      "react": "?",
-                      "react-dom": "?",
-                      "typescript": "?",
-                    },
-                    "eslintConfig": Object {
-                      "extends": "modular-app",
-                    },
-                    "license": "MIT",
-                    "main": "index.js",
-                    "modular": Object {
-                      "type": "root",
-                    },
-                    "name": "test-repo",
-                    "prettier": Object {
-                      "printWidth": 80,
-                      "proseWrap": "always",
-                      "singleQuote": true,
-                      "trailingComma": "all",
-                    },
-                    "private": true,
-                    "scripts": Object {
-                      "build": "modular build app",
-                      "lint": "eslint . --ext .js,.ts,.tsx",
-                      "prettier": "prettier --write .",
-                      "start": "modular start app",
-                      "test": "modular test",
-                    },
-                    "version": "1.0.0",
-                    "workspaces": Array [
-                      "packages/**",
-                    ],
-                  }
-              `);
+      Object {
+        "author": "?",
+        "dependencies": Object {
+          "@testing-library/dom": "?",
+          "@testing-library/jest-dom": "?",
+          "@testing-library/react": "?",
+          "@testing-library/user-event": "?",
+          "@types/jest": "?",
+          "@types/node": "?",
+          "@types/react": "?",
+          "@types/react-dom": "?",
+          "eslint-config-modular-app": "?",
+          "modular-scripts": "?",
+          "prettier": "?",
+          "react": "?",
+          "react-dom": "?",
+          "typescript": "?",
+        },
+        "eslintConfig": Object {
+          "extends": "modular-app",
+        },
+        "license": "MIT",
+        "main": "index.js",
+        "modular": Object {
+          "type": "root",
+        },
+        "name": "test-repo",
+        "prettier": Object {
+          "printWidth": 80,
+          "proseWrap": "always",
+          "singleQuote": true,
+          "trailingComma": "all",
+        },
+        "private": true,
+        "scripts": Object {
+          "build": "modular build app",
+          "lint": "eslint . --ext .js,.ts,.tsx",
+          "prettier": "prettier --write .",
+          "start": "modular start app",
+          "test": "modular test",
+        },
+        "version": "1.0.0",
+        "workspaces": Array [
+          "packages/**",
+        ],
+      }
+    `);
     expect(
       await readCensoredPackageJson(
         path.join(destination, 'packages', 'app', 'package.json'),

diff --git a/packages/create-modular-react-app/src/index.ts b/packages/create-modular-react-app/src/index.ts
@@ -120,7 +120,6 @@ export default function createModularApp(argv: {
       'react-dom',
       'prettier',
       'modular-scripts',
-      'eslint',
       'eslint-config-modular-app',
       'typescript@^4.1.2',
     ],

diff --git a/packages/modular-scripts/jest-runner-eslint/index.js b/packages/modular-scripts/jest-runner-eslint/index.js
@@ -0,0 +1,18 @@
+'use strict';
+
+const { createJestRunner } = require('create-jest-runner');
+
+const runner = createJestRunner(
+  require.resolve('jest-runner-eslint/build/runner/runESLint'),
+  {
+    getExtraOptions: () => ({
+      cache: true,
+      maxWarnings: 0,
+      fix: process.env.MODULAR_LINT_FIX
+        ? process.env.MODULAR_LINT_FIX.toLowerCase() === 'true'
+        : false,
+    }),
+  },
+);
+
+module.exports = runner;
diff --git a/packages/modular-scripts/package.json b/packages/modular-scripts/package.json
@@ -52,6 +52,7 @@
     "esbuild": "^0.12.15",
     "esbuild-loader": "^2.13.0",
     "escape-string-regexp": "2.0.0",
+    "eslint": "^7.31.0",
     "execa": "^5.1.1",
     "file-loader": "6.2.0",
     "filesize": "7.0.0",
@@ -67,6 +68,7 @@
     "jest": "26.6.0",
     "jest-circus": "26.6.0",
     "jest-config": "^26.6.3",
+    "jest-runner-eslint": "^0.10.1",
     "jest-transform-stub": "^2.0.0",
     "jest-watch-typeahead": "0.6.4",
     "loader-utils": "2.0.0",
@@ -119,6 +121,7 @@
     "react-dev-utils",
     "types",
     "tsconfig.json",
+    "jest-runner-eslint",
     "*.js"
   ],
   "devDependencies": {

diff --git a/packages/modular-scripts/src/__tests__/__fixtures__/lint/InvalidJS.js b/packages/modular-scripts/src/__tests__/__fixtures__/lint/InvalidJS.js
@@ -0,0 +1,13 @@
+/* eslint-disable */
+
+const path = require('path');
+
+function funcHasNoType(props) {
+  let type;
+
+  if (type) {
+  } else {
+  }
+
+  const emptyFunc = () => {};
+}
diff --git a/packages/modular-scripts/src/__tests__/__fixtures__/lint/InvalidJSX.jsx b/packages/modular-scripts/src/__tests__/__fixtures__/lint/InvalidJSX.jsx
@@ -0,0 +1,9 @@
+/* eslint-disable */
+
+import { useEffect } from 'react';
+
+export function BadComponent(props) {
+  if (props.name) {
+    useEffect(() => {});
+  }
+}
diff --git a/packages/modular-scripts/src/__tests__/__fixtures__/lint/InvalidTS.ts b/packages/modular-scripts/src/__tests__/__fixtures__/lint/InvalidTS.ts
@@ -0,0 +1,14 @@
+//@ts-nocheck
+/* eslint-disable */
+
+interface Props {}
+
+export function funcHasNoType(props: Props) {
+  const type: any = '';
+
+  if (type) {
+  } else {
+  }
+
+  const emptyFunc = () => {};
+}
diff --git a/packages/modular-scripts/src/__tests__/__fixtures__/lint/InvalidTSX.tsx b/packages/modular-scripts/src/__tests__/__fixtures__/lint/InvalidTSX.tsx
@@ -0,0 +1,12 @@
+//@ts-nocheck
+/* eslint-disable */
+
+import { useEffect } from 'react';
+
+export function BadComponent(props) {
+  if (props.name) {
+    useEffect(function logMe() {
+      console.log('Me!');
+    });
+  }
+}