feat(angular): allow migrating angular cli workspaces using the @angu…

…lar-eslint/builder:lint builder
nrwl · Apr 11, 2022 · f5b3ab0 · f5b3ab0
1 parent 7839ed0
commit f5b3ab0
Show file tree

Hide file tree

Showing 13 changed files with 878 additions and 240 deletions.
diff --git a/e2e/angular-core/src/ng-add.test.ts b/e2e/angular-core/src/ng-add.test.ts
@@ -55,6 +55,10 @@ describe('convert Angular CLI workspace to an Nx workspace', () => {
     runNgAdd('@cypress/schematic', '--e2e-update', 'latest');
   }
 
+  function addEsLint() {
+    runNgAdd('@angular-eslint/schematics', undefined, 'latest');
+  }
+
   beforeEach(() => {
     project = uniq('proj');
     packageManager = getSelectedPackageManager();
@@ -387,6 +391,44 @@ describe('convert Angular CLI workspace to an Nx workspace', () => {
     });
   });
 
+  // TODO(leo): The current Verdaccio setup fails to resolve older versions
+  // of @nrwl/* packages, the @angular-eslint/builder package depends on an
+  // older version of @nrwl/devkit so we skip this test for now.
+  it.skip('should handle a workspace with ESLint', () => {
+    addEsLint();
+
+    runNgAdd('@nrwl/angular', '--npm-scope projscope');
+
+    checkFilesExist(`apps/${project}/.eslintrc.json`, `.eslintrc.json`);
+
+    const projectConfig = readJson(`apps/${project}/project.json`);
+    expect(projectConfig.targets.lint).toStrictEqual({
+      executor: '@nrwl/linter:eslint',
+      options: {
+        lintFilePatterns: [
+          `apps/${project}/src/**/*.ts`,
+          `apps/${project}/src/**/*.html`,
+        ],
+      },
+    });
+
+    let output = runCLI(`lint ${project}`);
+    expect(output).toContain(`> nx run ${project}:lint`);
+    expect(output).toContain('All files pass linting.');
+    expect(output).toContain(
+      `Successfully ran target lint for project ${project}`
+    );
+
+    output = runCLI(`lint ${project}`);
+    expect(output).toContain(
+      `> nx run ${project}:lint  [existing outputs match the cache, left as is]`
+    );
+    expect(output).toContain('All files pass linting.');
+    expect(output).toContain(
+      `Successfully ran target lint for project ${project}`
+    );
+  });
+
   it('should support --preserve-angular-cli-layout', () => {
     // add another app and a library
     runCommand(`ng g @schematics/angular:application app2`);

diff --git a/e2e/utils/index.ts b/e2e/utils/index.ts
@@ -436,7 +436,7 @@ export function runNgAdd(
   try {
     const pmc = getPackageManagerCommand();
     packageInstall(packageName, null, version);
-    return execSync(pmc.run(`ng g ${packageName}:ng-add`, command), {
+    return execSync(pmc.run(`ng g ${packageName}:ng-add`, command ?? ''), {
       cwd: tmpProjPath(),
       env: { ...(opts.env || process.env) },
       encoding: 'utf-8',

diff --git a/packages/angular/src/generators/ng-add/__snapshots__/migrate-from-angular-cli.spec.ts.snap b/packages/angular/src/generators/ng-add/__snapshots__/migrate-from-angular-cli.spec.ts.snap
@@ -105,6 +105,17 @@ Object {
         "watch": true,
       },
     },
+    "lint": Object {
+      "executor": "@nrwl/linter:eslint",
+      "options": Object {
+        "lintFilePatterns": Array [
+          "apps/myApp-e2e/**/*.{js,ts}",
+        ],
+      },
+      "outputs": Array [
+        "{options.outputFile}",
+      ],
+    },
   },
 }
 `;
@@ -132,6 +143,29 @@ Object {
 `;
 
 exports[`workspace move to nx layout cypress should migrate e2e tests correctly 3`] = `
+Object {
+  "extends": Array [
+    "plugin:cypress/recommended",
+    "../../.eslintrc.json",
+  ],
+  "ignorePatterns": Array [
+    "!**/*",
+  ],
+  "overrides": Array [
+    Object {
+      "files": Array [
+        "*.ts",
+        "*.tsx",
+        "*.js",
+        "*.jsx",
+      ],
+      "rules": Object {},
+    },
+  ],
+}
+`;
+
+exports[`workspace move to nx layout cypress should migrate e2e tests correctly 4`] = `
 Object {
   "implicitDependencies": Array [
     "myApp",
@@ -173,6 +207,17 @@ Object {
         "watch": true,
       },
     },
+    "lint": Object {
+      "executor": "@nrwl/linter:eslint",
+      "options": Object {
+        "lintFilePatterns": Array [
+          "apps/myApp-e2e/**/*.{js,ts}",
+        ],
+      },
+      "outputs": Array [
+        "{options.outputFile}",
+      ],
+    },
   },
 }
 `;
@@ -234,10 +279,99 @@ Object {
         "watch": true,
       },
     },
+    "lint": Object {
+      "executor": "@nrwl/linter:eslint",
+      "options": Object {
+        "lintFilePatterns": Array [
+          "apps/myApp-e2e/**/*.{js,ts}",
+        ],
+      },
+      "outputs": Array [
+        "{options.outputFile}",
+      ],
+    },
   },
 }
 `;
 
+exports[`workspace move to nx layout should create a root eslint config 1`] = `
+Object {
+  "ignorePatterns": Array [
+    "**/*",
+  ],
+  "overrides": Array [
+    Object {
+      "extends": Array [
+        "plugin:@angular-eslint/recommended",
+        "plugin:@angular-eslint/template/process-inline-templates",
+      ],
+      "files": Array [
+        "*.ts",
+      ],
+      "parserOptions": Object {
+        "createDefaultProgram": true,
+      },
+      "rules": Object {
+        "@angular-eslint/component-selector": Array [
+          "error",
+          Object {
+            "prefix": "app",
+            "style": "kebab-case",
+            "type": "element",
+          },
+        ],
+        "@angular-eslint/directive-selector": Array [
+          "error",
+          Object {
+            "prefix": "app",
+            "style": "camelCase",
+            "type": "attribute",
+          },
+        ],
+      },
+    },
+    Object {
+      "extends": Array [
+        "plugin:@angular-eslint/template/recommended",
+      ],
+      "files": Array [
+        "*.html",
+      ],
+      "rules": Object {},
+    },
+    Object {
+      "files": Array [
+        "*.ts",
+        "*.tsx",
+        "*.js",
+        "*.jsx",
+      ],
+      "rules": Object {
+        "@nrwl/nx/enforce-module-boundaries": Array [
+          "error",
+          Object {
+            "allow": Array [],
+            "depConstraints": Array [
+              Object {
+                "onlyDependOnLibsWithTags": Array [
+                  "*",
+                ],
+                "sourceTag": "*",
+              },
+            ],
+            "enforceBuildableLibDependency": true,
+          },
+        ],
+      },
+    },
+  ],
+  "plugins": Array [
+    "@nrwl/nx",
+  ],
+  "root": true,
+}
+`;
+
 exports[`workspace move to nx layout should create nx.json 1`] = `
 Object {
   "affected": Object {
@@ -279,6 +413,59 @@ Object {
 }
 `;
 
+exports[`workspace move to nx layout should move the project eslint config 1`] = `
+Object {
+  "extends": "../../.eslintrc.json",
+  "ignorePatterns": Array [
+    "!**/*",
+  ],
+  "overrides": Array [
+    Object {
+      "extends": Array [
+        "plugin:@angular-eslint/recommended",
+        "plugin:@angular-eslint/template/process-inline-templates",
+      ],
+      "files": Array [
+        "*.ts",
+      ],
+      "parserOptions": Object {
+        "createDefaultProgram": true,
+        "project": Array [
+          "apps/myApp/tsconfig.*?.json",
+        ],
+      },
+      "rules": Object {
+        "@angular-eslint/component-selector": Array [
+          "error",
+          Object {
+            "prefix": "app",
+            "style": "kebab-case",
+            "type": "element",
+          },
+        ],
+        "@angular-eslint/directive-selector": Array [
+          "error",
+          Object {
+            "prefix": "app",
+            "style": "camelCase",
+            "type": "attribute",
+          },
+        ],
+      },
+    },
+    Object {
+      "extends": Array [
+        "plugin:@angular-eslint/template/recommended",
+      ],
+      "files": Array [
+        "*.html",
+      ],
+      "rules": Object {},
+    },
+  ],
+}
+`;
+
 exports[`workspace move to nx layout should update project configuration 1`] = `
 Object {
   "root": "apps/myApp",
@@ -291,10 +478,11 @@ Object {
       },
     },
     "lint": Object {
+      "executor": "@nrwl/linter:eslint",
       "options": Object {
-        "tsConfig": Array [
-          "apps/myApp/tsconfig.app.json",
-          "apps/myApp/tsconfig.spec.json",
+        "lintFilePatterns": Array [
+          "apps/myApp/src/**/*.ts",
+          "apps/myApp/src/**/*.html",
         ],
       },
     },