fix(angular): add tsconfig.editor.json to catch misc files" (nrwl#3810)

.prettierignore

@@ -6,6 +6,7 @@ node_modules
 packages/workspace/src/schematics/**/files/**/*.json
 packages/workspace/src/core/dep-graph/vendor.js
 packages/angular/src/schematics/**/files/**/*.json
+packages/angular/src/migrations/**/files/**/*.json
 packages/web/src/schematics/**/files/**/*.json
 packages/node/src/schematics/**/files/**/*.json
 packages/express/src/schematics/**/files/**/*.json

packages/angular/migrations.json

@@ -38,7 +38,7 @@
     },
     "update-10-3-0": {
       "version": "10.3.0-beta.1",
-      "description": "Update jest-preset-angular library to version 8.3.1",
+      "description": "Add tsconfig.editor.json to angular apps and update jest-angular-preset",
       "factory": "./src/migrations/update-10-3-0/update-10-3-0"
     }
   },

packages/angular/src/migrations/update-10-3-0/files/tsconfig.editor.json

@@ -0,0 +1,11 @@
+{<% if (baseConfigPath) { %>
+  "extends": "<%= baseConfigPath %>",<% } %>
+  "include": ["**/*.ts"],
+  "compilerOptions": {
+    "types": [
+      <% if (usesJest) { %>"jest", <% } %>
+      <% if (usesKarma) { %>"jasmine", <% } %>
+      "node"
+    ]
+  }
+}

packages/angular/src/migrations/update-10-3-0/update-10-3-0.spec.ts

@@ -0,0 +1,189 @@
+import { callRule, runMigration } from '../../utils/testing';
+import { chain, Tree } from '@angular-devkit/schematics';
+import {
+  readJsonInTree,
+  updateJsonInTree,
+  updateWorkspace,
+} from '@nrwl/workspace';
+import { createEmptyWorkspace } from '@nrwl/workspace/testing';
+
+describe('update-10.3.0', () => {
+  describe('tsconfig.editor.json migration', () => {
+    let tree: Tree;
+    beforeAll(async () => {
+      tree = Tree.empty();
+      tree = createEmptyWorkspace(tree);
+      tree = await callRule(
+        updateWorkspace((workspace) => {
+          workspace.projects.add({
+            name: 'app1',
+            root: 'apps/app1',
+            targets: {
+              build: {
+                builder: '@angular-devkit/build-angular:browser',
+                options: {
+                  tsConfig: 'apps/app1/tsconfig.app.json',
+                },
+              },
+              test: {
+                builder: '@angular-devkit/build-angular:karma',
+              },
+            },
+          });
+          workspace.projects.add({
+            name: 'app2',
+            root: 'apps/app2',
+            targets: {
+              build: {
+                builder: '@angular-devkit/build-angular:browser',
+                options: {
+                  tsConfig: 'apps/app2/tsconfig.app.json',
+                },
+              },
+              test: {
+                builder: '@nrwl/jest:jest',
+              },
+            },
+          });
+          workspace.projects.add({
+            name: 'app3',
+            root: 'apps/app3',
+            targets: {
+              build: {
+                builder: '@angular-devkit/build-angular:browser',
+                options: {
+                  tsConfig: 'apps/app3/tsconfig.app.json',
+                },
+              },
+              test: {
+                builder: '@angular-devkit/build-angular:karma',
+              },
+              test2: {
+                builder: '@nrwl/jest:jest',
+              },
+            },
+          });
+          workspace.projects.add({
+            name: 'app4',
+            root: 'apps/app4',
+            targets: {
+              build: {
+                builder: '@angular-devkit/build-angular:browser',
+                options: {
+                  tsConfig: 'apps/app4/tsconfig.app.json',
+                },
+              },
+            },
+          });
+          workspace.projects.add({
+            name: 'app5',
+            root: 'apps/app5',
+            targets: {},
+          });
+        }),
+        tree
+      );
+      tree = await callRule(
+        chain([
+          updateJsonInTree('apps/app1/tsconfig.app.json', () => ({
+            extends: './tsconfig.json',
+          })),
+          updateJsonInTree('apps/app1/tsconfig.json', () => ({
+            references: [],
+          })),
+          updateJsonInTree('apps/app2/tsconfig.app.json', () => ({
+            extends: './tsconfig.json',
+          })),
+          updateJsonInTree('apps/app2/tsconfig.json', () => ({
+            references: [],
+          })),
+          updateJsonInTree('apps/app3/tsconfig.app.json', () => ({
+            extends: './tsconfig.json',
+          })),
+          updateJsonInTree('apps/app3/tsconfig.json', () => ({
+            references: [],
+          })),
+          updateJsonInTree('apps/app4/tsconfig.app.json', () => ({
+            extends: './tsconfig.json',
+          })),
+          updateJsonInTree('apps/app4/tsconfig.json', () => ({
+            references: [],
+          })),
+        ]),
+        tree
+      );
+      tree = await runMigration('update-10-3-0', {}, tree);
+    });
+
+    it('should create an tsconfig.editor.json for karma', async () => {
+      const tsconfig = readJsonInTree(tree, 'apps/app1/tsconfig.editor.json');
+      expect(tsconfig).toEqual({
+        compilerOptions: {
+          types: ['jasmine', 'node'],
+        },
+        extends: './tsconfig.json',
+        include: ['**/*.ts'],
+      });
+    });
+
+    it('should add references to base config', () => {
+      expect(
+        readJsonInTree(tree, 'apps/app1/tsconfig.json').references
+      ).toContainEqual({
+        path: './tsconfig.editor.json',
+      });
+      expect(
+        readJsonInTree(tree, 'apps/app2/tsconfig.json').references
+      ).toContainEqual({
+        path: './tsconfig.editor.json',
+      });
+      expect(
+        readJsonInTree(tree, 'apps/app3/tsconfig.json').references
+      ).toContainEqual({
+        path: './tsconfig.editor.json',
+      });
+      expect(
+        readJsonInTree(tree, 'apps/app4/tsconfig.json').references
+      ).toContainEqual({
+        path: './tsconfig.editor.json',
+      });
+    });
+
+    it('should create an tsconfig.editor.json for jest', async () => {
+      const tsconfig = readJsonInTree(tree, 'apps/app2/tsconfig.editor.json');
+      expect(tsconfig).toEqual({
+        compilerOptions: {
+          types: ['jest', 'node'],
+        },
+        extends: './tsconfig.json',
+        include: ['**/*.ts'],
+      });
+    });
+
+    it('should create an tsconfig.editor.json for jest and karma', async () => {
+      const tsconfig = readJsonInTree(tree, 'apps/app3/tsconfig.editor.json');
+      expect(tsconfig).toEqual({
+        compilerOptions: {
+          types: ['jest', 'jasmine', 'node'],
+        },
+        extends: './tsconfig.json',
+        include: ['**/*.ts'],
+      });
+    });
+
+    it('should create an tsconfig.editor.json for no unit test runners', async () => {
+      const tsconfig = readJsonInTree(tree, 'apps/app4/tsconfig.editor.json');
+      expect(tsconfig).toEqual({
+        compilerOptions: {
+          types: ['node'],
+        },
+        extends: './tsconfig.json',
+        include: ['**/*.ts'],
+      });
+    });
+
+    it('should not create a tsconfig.editor.json for non-angular projects', async () => {
+      expect(tree.exists('apps/app5/tsconfig.editor.json')).toBeFalsy();
+    });
+  });
+});

