fix(@angular/cli): logic to determine if the installed CLI is out of date

With this change we now check if the current CLI version is the latest published version. If it is not, we install a temporary version to run the `ng update` with.

Author: alan-agius4

etc/api/angular_devkit/core/node/_golden-api.d.ts

@@ -48,7 +48,7 @@ export interface ProcessOutput {
     write(buffer: string | Buffer): boolean;
 }
 
-export declare function resolve(x: string, options: ResolveOptions): string;
+export declare function resolve(packageName: string, options: ResolveOptions): string;
 
 export interface ResolveOptions {
     basedir: string;

package.json

@@ -103,6 +103,7 @@
     "@types/minimist": "^1.2.0",
     "@types/node": "10.12.30",
     "@types/request": "^2.47.1",
+    "@types/rimraf": "^2.0.2",
     "@types/semver": "^6.0.0",
     "@types/webpack": "^4.32.1",
     "@types/webpack-dev-server": "^3.1.7",

packages/angular/cli/BUILD

@@ -37,11 +37,11 @@ ts_library(
         "@npm//@types/debug",
         "@npm//@types/node",
         "@npm//@types/inquirer",
+        "@npm//@types/rimraf",
         "@npm//@types/semver",
         "@npm//@types/universal-analytics",
         "@npm//@types/uuid",
         "@npm//ansi-colors",
-        "@npm//rxjs",
     ],
 )
 
@@ -52,6 +52,7 @@ ts_library(
         ":add_schema",
         ":analytics_schema",
         ":build_schema",
+        ":cli_schema",
         ":config_schema",
         ":deploy_schema",
         ":deprecated_schema",
@@ -71,6 +72,11 @@ ts_library(
     ],
 )
 
