fix(angular): hide warnings when reading workspace due to extra prope…

…rties (#11143)

* fix(angular): hide warnings when reading workspace due to extra properties

* fix(angular): bump angular to 14.1.1

package.json

@@ -26,24 +26,24 @@
     "echo": "echo 12345"
   },
   "devDependencies": {
-    "@angular-devkit/architect": "~0.1401.0",
-    "@angular-devkit/build-angular": "~14.1.0",
-    "@angular-devkit/core": "~14.1.0",
-    "@angular-devkit/schematics": "~14.1.0",
+    "@angular-devkit/architect": "~0.1401.1",
+    "@angular-devkit/build-angular": "~14.1.1",
+    "@angular-devkit/core": "~14.1.1",
+    "@angular-devkit/schematics": "~14.1.1",
     "@angular-eslint/eslint-plugin": "~14.0.0",
     "@angular-eslint/eslint-plugin-template": "~14.0.0",
     "@angular-eslint/template-parser": "~14.0.0",
-    "@angular/cli": "~14.1.0",
-    "@angular/common": "~14.1.0",
-    "@angular/compiler": "~14.1.0",
-    "@angular/compiler-cli": "~14.1.0",
-    "@angular/core": "~14.1.0",
-    "@angular/forms": "~14.1.0",
-    "@angular/platform-browser": "~14.1.0",
-    "@angular/platform-browser-dynamic": "~14.1.0",
-    "@angular/router": "~14.1.0",
-    "@angular/service-worker": "~14.1.0",
-    "@angular/upgrade": "~14.1.0",
+    "@angular/cli": "~14.1.1",
+    "@angular/common": "~14.1.1",
+    "@angular/compiler": "~14.1.1",
+    "@angular/compiler-cli": "~14.1.1",
+    "@angular/core": "~14.1.1",
+    "@angular/forms": "~14.1.1",
+    "@angular/platform-browser": "~14.1.1",
+    "@angular/platform-browser-dynamic": "~14.1.1",
+    "@angular/router": "~14.1.1",
+    "@angular/service-worker": "~14.1.1",
+    "@angular/upgrade": "~14.1.1",
     "@babel/helper-create-regexp-features-plugin": "^7.14.5",
     "@cypress/react": "^6.0.0",
     "@cypress/webpack-preprocessor": "^5.12.0",

packages/angular/migrations.json

@@ -1403,6 +1403,43 @@
           "alwaysAddToPackageJson": false
         }
       }
+    },
+    "14.5.3": {
+      "version": "14.5.3-beta.0",
+      "packages": {
+        "@angular-devkit/architect": {
+          "version": "~0.1401.1",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular-devkit/build-angular": {
+          "version": "~14.1.1",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular-devkit/build-webpack": {
+          "version": "~0.1401.1",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular-devkit/core": {
+          "version": "~14.1.1",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular-devkit/schematics": {
+          "version": "~14.1.1",
+          "alwaysAddToPackageJson": false
+        },
+        "@schematics/angular": {
+          "version": "~14.1.1",
+          "alwaysAddToPackageJson": false
+        },
+        "@angular/core": {
+          "version": "~14.1.1",
+          "alwaysAddToPackageJson": true
+        },
+        "@angular/material": {
+          "version": "~14.1.1",
+          "alwaysAddToPackageJson": false
+        }
+      }
     }
   }
 }

packages/angular/package.json