packages/angular/src/migrations/update-10-3-0/update-10-3-0.ts

@@ -1,13 +1,119 @@
-import { chain } from '@angular-devkit/schematics';
-import { formatFiles, updatePackagesInPackageJson } from '@nrwl/workspace';
-import { join } from 'path';
+import {
+  apply,
+  chain,
+  mergeWith,
+  move,
+  Rule,
+  template,
+  Tree,
+  url,
+} from '@angular-devkit/schematics';
+import {
+  formatFiles,
+  getWorkspace,
+  readJsonInTree,
+  updateJsonInTree,
+  updatePackagesInPackageJson,
+} from '@nrwl/workspace';
+import { ProjectDefinition } from '@angular-devkit/core/src/workspace';
+import { join as pathJoin } from 'path';
+
+import {
+  dirname,
+  join,
+  normalize,
+  Path,
+  relative,
+  resolve,
+} from '@angular-devkit/core';
+
+function relativePath(path1: Path, path2: Path) {
+  let path = relative(
+    resolve(normalize('/'), normalize(path1)),
+    resolve(normalize('/'), path2)
+  );
+  if (!path.startsWith('../')) {
+    path = ('./' + path) as Path;
+  }
+  return path;
+}
+
+function createEditorTsConfig(
+  project: ProjectDefinition,
+  baseConfig: Path | null
+): Rule {
+  let usesJest = false;
+  let usesKarma = false;
+  for (let [_, targetConfig] of project.targets) {
+    if (targetConfig.builder === '@nrwl/jest:jest') {
+      usesJest = usesJest || true;
+    } else if (targetConfig.builder === '@angular-devkit/build-angular:karma') {
+      usesKarma = usesKarma || true;
+    }
+  }
+  let relativeBaseConfigPath = baseConfig
+    ? relativePath(normalize(project.root), baseConfig)
+    : null;
+
+  return mergeWith(
+    apply(url('./files'), [
+      template({
+        usesJest,
+        usesKarma,
+        baseConfigPath: relativeBaseConfigPath,
+      }),
+      move(project.root),
+    ])
+  );
+}
+
+function updateBaseConfig(project: ProjectDefinition, baseConfig: Path): Rule {
+  return updateJsonInTree(baseConfig, (json) => {
+    json.references.push({
+      path: relativePath(
+        dirname(baseConfig),
+        join(normalize(project.root), 'tsconfig.editor.json')
+      ),
+    });
+    return json;
+  });
+}
+
+async function createEditorTsConfigs(host: Tree) {
+  const workspace = await getWorkspace(host);
+  const rules = [];
+  workspace.projects.forEach((project) => {
+    project.targets.forEach((target) => {
+      if (target.builder === '@angular-devkit/build-angular:browser') {
+        const baseConfig = target.options?.tsConfig
+          ? resolve(
+              dirname(normalize(target.options.tsConfig as string)),
+              readJsonInTree(host, target.options.tsConfig as string).extends
+            )
+          : null;
+        if (
+          baseConfig &&
+          !Array.isArray(readJsonInTree(host, baseConfig).references)
+        ) {
+          return;
+        }
+        rules.push(createEditorTsConfig(project, baseConfig));
+        if (baseConfig) {
+          rules.push(updateBaseConfig(project, baseConfig));
+        }
+      }
+    });
+  });
+  return chain(rules);
+}
 
 export default function () {
   return chain([
     updatePackagesInPackageJson(
-      join(__dirname, '../../../migrations.json'),
+      pathJoin(__dirname, '../../../migrations.json'),
       '10.3.0'
     ),
+    createEditorTsConfigs,
     formatFiles(),
   ]);
 }