+ts_json_schema(
+    name = "cli_schema",
+    src = "lib/config/schema.json",
+)
+
 ts_json_schema(
     name = "analytics_schema",
     src = "commands/analytics.json",

packages/angular/cli/commands/add-impl.ts

@@ -9,11 +9,11 @@ import { analytics, tags } from '@angular-devkit/core';
 import { NodePackageDoesNotSupportSchematics } from '@angular-devkit/schematics/tools';
 import { dirname, join } from 'path';
 import { intersects, prerelease, rcompare, satisfies, valid, validRange } from 'semver';
+import { PackageManager } from '../lib/config/schema';
 import { isPackageNameSafeForAnalytics } from '../models/analytics';
 import { Arguments } from '../models/interface';
 import { RunSchematicOptions, SchematicCommand } from '../models/schematic-command';
-import npmInstall from '../tasks/npm-install';
-import npmUninstall from '../tasks/npm-uninstall';
+import { installPackage, installTempPackage } from '../tasks/install-package';
 import { colors } from '../utilities/color';
 import { getPackageManager } from '../utilities/package-manager';
 import {
@@ -57,7 +57,7 @@ export class AddCommand extends SchematicCommand<AddCommandSchema> {
     }
 
     const packageManager = await getPackageManager(this.workspace.root);
-    const usingYarn = packageManager === 'yarn';
+    const usingYarn = packageManager === PackageManager.Yarn;
 
     if (packageIdentifier.type === 'tag' && !packageIdentifier.rawSpec) {
       // only package name provided; search for viable version
@@ -115,7 +115,7 @@ export class AddCommand extends SchematicCommand<AddCommandSchema> {
     }
 
     let collectionName = packageIdentifier.name;
-    let dependencyType: NgAddSaveDepedency | undefined;
+    let savePackage: NgAddSaveDepedency | undefined;
 
     try {
       const manifest = await fetchPackageManifest(packageIdentifier, this.logger, {
@@ -124,7 +124,7 @@ export class AddCommand extends SchematicCommand<AddCommandSchema> {
         usingYarn,
       });
 
-      dependencyType = manifest['ng-add'] && manifest['ng-add'].save;
+      savePackage = manifest['ng-add'] && manifest['ng-add'].save;
       collectionName = manifest.name;
 
       if (await this.hasMismatchedPeer(manifest)) {
@@ -138,16 +138,13 @@ export class AddCommand extends SchematicCommand<AddCommandSchema> {
       return 1;
     }
 
-    await npmInstall(packageIdentifier.raw, this.logger, packageManager, dependencyType);
-
-    const schematicResult = await this.executeSchematic(collectionName, options['--']);
-
-    if (dependencyType === false) {
-      // Uninstall the package if it was not meant to be retained.
-      return npmUninstall(packageIdentifier.raw, this.logger, packageManager);
+    if (savePackage === false) {
+      installTempPackage(packageIdentifier.raw, this.logger, packageManager);
+    } else {
+      installPackage(packageIdentifier.raw, this.logger, packageManager, savePackage);
     }
 
-    return schematicResult;
+    return this.executeSchematic(collectionName, options['--']);
   }
 
   async reportAnalytics(

packages/angular/cli/commands/update-impl.ts

@@ -13,14 +13,17 @@ import { execSync } from 'child_process';
 import * as fs from 'fs';
 import * as path from 'path';
 import * as semver from 'semver';
+import { PackageManager } from '../lib/config/schema';
 import { Command } from '../models/command';
 import { Arguments } from '../models/interface';
+import { runTempPackageBin } from '../tasks/install-package';
 import { colors } from '../utilities/color';
 import { getPackageManager } from '../utilities/package-manager';
 import {
   PackageIdentifier,
   PackageManifest,
   PackageMetadata,
+  fetchPackageManifest,
   fetchPackageMetadata,
 } from '../utilities/package-metadata';
 import { PackageTreeNode, findNodeDependencies, readPackageTree } from '../utilities/package-tree';
@@ -38,22 +41,23 @@ export class UpdateCommand extends Command<UpdateCommandSchema> {
   public readonly allowMissingWorkspace = true;
 
   private workflow: NodeWorkflow;
+  private packageManager: PackageManager;
 
   async initialize() {
+    this.packageManager = await getPackageManager(this.workspace.root);
     this.workflow = new NodeWorkflow(
       new virtualFs.ScopedHost(new NodeJsSyncHost(), normalize(this.workspace.root)),
       {
-        packageManager: await getPackageManager(this.workspace.root),
+        packageManager: this.packageManager,
         root: normalize(this.workspace.root),
       },
     );
-
     this.workflow.engineHost.registerOptionsTransform(
       validateOptionsWithSchema(this.workflow.registry),
     );
   }
 
-  async executeSchematic(
+  private async executeSchematic(
     collection: string,
     schematic: string,
     options = {},
@@ -127,7 +131,7 @@ export class UpdateCommand extends Command<UpdateCommandSchema> {
     }
   }
 
-  async executeMigrations(
+  private async executeMigrations(
     packageName: string,
     collectionPath: string,
     range: semver.Range,
@@ -190,6 +194,21 @@ export class UpdateCommand extends Command<UpdateCommandSchema> {
 
   // tslint:disable-next-line:no-big-function
   async run(options: UpdateCommandSchema & Arguments) {
+    // Check if the current installed CLI version is older than the latest version.
+    if (await this.checkCLILatestVersion(options.verbose)) {
+      this.logger.warn(
+        'The installed Angular CLI version is older than the latest published version.\n' +
+        'Installing a temporary version to perform the update.',
+      );
+
+      return runTempPackageBin(
+        '@angular/cli@latest',
+        this.logger,
+        this.packageManager,
+        process.argv.slice(2),
+      );
+    }
+
     const packages: PackageIdentifier[] = [];
     for (const request of options['--'] || []) {
       try {
@@ -252,8 +271,7 @@ export class UpdateCommand extends Command<UpdateCommandSchema> {
       }
     }
 
-    const packageManager = await getPackageManager(this.workspace.root);
-    this.logger.info(`Using package manager: '${packageManager}'`);
+    this.logger.info(`Using package manager: '${this.packageManager}'`);
 
     // Special handling for Angular CLI 1.x migrations
     if (
@@ -293,7 +311,7 @@ export class UpdateCommand extends Command<UpdateCommandSchema> {
         force: options.force || false,
         next: options.next || false,
         verbose: options.verbose || false,
-        packageManager,
+        packageManager: this.packageManager,
         packages: options.all ? Object.keys(rootDependencies) : [],
       });
 
@@ -513,7 +531,7 @@ export class UpdateCommand extends Command<UpdateCommandSchema> {
     const { success } = await this.executeSchematic('@schematics/update', 'update', {
       verbose: options.verbose || false,
       force: options.force || false,
-      packageManager,
+      packageManager: this.packageManager,
       packages: packagesToUpdate,
       migrateExternal: true,
     });
@@ -549,7 +567,7 @@ export class UpdateCommand extends Command<UpdateCommandSchema> {
     return success ? 0 : 1;
   }
 
-  checkCleanGit() {
+  private checkCleanGit(): boolean {
     try {
       const topLevel = execSync('git rev-parse --show-toplevel', { encoding: 'utf8', stdio: 'pipe' });
       const result = execSync('git status --porcelain', { encoding: 'utf8', stdio: 'pipe' });
@@ -573,15 +591,15 @@ export class UpdateCommand extends Command<UpdateCommandSchema> {
     return true;
   }
 
-  createCommit(message: string, files: string[]) {
+  private createCommit(message: string, files: string[]) {
     try {
       execSync('git add -A ' + files.join(' '), { encoding: 'utf8', stdio: 'pipe' });
 
       execSync(`git commit --no-verify -m "${message}"`, { encoding: 'utf8', stdio: 'pipe' });
     } catch (error) {}
   }
 
-  findCurrentGitSha(): string | null {
+  private findCurrentGitSha(): string | null {
     try {
       const result = execSync('git rev-parse HEAD', { encoding: 'utf8', stdio: 'pipe' });
 
@@ -590,6 +608,25 @@ export class UpdateCommand extends Command<UpdateCommandSchema> {
       return null;
     }
   }
+
+  /**
+   * Checks if the current installed CLI version is older than the latest version.
+   * @returns `true` when the installed version is older.
+  */
+  private async checkCLILatestVersion(verbose = false): Promise<boolean> {
+    const { version: installedCLIVersion } = require('../package.json');
+
+    const LatestCLIManifest = await fetchPackageManifest(
+      '@angular/cli@latest',
+      this.logger,
+      {
+        verbose,
+        usingYarn: this.packageManager === PackageManager.Yarn,
+      },
+    );
+
+    return semver.lt(installedCLIVersion, LatestCLIManifest.version);
+  }
 }
 
 function coerceVersionNumber(version: string | undefined): string | null {

packages/angular/cli/lib/cli/index.ts

@@ -13,9 +13,15 @@ import { colors, supportsColor } from '../../utilities/color';
 import { getWorkspaceRaw } from '../../utilities/config';
 import { getWorkspaceDetails } from '../../utilities/project';
 
+const debugEnv = process.env['NG_DEBUG'];
+const isDebug =
+  debugEnv !== undefined &&
+  debugEnv !== '0' &&
+  debugEnv.toLowerCase() !== 'false';
+
 // tslint:disable: no-console
 export default async function(options: { testing?: boolean; cliArgs: string[] }) {
-  const logger = createConsoleLogger(false, process.stdout, process.stderr, {
+  const logger = createConsoleLogger(isDebug, process.stdout, process.stderr, {
     info: s => (supportsColor ? s : colors.unstyle(s)),
     debug: s => (supportsColor ? s : colors.unstyle(s)),
     warn: s => (supportsColor ? colors.bold.yellow(s) : colors.unstyle(s)),

packages/angular/cli/lib/init.ts

@@ -19,17 +19,15 @@ import { isWarningEnabled } from '../utilities/config';
 
 const packageJson = require('../package.json');
 
-function _fromPackageJson(cwd?: string) {
-  cwd = cwd || process.cwd();
-
+function _fromPackageJson(cwd = process.cwd()): SemVer | null {
   do {
     const packageJsonPath = path.join(cwd, 'node_modules/@angular/cli/package.json');
     if (fs.existsSync(packageJsonPath)) {
       const content = fs.readFileSync(packageJsonPath, 'utf-8');
       if (content) {
-        const json = JSON.parse(content);
-        if (json['version']) {
-          return new SemVer(json['version']);
+        const { version } = JSON.parse(content);
+        if (version) {
+          return new SemVer(version);
         }
       }
     }
@@ -78,6 +76,20 @@ if (process.env['NG_CLI_PROFILING']) {
 }
 
 (async () => {
+  const disableVersionCheckEnv = process.env['NG_DISABLE_VERSION_CHECK'];
+  /**
+   * Disable CLI version mismatch checks and forces usage of the invoked CLI
+   * instead of invoking the local installed version.
+   */
+  const disableVersionCheck =
+    disableVersionCheckEnv !== undefined &&
+    disableVersionCheckEnv !== '0' &&
+    disableVersionCheckEnv.toLowerCase() !== 'false';
+
+  if (disableVersionCheck) {
+    return (await import('./cli')).default;
+  }
+
   let cli;
   try {
     const projectLocalCli = require.resolve('@angular/cli', { paths: [process.cwd()] });
@@ -116,13 +128,13 @@ if (process.env['NG_CLI_PROFILING']) {
 
     // No error implies a projectLocalCli, which will load whatever
     // version of ng-cli you have installed in a local package.json
-    cli = require(projectLocalCli);
+    cli = await import(projectLocalCli);
   } catch {
     // If there is an error, resolve could not find the ng-cli
     // library from a package.json. Instead, include it from a relative
     // path to this script file (which is likely a globally installed
     // npm package). Most common cause for hitting this is `ng new`
-    cli = require('./cli');
+    cli = await import('./cli');
   }
 
   if ('default' in cli) {

packages/angular/cli/package.json

@@ -40,6 +40,7 @@
     "open": "7.0.0",
     "pacote": "9.5.8",
     "read-package-tree": "5.3.1",
+    "rimraf": "3.0.0",
     "semver": "6.3.0",
     "symbol-observable": "1.2.0",
     "universal-analytics": "^0.4.20",