feat(angular): support angular v16.1 (#17155)

e2e/angular-extensions/src/cypress-component-tests.test.ts

@@ -14,7 +14,8 @@ import {
 import { names } from '@nx/devkit';
 import { join } from 'path';
 
-describe('Angular Cypress Component Tests', () => {
+// TODO(leo): enable when https://github.com/cypress-io/cypress/pull/27030 is merged and released
+describe.skip('Angular Cypress Component Tests', () => {
   let projectName: string;
   const appName = uniq('cy-angular-app');
   const usedInAppLibName = uniq('cy-angular-lib');

e2e/cypress/src/cypress.test.ts

@@ -178,7 +178,8 @@ describe('env vars', () => {
     'should allow CT and e2e in the same project',
     async () => {
       await testCtAndE2eInProject('next');
-      await testCtAndE2eInProject('angular');
+      // TODO(leo): uncomment when https://github.com/cypress-io/cypress/pull/27030 is merged and released
+      // await testCtAndE2eInProject('angular');
       await testCtAndE2eInProject('react');
     },
     TEN_MINS_MS

package.json

@@ -28,19 +28,19 @@
   },
   "devDependencies": {
     "@actions/core": "^1.10.0",
-    "@angular-devkit/architect": "~0.1600.0",
-    "@angular-devkit/build-angular": "~16.0.0",
-    "@angular-devkit/core": "~16.0.0",
-    "@angular-devkit/schematics": "~16.0.0",
+    "@angular-devkit/architect": "~0.1601.0",
+    "@angular-devkit/build-angular": "~16.1.0",
+    "@angular-devkit/core": "~16.1.0",
+    "@angular-devkit/schematics": "~16.1.0",
     "@angular-eslint/eslint-plugin": "~16.0.0",
     "@angular-eslint/eslint-plugin-template": "~16.0.0",
     "@angular-eslint/template-parser": "~16.0.0",
-    "@angular/cli": "~16.0.0",
-    "@angular/common": "~16.0.0",
-    "@angular/compiler": "~16.0.0",
-    "@angular/compiler-cli": "~16.0.0",
-    "@angular/core": "~16.0.0",
-    "@angular/router": "~16.0.0",
+    "@angular/cli": "~16.1.0",
+    "@angular/common": "~16.1.0",
+    "@angular/compiler": "~16.1.0",
+    "@angular/compiler-cli": "~16.1.0",
+    "@angular/core": "~16.1.0",
+    "@angular/router": "~16.1.0",
     "@babel/core": "^7.15.0",
     "@babel/helper-create-regexp-features-plugin": "^7.14.5",
     "@babel/plugin-transform-runtime": "^7.15.0",
@@ -63,7 +63,7 @@
     "@ngrx/effects": "~16.0.0",
     "@ngrx/router-store": "~16.0.0",
     "@ngrx/store": "~16.0.0",
-    "@nguniversal/builders": "~16.0.0",
+    "@nguniversal/builders": "~16.1.0",
     "@nx/cypress": "16.4.0-beta.9",
     "@nx/devkit": "16.4.0-beta.9",
     "@nx/eslint-plugin": "16.4.0-beta.9",
@@ -86,7 +86,7 @@
     "@rollup/plugin-json": "^4.1.0",
     "@rollup/plugin-node-resolve": "^13.0.4",
     "@rollup/plugin-url": "^7.0.0",
-    "@schematics/angular": "~16.0.0",
+    "@schematics/angular": "~16.1.0",
     "@storybook/addon-essentials": "^7.0.9",
     "@storybook/core-server": "^7.0.9",
     "@storybook/react": "^7.0.9",
@@ -208,7 +208,7 @@
     "mini-css-extract-plugin": "~2.4.7",
     "minimatch": "3.0.5",
     "next-sitemap": "^3.1.10",
-    "ng-packagr": "~16.0.0",
+    "ng-packagr": "~16.1.0",
     "node-fetch": "^2.6.7",
     "nx": "16.4.0-beta.9",
     "nx-cloud": "16.0.5",
@@ -259,9 +259,9 @@
     "tsconfig-paths": "^4.1.2",
     "tsconfig-paths-webpack-plugin": "4.0.0",
     "tslint-to-eslint-config": "^2.13.0",
-    "typedoc": "0.23.28",
-    "typedoc-plugin-markdown": "3.14.0",
-    "typescript": "~5.0.2",
+    "typedoc": "0.24.8",
+    "typedoc-plugin-markdown": "3.15.3",
+    "typescript": "~5.1.3",
     "unzipper": "^0.10.11",
     "url-loader": "^4.1.1",
     "use-sync-external-store": "^1.2.0",

packages/angular/migrations.json

@@ -254,6 +254,15 @@
       },
       "description": "Remove the 'accessibility-' prefix from '@angular-eslint/eslint-plugin-template' rules.",
       "factory": "./src/migrations/update-16-4-0/rename-angular-eslint-accesibility-rules"
+    },
+    "update-angular-cli-version-16-1-0": {
+      "cli": "nx",
+      "version": "16.4.0-beta.11",
+      "requires": {
+        "@angular/core": ">=16.1.0"
+      },
+      "description": "Update the @angular/cli package version to ~16.1.0.",
+      "factory": "./src/migrations/update-16-4-0/update-angular-cli"
     }
   },
   "packageJsonUpdates": {
@@ -1159,6 +1168,67 @@
           "alwaysAddToPackageJson": false
         }
       }
+    },
+    "16.4.0": {
+      "version": "16.4.0-beta.11",
+      "x-prompt": "Do you want to update the Angular version to v16.1?",
+      "requires": {
+        "@angular/core": ">=16.0.0 <16.1.0"
+      },
+      "packages": {
+        "@angular-devkit/architect": {
+          "version": "~0.1601.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular-devkit/build-angular": {
+          "version": "~16.1.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular-devkit/build-webpack": {
+          "version": "~0.1601.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular-devkit/core": {
+          "version": "~16.1.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular-devkit/schematics": {
+          "version": "~16.1.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular/core": {
+          "version": "~16.1.0",
+          "alwaysAddToPackageJson": true
+        },
+        "@angular/material": {
+          "version": "~16.1.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular/cdk": {
+          "version": "~16.1.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@nguniversal/builders": {
+          "version": "~16.1.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@nguniversal/common": {
+          "version": "~16.1.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@nguniversal/express-engine": {
+          "version": "~16.1.0",
+          "alwaysAddToPackageJson": false
+        },
+        "@schematics/angular": {
+          "version": "~16.1.0",
+          "alwaysAddToPackageJson": false
+        },
+        "ng-packagr": {
+          "version": "~16.1.0",
+          "alwaysAddToPackageJson": false
+        }
+      }
     }
   }
 }

packages/angular/src/migrations/update-16-4-0/update-angular-cli.spec.ts

@@ -0,0 +1,42 @@
+import { readJson, Tree, writeJson } from '@nx/devkit';
+import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
+import updateAngularCli, { angularCliVersion } from './update-angular-cli';
+
+describe('update-angular-cli migration', () => {
+  let tree: Tree;
+
+  beforeEach(() => {
+    tree = createTreeWithEmptyWorkspace({ layout: 'apps-libs' });
+  });
+
+  it('should update @angular/cli version when defined as a dev dependency', async () => {
+    writeJson(tree, 'package.json', {
+      devDependencies: { '@angular/cli': '~13.3.0' },
+    });
+
+    await updateAngularCli(tree);
+
+    const { devDependencies } = readJson(tree, 'package.json');
+    expect(devDependencies['@angular/cli']).toBe(angularCliVersion);
+  });
+
+  it('should update @angular/cli version when defined as a dependency', async () => {
+    writeJson(tree, 'package.json', {
+      dependencies: { '@angular/cli': '~13.3.0' },
+    });
+
+    await updateAngularCli(tree);
+
+    const { dependencies } = readJson(tree, 'package.json');
+    expect(dependencies['@angular/cli']).toBe(angularCliVersion);
+  });
+
+  it('should not add @angular/cli to package.json when it is not set', async () => {
+    const initialPackageJson = readJson(tree, 'package.json');
+
+    await updateAngularCli(tree);
+
+    const packageJson = readJson(tree, 'package.json');
+    expect(packageJson).toStrictEqual(initialPackageJson);
+  });
+});

packages/angular/src/migrations/update-16-4-0/update-angular-cli.ts

@@ -0,0 +1,23 @@
+import { formatFiles, Tree, updateJson } from '@nx/devkit';
+
+export const angularCliVersion = '~16.1.0';
+
+export default async function (tree: Tree) {
+  let shouldFormat = false;
+
+  updateJson(tree, 'package.json', (json) => {
+    if (json.devDependencies?.['@angular/cli']) {
+      json.devDependencies['@angular/cli'] = angularCliVersion;
+      shouldFormat = true;
+    } else if (json.dependencies?.['@angular/cli']) {
+      json.dependencies['@angular/cli'] = angularCliVersion;
+      shouldFormat = true;
+    }
+
+    return json;
+  });
+
+  if (shouldFormat) {
+    await formatFiles(tree);
+  }
+}

packages/angular/src/utils/versions.ts

@@ -1,15 +1,15 @@
 export const nxVersion = require('../../package.json').version;
 
-export const angularVersion = '~16.0.0';
-export const angularDevkitVersion = '~16.0.0';
-export const ngPackagrVersion = '~16.0.0';
+export const angularVersion = '~16.1.0';
+export const angularDevkitVersion = '~16.1.0';
+export const ngPackagrVersion = '~16.1.0';
 export const ngrxVersion = '~16.0.0';
 export const rxjsVersion = '~7.8.0';
 export const zoneJsVersion = '~0.13.0';
 export const angularJsVersion = '1.7.9';
 export const tsLibVersion = '^2.3.0';
 
-export const ngUniversalVersion = '~16.0.0';
+export const ngUniversalVersion = '~16.1.0';
 export const corsVersion = '~2.8.5';
 export const typesCorsVersion = '~2.8.5';
 export const expressVersion = '~4.18.2';

packages/cypress/migrations.json

@@ -59,6 +59,12 @@
       "version": "16.4.0-beta.10",
       "description": "Remove tsconfig.e2e.json and add settings to project tsconfig.json. tsConfigs executor option is now deprecated. The project level tsconfig.json file should be used instead.",
       "implementation": "./src/migrations/update-16-4-0/tsconfig-sourcemaps"
+    },
+    "update-16-4-0-warn-incompatible-angular-cypress": {
+      "cli": "nx",
+      "version": "16.4.0-beta.11",
+      "description": "Cypress Component Testing is broken with Angular 16.1.0. Warn about it if the workspace has Angular >= 16.1.0 and Angular projects using Component Testing.",
+      "implementation": "./src/migrations/update-16-4-0/warn-incompatible-angular-cypress"
     }
   },
   "packageJsonUpdates": {

packages/cypress/src/migrations/update-16-4-0/warn-incompatible-angular-cypress.spec.ts

@@ -0,0 +1,242 @@
+import type { ProjectConfiguration, ProjectGraph, Tree } from '@nx/devkit';
+import { addProjectConfiguration, logger } from '@nx/devkit';
+import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
+import { readModulePackageJson } from 'nx/src/utils/package-json';
+import migration from './warn-incompatible-angular-cypress';
+
+jest.mock('nx/src/utils/package-json');
+let projectGraph: ProjectGraph;
+jest.mock('@nx/devkit', () => ({
+  ...jest.requireActual('@nx/devkit'),
+  createProjectGraphAsync: () => Promise.resolve(projectGraph),
+}));
+
+describe('warn-incompatible-angular-cypress migration', () => {
+  let tree: Tree;
+  let mockReadModulePackageJson: jest.Mock<
+    ReturnType<typeof readModulePackageJson>
+  > = readModulePackageJson as never;
+
+  beforeEach(() => {
+    tree = createTreeWithEmptyWorkspace({ layout: 'apps-libs' });
+    jest.resetAllMocks();
+  });
+
+  it('should not warn when Angular is not installed', async () => {
+    mockReadModulePackageJson.mockReturnValue(null);
+    addProject(
+      tree,
+      'app1',
+      {
+        root: 'apps/app1',
+        targets: {
+          'component-test': {
+            executor: '@nx/cypress:cypress',
+            options: {
+              testingType: 'component',
+            },
+          },
+        },
+      },
+      ['npm:react']
+    );
+    const loggerSpy = jest.spyOn(logger, 'warn');
+
+    await migration(tree);
+
+    expect(loggerSpy).not.toHaveBeenCalled();
+  });
+
+  it('should not warn when Angular version is lower than 16.1.0', async () => {
+    mockReadModulePackageJson.mockReturnValue({
+      packageJson: { name: '@angular/core', version: '16.0.0' },
+      path: '',
+    });
+    addProject(
+      tree,
+      'app1',
+      {
+        root: 'apps/app1',
+        targets: {
+          'component-test': {
+            executor: '@nx/cypress:cypress',
+            options: {
+              testingType: 'component',
+            },
+          },
+        },
+      },
+      ['npm:@angular/core']
+    );
+    const loggerSpy = jest.spyOn(logger, 'warn');
+
+    await migration(tree);
+
+    expect(loggerSpy).not.toHaveBeenCalled();
+  });
+
+  it('should not warn when there are no Angular projects', async () => {
+    mockReadModulePackageJson.mockReturnValue({
+      packageJson: { name: '@angular/core', version: '16.1.0' },
+      path: '',
+    });
+    addProject(
+      tree,
+      'app1',
+      {
+        root: 'apps/app1',
+        targets: {
+          'component-test': {
+            executor: '@nx/cypress:cypress',
+            options: {
+              testingType: 'component',
+            },
+          },
+        },
+      },
+      ['npm:react']
+    );
+    const loggerSpy = jest.spyOn(logger, 'warn');
+
+    await migration(tree);
+
+    expect(loggerSpy).not.toHaveBeenCalled();
+  });
+
+  it('should not warn when the Angular projects are not using Cypress Component Testing', async () => {
+    mockReadModulePackageJson.mockReturnValue({
+      packageJson: { name: '@angular/core', version: '16.1.0' },
+      path: '',
+    });
+    addProject(
+      tree,
+      'app1',
+      {
+        root: 'apps/app1',
+        targets: {
+          'component-test': {
+            executor: '@nx/cypress:cypress',
+            options: {
+              testingType: 'component',
+            },
+          },
+        },
+      },
+      ['npm:react']
+    );
+    addProject(
+      tree,
+      'app2',
+      {
+        root: 'apps/app2',
+        targets: {
+          e2e: {
+            executor: '@nx/cypress:cypress',
+            options: {
+              testingType: 'e2e',
+            },
+          },
+        },
+      },
+      ['npm:@angular/core']
+    );
+    const loggerSpy = jest.spyOn(logger, 'warn');
+
+    await migration(tree);
+
+    expect(loggerSpy).not.toHaveBeenCalled();
+  });
+
+  it('should warn when there is an Angular project using Cypress Component Testing', async () => {
+    mockReadModulePackageJson.mockReturnValue({
+      packageJson: { name: '@angular/core', version: '16.1.0' },
+      path: '',
+    });
+    addProject(
+      tree,
+      'app1',
+      {
+        root: 'apps/app1',
+        targets: {
+          'component-test': {
+            executor: '@nx/cypress:cypress',
+            options: {
+              testingType: 'component',
+            },
+          },
+        },
+      },
+      ['npm:@angular/core']
+    );
+    const loggerSpy = jest.spyOn(logger, 'warn');
+
+    await migration(tree);
+
+    expect(loggerSpy).toHaveBeenCalled();
+  });
+
+  it('should warn only once when there are multiple Angular projects using Cypress Component Testing', async () => {
+    mockReadModulePackageJson.mockReturnValue({
+      packageJson: { name: '@angular/core', version: '16.1.0' },
+      path: '',
+    });
+    addProject(
+      tree,
+      'app1',
+      {
+        root: 'apps/app1',
+        targets: {
+          'component-test': {
+            executor: '@nx/cypress:cypress',
+            options: {
+              testingType: 'component',
+            },
+          },
+        },
+      },
+      ['npm:@angular/core']
+    );
+    addProject(
+      tree,
+      'app2',
+      {
+        root: 'apps/app2',
+        targets: {
+          e2e: {
+            executor: '@nx/cypress:cypress',
+            options: {
+              testingType: 'component',
+            },
+          },
+        },
+      },
+      ['npm:@angular/core']
+    );
+    const loggerSpy = jest.spyOn(logger, 'warn');
+
+    await migration(tree);
+
+    expect(loggerSpy).toHaveBeenCalledTimes(1);
+  });
+});
+
+function addProject(
+  tree: Tree,
+  projectName: string,
+  config: ProjectConfiguration,
+  dependencies: string[]
+): void {
+  projectGraph = {
+    dependencies: {
+      [projectName]: dependencies.map((d) => ({
+        source: projectName,
+        target: d,
+        type: 'static',
+      })),
+    },
+    nodes: {
+      [projectName]: { data: config, name: projectName, type: 'app' },
+    },
+  };
+  addProjectConfiguration(tree, projectName, config);
+}

packages/cypress/src/migrations/update-16-4-0/warn-incompatible-angular-cypress.ts

@@ -0,0 +1,70 @@
+import type { Tree } from '@nx/devkit';
+import { createProjectGraphAsync, logger, stripIndents } from '@nx/devkit';
+import { forEachExecutorOptions } from '@nx/devkit/src/generators/executor-options-utils';
+import { readModulePackageJson } from 'nx/src/utils/package-json';
+import { lt } from 'semver';
+import type { CypressExecutorOptions } from '../../executors/cypress/cypress.impl';
+
+export default async function (tree: Tree) {
+  const angularVersion = getInstalledAngularVersion();
+  if (!angularVersion || lt(angularVersion, '16.1.0')) {
+    return;
+  }
+
+  const angularProjects = await getAngularProjects();
+  if (!angularProjects.length) {
+    return;
+  }
+
+  let skipChecking = false;
+  forEachExecutorOptions(
+    tree,
+    '@nx/cypress:cypress',
+    (options: Partial<CypressExecutorOptions>, projectName) => {
+      if (skipChecking || !angularProjects.includes(projectName)) {
+        return;
+      }
+
+      if (options.testingType === 'component') {
+        skipChecking = true;
+        logger.warn(
+          stripIndents`Some of your Angular projects are setup for Cypress Component testing.
+          The current version of Cypress does not support component testing for Angular 16.1 so your tests may fail.
+          If your component tests fail, here are some recommended next steps:
+          
+          - Revert these changes and update Nx without updating Angular ("nx migrate latest --interactive"). You can update Angular once the issue has been resolved
+          - Keep these changes but temporarily disable the component tests until this issue is resolved
+          
+          Check https://github.com/nrwl/nx/issues/17720 for more details.
+
+          `
+        );
+      }
+    }
+  );
+}
+
+async function getAngularProjects(): Promise<string[]> {
+  const projectGraph = await createProjectGraphAsync();
+
+  return Object.entries(projectGraph.dependencies)
+    .filter(([node, dep]) =>
+      dep.some(
+        ({ target }) =>
+          !projectGraph.externalNodes?.[node] && target === 'npm:@angular/core'
+      )
+    )
+    .map(([projectName]) => projectName);
+}
+
+function getInstalledAngularVersion(): string {
+  try {
+    const {
+      packageJson: { version },
+    } = readModulePackageJson('@angular/core');
+
+    return version;
+  } catch {
+    return null;
+  }
+}

packages/devkit/src/utils/versions.ts

@@ -1 +1 @@
-export const typescriptVersion = '~5.0.2';
+export const typescriptVersion = '~5.1.3';

packages/js/migrations.json

@@ -80,6 +80,18 @@
           "version": "~5.0.2"
         }
       }
+    },
+    "16.4.0": {
+      "version": "16.4.0-beta.11",
+      "x-prompt": "Do you want to update to TypeScript v5.1?",
+      "requires": {
+        "typescript": ">=5.0.0 <5.1.0"
+      },
+      "packages": {
+        "typescript": {
+          "version": "~5.1.3"
+        }
+      }
     }
   }
 }

packages/js/src/utils/versions.ts

@@ -11,7 +11,7 @@ export const typesNodeVersion = '18.7.1';
 export const verdaccioVersion = '^5.0.4';
 
 // Typescript
-export const typescriptVersion = '~5.0.2';
+export const typescriptVersion = '~5.1.3';
 /**
  * The minimum version is currently determined from the lowest version
  * that's supported by the lowest Angular supported version, e.g.

packages/nx/src/plugins/js/versions.ts

@@ -1 +1 @@
-export const typescriptVersion = '~5.0.2';
+export const typescriptVersion = '~5.1.3';

packages/storybook/src/generators/init/__snapshots__/init.spec.ts.snap

@@ -16,7 +16,7 @@ exports[`@nx/storybook:init dependencies for package.json should add angular rel
     "@storybook/core-server": "7.0.9",
     "existing": "1.0.0",
     "prettier": "^2.6.2",
-    "typescript": "~5.0.2",
+    "typescript": "~5.1.3",
   },
   "name": "test-name",
 }

packages/vite/src/generators/init/__snapshots__/init.spec.ts.snap

@@ -12,7 +12,7 @@ exports[`@nx/vite:init dependencies for package.json should add vite packages an
     "@vitest/ui": "^0.32.0",
     "existing": "1.0.0",
     "prettier": "^2.6.2",
-    "typescript": "~5.0.2",
+    "typescript": "~5.1.3",
     "vite": "^4.3.9",
     "vite-tsconfig-paths": "^4.2.0",
     "vitest": "^0.32.0",
@@ -30,7 +30,7 @@ exports[`@nx/vite:init dependencies for package.json should support --testEnviro
     "@nx/vite": "0.0.1",
     "@vitest/ui": "^0.32.0",
     "prettier": "^2.6.2",
-    "typescript": "~5.0.2",
+    "typescript": "~5.1.3",
     "vite": "^4.3.9",
     "vite-tsconfig-paths": "^4.2.0",
     "vitest": "^0.32.0",
@@ -48,7 +48,7 @@ exports[`@nx/vite:init dependencies for package.json should support --testEnviro
     "@vitest/ui": "^0.32.0",
     "happy-dom": "~9.20.3",
     "prettier": "^2.6.2",
-    "typescript": "~5.0.2",
+    "typescript": "~5.1.3",
     "vite": "^4.3.9",
     "vite-tsconfig-paths": "^4.2.0",
     "vitest": "^0.32.0",
@@ -66,7 +66,7 @@ exports[`@nx/vite:init dependencies for package.json should support --testEnviro
     "@vitest/ui": "^0.32.0",
     "jsdom": "~22.1.0",
     "prettier": "^2.6.2",
-    "typescript": "~5.0.2",
+    "typescript": "~5.1.3",
     "vite": "^4.3.9",
     "vite-tsconfig-paths": "^4.2.0",
     "vitest": "^0.32.0",

packages/workspace/migrations.json

@@ -184,6 +184,18 @@
           "version": "~5.0.2"
         }
       }
+    },
+    "16.4.0": {
+      "version": "16.4.0-beta.11",
+      "x-prompt": "Do you want to update to TypeScript v5.1?",
+      "requires": {
+        "typescript": ">=5.0.0 <5.1.0"
+      },
+      "packages": {
+        "typescript": {
+          "version": "~5.1.3"
+        }
+      }
     }
   }
 }

packages/workspace/src/utils/versions.ts

@@ -1,11 +1,11 @@
 export const nxVersion = require('../../package.json').version;
 
-export const typescriptVersion = '~5.0.2';
+export const typescriptVersion = '~5.1.3';
 export const typescriptESLintVersion = '^5.58.0';
 export const eslintVersion = '~8.15.0';
 export const eslintConfigPrettierVersion = '8.1.0';
 
 // TODO: remove when preset generation is reworked and
 // deps are not installed from workspace
-export const angularCliVersion = '~16.0.0';
+export const angularCliVersion = '~16.1.0';
 export const prettierVersion = '^2.6.2';

scripts/angular-support-upgrades/build-migrations.ts

@@ -29,10 +29,9 @@ async function addMigrationPackageGroup(
   } else {
     angularPackageMigrations.packageJsonUpdates[targetNxVersion][
       'x-prompt'
-    ] = `Do you want to update the Angular version to v${promptAndRequirements.promptVersion}?`;
+    ] = `Do you want to update the Angular version to ${promptAndRequirements.promptVersion}?`;
     angularPackageMigrations.packageJsonUpdates[targetNxVersion].requires = {
       '@angular/core': promptAndRequirements.angularCoreRequirement,
-      typescript: promptAndRequirements.typescriptRequirement,
     };
   }
 
@@ -58,7 +57,6 @@ async function getPromptAndRequiredVersions(
 ): Promise<{
   angularCoreRequirement: string;
   promptVersion: string;
-  typescriptRequirement: string;
 } | null> {
   // @angular/core
   const angularCoreMetadata = await axios.get(
@@ -80,17 +78,7 @@ async function getPromptAndRequiredVersions(
     minorVersion !== 0 ? `.${minorVersion}` : ''
   }`;
 
-  // typescript
-  const angularCompilerCliVersion = packageVersionMap.get(
-    '@angular/compiler-cli'
-  );
-  const angularCompilerCliMetadata = await axios.get(
-    `https://registry.npmjs.org/@angular/compiler-cli/${angularCompilerCliVersion}`
-  );
-  const typescriptRequirement =
-    angularCompilerCliMetadata.data.peerDependencies.typescript;
-
-  return { angularCoreRequirement, promptVersion, typescriptRequirement };
+  return { angularCoreRequirement, promptVersion };
 }
 
 export async function buildMigrations(

scripts/angular-support-upgrades/init-upgrade.ts

@@ -6,7 +6,7 @@
  * Run the following command from the root of the workspace.
  * Replace the versions with the correct target versions
  *
- * npx ts-node scripts/angular-support-upgrades/init-upgrade.ts --angularVersion=next --targetNxVersion=15.5.0 --targetNxMigrationVersion=15.5.0-beta.0
+ * pnpm ts-node scripts/angular-support-upgrades/init-upgrade.ts --angularVersion=next --targetNxVersion=15.5.0 --targetNxMigrationVersion=15.5.0-beta.0
  *
  */
 import { execSync } from 'child_process';

scripts/angular-support-upgrades/update-version-utils.ts

@@ -1,51 +1,44 @@
 import { readFileSync, writeFileSync } from 'fs';
 
-function updatAngularVersionUtils(packageVersionMap: Map<string, string>) {
+function updateAngularVersionUtils(packageVersionMap: Map<string, string>) {
   const pathToFile = 'packages/angular/src/utils/versions.ts';
   let versionUtilContents = readFileSync(pathToFile, { encoding: 'utf-8' });
 
-  const angularVersion = packageVersionMap.get('@angular/core') as string;
-  const angularDevkitVersion = packageVersionMap.get('@angular/cli') as string;
-  const ngPackagrVersion = packageVersionMap.get('ng-packagr') as string;
+  const angularVersion = packageVersionMap.get('@angular/core')!;
+  const angularDevkitVersion = packageVersionMap.get('@angular/cli')!;
+  const ngPackagrVersion = packageVersionMap.get('ng-packagr')!;
+  const ngUniversalVersion = packageVersionMap.get('@nguniversal/common')!;
 
   versionUtilContents = versionUtilContents.replace(
-    /export const angularVersion = '~(\d)+\.(\d)+\.(\d)+';/,
+    /export const angularVersion = '~.+';/,
     `export const angularVersion = '~${angularVersion}';`
   );
   versionUtilContents = versionUtilContents.replace(
-    /export const angularDevkitVersion = '~(\d)+\.(\d)+\.(\d)+';/,
+    /export const angularDevkitVersion = '~.+';/,
     `export const angularDevkitVersion = '~${angularDevkitVersion}';`
   );
   versionUtilContents = versionUtilContents.replace(
-    /export const ngPackagrVersion = '~(\d)+\.(\d)+\.(\d)+';/,
+    /export const ngPackagrVersion = '~.+';/,
     `export const ngPackagrVersion = '~${ngPackagrVersion}';`
   );
-
-  writeFileSync(pathToFile, versionUtilContents);
-}
-function updatNxAngularVersionUtils(packageVersionMap: Map<string, string>) {
-  const pathToFile = 'packages/nx/src/utils/versions.ts';
-  let versionUtilContents = readFileSync(pathToFile, { encoding: 'utf-8' });
-
-  const angularDevkitVersion = packageVersionMap.get('@angular/cli') as string;
-
   versionUtilContents = versionUtilContents.replace(
-    /export const angularCliVersion = '~(\d)+\.(\d)+\.(\d)+';/,
-    `export const angularCliVersion = '~${angularDevkitVersion}';`
+    /export const ngUniversalVersion = '~.+';/,
+    `export const ngUniversalVersion = '~${ngUniversalVersion}';`
   );
 
   writeFileSync(pathToFile, versionUtilContents);
 }
-function updatWorkspaceAngularVersionUtils(
+
+function updateWorkspaceAngularVersionUtils(
   packageVersionMap: Map<string, string>
 ) {
   const pathToFile = 'packages/workspace/src/utils/versions.ts';
   let versionUtilContents = readFileSync(pathToFile, { encoding: 'utf-8' });
 
-  const angularDevkitVersion = packageVersionMap.get('@angular/cli') as string;
+  const angularDevkitVersion = packageVersionMap.get('@angular/cli')!;
 
   versionUtilContents = versionUtilContents.replace(
-    /export const angularCliVersion = '~(\d)+\.(\d)+\.(\d)+';/,
+    /export const angularCliVersion = '~.+';/,
     `export const angularCliVersion = '~${angularDevkitVersion}';`
   );
 
@@ -54,8 +47,7 @@ function updatWorkspaceAngularVersionUtils(
 
 export function updateVersionUtils(packageVersionMap: Map<string, string>) {
   console.log('⏳ - Writing Util Files...');
-  updatAngularVersionUtils(packageVersionMap);
-  updatNxAngularVersionUtils(packageVersionMap);
-  updatWorkspaceAngularVersionUtils(packageVersionMap);
+  updateAngularVersionUtils(packageVersionMap);
+  updateWorkspaceAngularVersionUtils(packageVersionMap);
   console.log('✅ - Wrote Util Files');
 }

scripts/check-imports.js

@@ -46,6 +46,9 @@ function check() {
     // which is @angular/core/testing. and the tests check for this
     'packages/cypress/src/migrations/update-15-1-0/cypress-11.spec.ts',
     'packages/cypress/src/migrations/update-15-1-0/cypress-11.ts',
+    // this migration looks for projects depending on @angular/core, it doesn't require it
+    'packages/cypress/src/migrations/update-16-4-0/warn-incompatible-angular-cypress.spec.ts',
+    'packages/cypress/src/migrations/update-16-4-0/warn-incompatible-angular-cypress.ts',
   ];
 
   const files = [

scripts/documentation/generators/generate-devkit-documentation.ts

@@ -15,7 +15,7 @@ export function generateDevkitDocumentation() {
   );
 
   execSync(
-    `rm -rf docs/generated/devkit && pnpm typedoc packages/devkit/index.d.ts packages/devkit/ngcli-adapter.ts --tsconfig packages/devkit/tsconfig.lib.json --out ./docs/generated/devkit --hideBreadcrumbs true --disableSources --publicPath ../../devkit/ --theme nx-markdown-theme --readme none`,
+    `rm -rf docs/generated/devkit && pnpm typedoc packages/devkit/index.d.ts packages/devkit/ngcli-adapter.ts --tsconfig packages/devkit/tsconfig.lib.json --out ./docs/generated/devkit --plugin typedoc-plugin-markdown --plugin @nx/typedoc-theme --hideBreadcrumbs true --disableSources --publicPath ../../devkit/ --theme nx-markdown-theme --readme none`,
     execSyncOptions
   );
   execSync(

typedoc-theme/src/lib/theme.ts

@@ -1,4 +1,4 @@
-import { PageEvent, Reflection, ReflectionKind } from 'typedoc';
+import { PageEvent, Reflection, ReflectionKind, RenderTemplate } from 'typedoc';
 import { MarkdownTheme } from 'typedoc-plugin-markdown/dist/theme';
 
 /**
@@ -12,10 +12,13 @@ export default class NxMarkdownTheme extends MarkdownTheme {
     super(renderer);
   }
 
-  render(page: PageEvent<Reflection>): string {
+  render(
+    page: PageEvent<Reflection>,
+    template: RenderTemplate<PageEvent<Reflection>>
+  ): string {
     return (
       super
-        .render(page)
+        .render(page, template)
         .replace(/.md#/gi, '#')
         /**
          * Hack: This is the simplest way to update the urls and make them work