@@ -37,7 +37,7 @@
     "migrations": "./migrations.json"
   },
   "dependencies": {
-    "@angular-devkit/schematics": "~14.1.0",
+    "@angular-devkit/schematics": "~14.1.1",
     "@nrwl/cypress": "file:../cypress",
     "@nrwl/devkit": "file:../devkit",
     "@nrwl/jest": "file:../jest",

packages/angular/src/utils/versions.ts

@@ -1,7 +1,7 @@
 export const nxVersion = require('../../package.json').version;
 
-export const angularVersion = '~14.1.0';
-export const angularDevkitVersion = '~14.1.0';
+export const angularVersion = '~14.1.1';
+export const angularDevkitVersion = '~14.1.1';
 export const ngPackagrVersion = '~14.1.0';
 export const ngrxVersion = '~14.0.0';
 export const rxjsVersion = '~7.4.0';

packages/nx/src/adapter/compat.ts

@@ -2,7 +2,6 @@ import { logger } from '../utils/logger';
 import {
   resolveOldFormatWithInlineProjects,
   workspaceConfigName,
-  Workspaces,
 } from '../config/workspaces';
 import { workspaceRoot } from '../utils/workspace-root';
 import {
@@ -15,30 +14,81 @@ import { NxJsonConfiguration } from '../config/nx-json';
 
 /* eslint-disable */
 const Module = require('module');
-const originalRequire = Module.prototype.require;
+const originalRequire: NodeRequire = Module.prototype.require;
 
 let patched = false;
 let loggedWriteWorkspaceWarning = false;
 
+const allowedProjectExtensions = [
+  'tags',
+  'implicitDependencies',
+  'configFilePath',
+  '$schema',
+  'generators',
+];
+
 if (!patched) {
   Module.prototype.require = function () {
     const result = originalRequire.apply(this, arguments);
     if (arguments[0].startsWith('@angular-devkit/core')) {
       // Register `workspace.json` as a nonstandard workspace config file
-      const core = originalRequire.apply(this, [
+      const ngCoreWorkspace = originalRequire.apply(this, [
         `@angular-devkit/core/src/workspace/core`,
       ]);
-      core._test_addWorkspaceFile('workspace.json', core.WorkspaceFormat.JSON);
-      const originalReadWorkspace = core.readWorkspace;
-      core.readWorkspace = (path, ...rest) => {
+      ngCoreWorkspace._test_addWorkspaceFile(
+        'workspace.json',
+        ngCoreWorkspace.WorkspaceFormat.JSON
+      );
+
+      mockReadWorkspace(ngCoreWorkspace);
+      mockWriteWorkspace(ngCoreWorkspace);
+
+      const readJsonUtils = originalRequire.apply(this, [
+        `@angular-devkit/core/src/workspace/json/reader`,
+      ]);
+      mockReadJsonWorkspace(readJsonUtils);
+    }
+    return result;
+  };
+
+  try {
+    require('@angular-devkit/build-angular/src/utils/version').Version.assertCompatibleAngularVersion =
+      () => {};
+  } catch (e) {}
+
+  try {
+    require('@angular-devkit/build-angular/src/utils/version').assertCompatibleAngularVersion =
+      () => {};
+  } catch (e) {}
+
+  patched = true;
+}
+
+function mockReadWorkspace(
+  ngCoreWorkspace: typeof import('@angular-devkit/core/src/workspace/core')
+) {
+  mockMember(
+    ngCoreWorkspace,
+    'readWorkspace',
+    (originalReadWorkspace) =>
+      (path, ...rest) => {
         const configFile = workspaceConfigName(workspaceRoot);
         if (!configFile) {
           path = 'workspace.json';
         }
         return originalReadWorkspace.apply(this, [path, ...rest]);
-      };
-      const originalWriteWorkspace = core.writeWorkspace;
-      core.writeWorkspace = (...args) => {
+      }
+  );
+}
+
+function mockWriteWorkspace(
+  ngCoreWorkspace: typeof import('@angular-devkit/core/src/workspace/core')
+) {
+  mockMember(
+    ngCoreWorkspace,
+    'writeWorkspace',
+    (originalWriteWorkspace) =>
+      (...args) => {
         const configFile = workspaceConfigName(workspaceRoot);
         if (!loggedWriteWorkspaceWarning) {
           if (configFile) {
@@ -57,59 +107,65 @@ if (!patched) {
           loggedWriteWorkspaceWarning = true;
         }
         return originalWriteWorkspace.apply(this, args);
-      };
+      }
+  );
+}
 
-      // Patch readJsonWorkspace to inline project configurations
-      // as well as work in workspaces without a central workspace file.
-      const readJsonUtils = originalRequire.apply(this, [
-        `@angular-devkit/core/src/workspace/json/reader`,
-      ]);
-      const originalReadJsonWorkspace = readJsonUtils.readJsonWorkspace;
-      readJsonUtils.readJsonWorkspace = async (
-        path,
-        host: { readFile: (p) => Promise<string> }
-      ) => {
-        try {
-          return await originalReadJsonWorkspace(path, host);
-        } catch {
-          logger.debug(
-            '[NX] Angular devkit readJsonWorkspace fell back to Nx workspaces logic'
-          );
-          const projectGraph = await createProjectGraphAsync();
-          const nxJson = readNxJson();
+/**
+ * Patch readJsonWorkspace to inline project configurations
+ * as well as work in workspaces without a central workspace file.
+ *
+ * NOTE: We hide warnings that would be logged during this process.
+ */
+function mockReadJsonWorkspace(
+  readJsonUtils: typeof import('@angular-devkit/core/src/workspace/json/reader')
+) {
+  mockMember(
+    readJsonUtils,
+    'readJsonWorkspace',
+    (originalReadJsonWorkspace) => async (path, host, options) => {
+      try {
+        // Attempt angular CLI default behaviour
+        return await originalReadJsonWorkspace(path, host, {
+          ...options,
+          allowedProjectExtensions,
+        });
+      } catch {
+        // This failed. Its most likely due to a lack of a workspace definition file,
+        // or other things that are different between NgCLI and Nx config files.
+        logger.debug(
+          '[NX] Angular devkit readJsonWorkspace fell back to Nx workspaces logic'
+        );
+        const projectGraph = await createProjectGraphAsync();
+        const nxJson = readNxJson();
 
-          // Construct old workspace.json format from project graph
-          const w: ProjectsConfigurations & NxJsonConfiguration = {
-            ...nxJson,
-            ...readProjectsConfigurationFromProjectGraph(projectGraph),
-          };
+        // Construct old workspace.json format from project graph
+        const w: ProjectsConfigurations & NxJsonConfiguration = {
+          ...nxJson,
+          ...readProjectsConfigurationFromProjectGraph(projectGraph),
+        };
 
-          // Read our v1 workspace schema
-          const workspaceConfiguration = resolveOldFormatWithInlineProjects(w);
-          // readJsonWorkspace actually has AST parsing + more, so we
-          // still need to call it rather than just return our file
-          return originalReadJsonWorkspace.apply(this, [
-            'workspace.json', // path name, doesn't matter
-            {
-              // second arg is a host, only method used is readFile
-              readFile: () => JSON.stringify(workspaceConfiguration),
-            },
-          ]);
-        }
-      };
+        // Read our v1 workspace schema
+        const workspaceConfiguration = resolveOldFormatWithInlineProjects(w);
+        // readJsonWorkspace actually has AST parsing + more, so we
+        // still need to call it rather than just return our file
+        return originalReadJsonWorkspace.apply(this, [
+          'workspace.json', // path name, doesn't matter
+          {
+            // second arg is a host, only method used is readFile
+            readFile: () => JSON.stringify(workspaceConfiguration),
+          },
+          { ...options, allowedProjectExtensions },
+        ]);
+      }
     }
-    return result;
-  };
-
-  try {
-    require('@angular-devkit/build-angular/src/utils/version').Version.assertCompatibleAngularVersion =
-      () => {};
-  } catch (e) {}
-
-  try {
-    require('@angular-devkit/build-angular/src/utils/version').assertCompatibleAngularVersion =
-      () => {};
-  } catch (e) {}
+  );
+}
 
-  patched = true;
+function mockMember<T, T2 extends keyof T>(
+  obj: T,
+  method: T2,
+  factory: (originalValue: T[T2]) => T[T2]
+) {
+  obj[method] = factory(obj[method]);
 }

packages/nx/src/adapter/ngcli-adapter.ts

@@ -1033,6 +1033,17 @@ export function wrapAngularDevkitSchematic(
   collectionName: string,
   generatorName: string
 ) {
+  // This is idempotent, if it happens to get called
+  // multiple times its no big deal. It ensures that some
+  // patches are applied to @angular-devkit code which
+  // are necessary. For the most part, our wrapped host hits
+  // the necessary areas, but for some things it wouldn't make
+  // sense for the adapter to be 100% accurate.
+  //
+  // e.g. Angular warns about tags, but some angular CLI schematics
+  // were written with Nx in mind, and may care about tags.
+  require('./compat');
+
   return async (host: Tree, generatorOptions: { [k: string]: any }) => {
     if (
       mockedSchematics &&