Update rules nodejs (angular#21928)

* build: update to [email protected]

Update to use [email protected] and update correseponding build rule usages
and references

* build: update load statements to load dev-infra via @npm// workspace

Loading the dev-infra rules via the @npm// workspace as the private
@npm_dev_infra_private repo is no longer published.

* fix(cdk/schematics): update JSON.parse usages to cast the result as a type

Update JSON.parse usages to be better typed rather than resulting in an
any type.

* fix(material/schematics): update JSON.parse usages to cast the result as a type

Update JSON.parse usages to be better typed rather than resulting in an
any type.

Author: josephperrott

.nvmrc

@@ -0,0 +1 @@
+12.14.1

WORKSPACE

@@ -8,21 +8,18 @@ load("@bazel_tools//tools/build_defs/repo:http.bzl", "http_archive")
 # Add NodeJS rules
 http_archive(
     name = "build_bazel_rules_nodejs",
-    sha256 = "b3521b29c7cb0c47a1a735cce7e7e811a4f80d8e3720cf3a1b624533e4bb7cb6",
-    urls = ["https://github.com/bazelbuild/rules_nodejs/releases/download/2.3.2/rules_nodejs-2.3.2.tar.gz"],
+    sha256 = "dd4dc46066e2ce034cba0c81aa3e862b27e8e8d95871f567359f7a534cccb666",
+    urls = ["https://github.com/bazelbuild/rules_nodejs/releases/download/3.1.0/rules_nodejs-3.1.0.tar.gz"],
 )
 
 # Add sass rules
 http_archive(
     name = "io_bazel_rules_sass",
-    # Patch `rules_sass` to work around a bug that causes error messages to be not
-    # printed in worker mode: https://github.com/bazelbuild/rules_sass/issues/96.
-    # TODO(devversion): remove this patch once the Sass Node entry-point returns a `Promise`.
-    patches = ["//tools/postinstall:sass_worker_async.patch"],
-    sha256 = "cf28ff1bcfafb3c97f138bbc8ca9fe386e968ed3faaa9f8e6214abb5e88a2ecd",
-    strip_prefix = "rules_sass-1.29.0",
+    sha256 = "596ab3616d370135e0ecc710e103422e0aa3719f1c970303a0886b70c81ee819",
+    strip_prefix = "rules_sass-1.32.2",
     urls = [
-        "https://github.com/bazelbuild/rules_sass/archive/1.29.0.zip",
+        "https://github.com/bazelbuild/rules_sass/archive/1.32.2.zip",
+        "https://mirror.bazel.build/github.com/bazelbuild/rules_sass/archive/1.32.2.zip",
     ],
 )
 
@@ -32,27 +29,12 @@ load("@build_bazel_rules_nodejs//:index.bzl", "check_bazel_version", "node_repos
 check_bazel_version("4.0.0")
 
 node_repositories(
-    node_repositories = {
-        "12.9.1-darwin_amd64": ("node-v12.9.1-darwin-x64.tar.gz", "node-v12.9.1-darwin-x64", "9aaf29d30056e2233fd15dfac56eec12e8342d91bb6c13d54fb5e599383dddb9"),
-        "12.9.1-linux_amd64": ("node-v12.9.1-linux-x64.tar.xz", "node-v12.9.1-linux-x64", "680a1263c9f5f91adadcada549f0a9c29f1b26d09658d2b501c334c3f63719e5"),
-        "12.9.1-windows_amd64": ("node-v12.9.1-win-x64.zip", "node-v12.9.1-win-x64", "6a4e54bda091bd02dbd8ff1b9f6671e036297da012a53891e3834d4bf4bed297"),
-    },
-    node_urls = ["https://nodejs.org/dist/v{version}/{filename}"],
-    node_version = "12.9.1",
-    # We do not need to define a specific yarn version as bazel will respect the .yarnrc file
-    # and run the version of yarn defined at the set-path value.
-    # Since bazel runs yarn from the working directory of the package.json, and our .yarnrc
-    # file is in the same directory, it correctly discovers and respects it.  Additionally,
-    # it ensures that the yarn environment variable to detect if yarn has already followed
-    # the set-path value is reset.
+    node_version = "12.14.1",
+    package_json = ["//:package.json"],
 )
 
 yarn_install(
     name = "npm",
-    # Redirects Yarn `stdout` output to `stderr`. This ensures that stdout is not accidentally
-    # polluted when Bazel runs Yarn. Workaround until the upstream fix is available:
-    # https://github.com/bazelbuild/bazel/pull/10611.
-    args = ["1>&2"],
     # We add the postinstall patches file, and ngcc main fields update script here so
     # that Yarn will rerun whenever one of these files has been modified.
     data = [
@@ -64,19 +46,9 @@ yarn_install(
     yarn_lock = "//:yarn.lock",
 )
 
-# Install all bazel dependencies of the @ngdeps npm packages
-load("@npm//:install_bazel_dependencies.bzl", "install_bazel_dependencies")
+load("@npm//@bazel/protractor:package.bzl", "npm_bazel_protractor_dependencies")
 
-install_bazel_dependencies(
-    # TODO(crisbeto): supress warnings for now so everything works like it has until now.
-    # Eventually we should remove it and re-test everything.
-    suppress_warning = True,
-)
-
-# Fetch transitive dependencies which are needed to use the karma rules.
-load("@npm//@bazel/karma:package.bzl", "npm_bazel_karma_dependencies")
-
-npm_bazel_karma_dependencies()
+npm_bazel_protractor_dependencies()
 
 # Setup web testing. We need to setup a browser because the web testing rules for TypeScript need
 # a reference to a registered browser (ideally that's a hermetic version of a browser)
@@ -130,6 +102,6 @@ rbe_autoconfig(
 # TODO(wagnermaciel): deduplicate browsers - this will load another version of chromium in the
 # repository. We probably want to use the chromium version loaded here (from dev-infra) as that
 # one has RBE improvements.
-load("@npm_angular_dev_infra_private//browsers:browser_repositories.bzl", _dev_infra_browser_repositories = "browser_repositories")
+load("@npm//@angular/dev-infra-private/browsers:browser_repositories.bzl", _dev_infra_browser_repositories = "browser_repositories")
 
 _dev_infra_browser_repositories()

integration/size-test/index.bzl

@@ -77,6 +77,7 @@ def size_test(name, file, deps):
     nodejs_binary(
         name = "%s.approve" % name,
         testonly = True,
+        templated_args = ["--bazel_patch_module_resolver"],
         data = [
             "//goldens:size-test.yaml",
             "//integration/size-test:check-size",

package.json

@@ -63,34 +63,83 @@
     "@types/youtube": "^0.0.40",
     "@webcomponents/custom-elements": "^1.1.0",
     "core-js-bundle": "^3.8.2",
-    "material-components-web": "^11.0.0-canary.3201cae47.0",
+    "material-components-web": "11.0.0-canary.3201cae47.0",
     "rxjs": "^6.5.3",
     "rxjs-tslint-rules": "^4.33.1",
     "systemjs": "0.19.43",
     "tslib": "^2.0.0",
     "zone.js": "~0.11.3"
   },
   "devDependencies": {
+    "diff": "^3.5.0",
+    "reflect-metadata": "^0.1.3",
+    "@material/animation": "11.0.0-canary.3201cae47.0",
+    "@material/auto-init": "11.0.0-canary.3201cae47.0",
+    "@material/banner": "11.0.0-canary.3201cae47.0",
+    "@material/base": "11.0.0-canary.3201cae47.0",
+    "@material/button": "11.0.0-canary.3201cae47.0",
+    "@material/card": "11.0.0-canary.3201cae47.0",
+    "@material/checkbox": "11.0.0-canary.3201cae47.0",
+    "@material/chips": "11.0.0-canary.3201cae47.0",
+    "@material/circular-progress": "11.0.0-canary.3201cae47.0",
+    "@material/data-table": "11.0.0-canary.3201cae47.0",
+    "@material/density": "11.0.0-canary.3201cae47.0",
+    "@material/dialog": "11.0.0-canary.3201cae47.0",
+    "@material/dom": "11.0.0-canary.3201cae47.0",
+    "@material/drawer": "11.0.0-canary.3201cae47.0",
+    "@material/elevation": "11.0.0-canary.3201cae47.0",
+    "@material/fab": "11.0.0-canary.3201cae47.0",
+    "@material/feature-targeting": "11.0.0-canary.3201cae47.0",
+    "@material/floating-label": "11.0.0-canary.3201cae47.0",
+    "@material/form-field": "11.0.0-canary.3201cae47.0",
+    "@material/icon-button": "11.0.0-canary.3201cae47.0",
+    "@material/image-list": "11.0.0-canary.3201cae47.0",
+    "@material/layout-grid": "11.0.0-canary.3201cae47.0",
+    "@material/line-ripple": "11.0.0-canary.3201cae47.0",
+    "@material/linear-progress": "11.0.0-canary.3201cae47.0",
+    "@material/list": "11.0.0-canary.3201cae47.0",
+    "@material/menu": "11.0.0-canary.3201cae47.0",
+    "@material/menu-surface": "11.0.0-canary.3201cae47.0",
+    "@material/notched-outline": "11.0.0-canary.3201cae47.0",
+    "@material/radio": "11.0.0-canary.3201cae47.0",
+    "@material/ripple": "11.0.0-canary.3201cae47.0",
+    "@material/rtl": "11.0.0-canary.3201cae47.0",
+    "@material/segmented-button": "11.0.0-canary.3201cae47.0",
+    "@material/select": "11.0.0-canary.3201cae47.0",
+    "@material/shape": "11.0.0-canary.3201cae47.0",
+    "@material/slider": "11.0.0-canary.3201cae47.0",
+    "@material/snackbar": "11.0.0-canary.3201cae47.0",
+    "@material/switch": "11.0.0-canary.3201cae47.0",
+    "@material/tab": "11.0.0-canary.3201cae47.0",
+    "@material/tab-bar": "11.0.0-canary.3201cae47.0",
+    "@material/tab-indicator": "11.0.0-canary.3201cae47.0",
+    "@material/tab-scroller": "11.0.0-canary.3201cae47.0",
+    "@material/textfield": "11.0.0-canary.3201cae47.0",
+    "@material/theme": "11.0.0-canary.3201cae47.0",
+    "@material/tooltip": "11.0.0-canary.3201cae47.0",
+    "@material/top-app-bar": "11.0.0-canary.3201cae47.0",
+    "@material/touch-target": "11.0.0-canary.3201cae47.0",
+    "@material/typography": "11.0.0-canary.3201cae47.0",
     "@angular-devkit/build-optimizer": "^0.1200.0-next.0",
     "@angular-devkit/core": "^12.0.0-next.0",
     "@angular-devkit/schematics": "^12.0.0-next.0",
     "@angular/bazel": "^12.0.0-next.0",
     "@angular/benchpress": "^0.2.1",
     "@angular/compiler-cli": "^12.0.0-next.0",
-    "@angular/dev-infra-private": "https://github.com/angular/dev-infra-private-builds.git#71d57c29a10c03d07f889581608e3a2315a1dc7e",
+    "@angular/dev-infra-private": "https://github.com/angular/dev-infra-private-builds.git#a8dbb0d8cd8de1e86a4ec4ea66b5bd89a47d4876",
     "@angular/platform-browser-dynamic": "^12.0.0-next.0",
     "@angular/platform-server": "^12.0.0-next.0",
     "@angular/router": "^12.0.0-next.0",
     "@axe-core/webdriverjs": "^4.1.0",
     "@bazel/bazelisk": "^1.4.0",
     "@bazel/buildifier": "^4.0.0",
     "@bazel/ibazel": "^0.14.0",
-    "@bazel/jasmine": "^2.3.2",
-    "@bazel/karma": "^2.3.2",
-    "@bazel/protractor": "^2.3.2",
-    "@bazel/rollup": "^2.3.2",
-    "@bazel/terser": "^2.3.2",
-    "@bazel/typescript": "^2.3.2",
+    "@bazel/jasmine": "3.1.0",
+    "@bazel/concatjs": "3.1.0",
+    "@bazel/protractor": "3.1.0",
+    "@bazel/rollup": "3.1.0",
+    "@bazel/terser": "3.1.0",
+    "@bazel/typescript": "3.1.0",
     "@firebase/app-types": "^0.6.1",
     "@octokit/rest": "18.1.0",
     "@schematics/angular": "^12.0.0-next.0",

packages.bzl

@@ -5,10 +5,18 @@ ANGULAR_PACKAGE_VERSION = "^11.0.0 || ^12.0.0-0"
 MDC_PACKAGE_VERSION = "^9.0.0-canary.419e03572.0"
 TSLIB_PACKAGE_VERSION = "^2.0.0"
 
+# Each placer holder is used to stamp versions during the build process, replacing the key with it's
+# value pair. These replacements occur during building of `npm_package` and `ng_package` stamping in
+# the peer dependencies and versions, primarily in `package.json`s.
 VERSION_PLACEHOLDER_REPLACEMENTS = {
+    # Version of `material-components-web`
     "0.0.0-MDC": MDC_PACKAGE_VERSION,
+    # Version of `@angular/core`
     "0.0.0-NG": ANGULAR_PACKAGE_VERSION,
+    # Version of `tslib`
     "0.0.0-TSLIB": TSLIB_PACKAGE_VERSION,
+    # Version of the local package being built, generated via the `--workspace_status_command` flag.
+    "0.0.0-PLACEHOLDER": "{BUILD_SCM_VERSION}",
 }
 
 # List of default Angular library UMD bundles which are not processed by ngcc.

src/cdk/schematics/ng-add/index.spec.ts

@@ -4,6 +4,10 @@ import {COLLECTION_PATH} from '../index.spec';
 import {createTestApp, getFileContent} from '../testing';
 import {addPackageToPackageJson} from './package-config';
 
+interface PackageJson {
+  dependencies: Record<string, string>;
+}
+
 describe('CDK ng-add', () => {
   let runner: SchematicTestRunner;
   let appTree: Tree;
@@ -15,7 +19,7 @@ describe('CDK ng-add', () => {
 
   it('should update the package.json', async () => {
     const tree = await runner.runSchematicAsync('ng-add', {}, appTree).toPromise();
-    const packageJson = JSON.parse(getFileContent(tree, '/package.json'));
+    const packageJson = JSON.parse(getFileContent(tree, '/package.json')) as PackageJson;
     const dependencies = packageJson.dependencies;
 
     expect(dependencies['@angular/cdk']).toBe('~0.0.0-PLACEHOLDER');
@@ -33,7 +37,7 @@ describe('CDK ng-add', () => {
     addPackageToPackageJson(appTree, '@angular/cdk', '^9.0.0');
 
     const tree = await runner.runSchematicAsync('ng-add', {}, appTree).toPromise();
-    const packageJson = JSON.parse(getFileContent(tree, '/package.json'));
+    const packageJson = JSON.parse(getFileContent(tree, '/package.json')) as PackageJson;
     const dependencies = packageJson.dependencies;
 
     expect(dependencies['@angular/cdk']).toBe('^9.0.0');

src/cdk/schematics/ng-add/package-config.ts

@@ -8,6 +8,10 @@
 
 import {Tree} from '@angular-devkit/schematics';
 
+interface PackageJson {
+  dependencies: Record<string, string>;
+}
+
 /**
  * Sorts the keys of the given object.
  * @returns A new object instance with sorted keys
@@ -21,7 +25,7 @@ export function addPackageToPackageJson(host: Tree, pkg: string, version: string
 
   if (host.exists('package.json')) {
     const sourceText = host.read('package.json')!.toString('utf-8');
-    const json = JSON.parse(sourceText);
+    const json = JSON.parse(sourceText) as PackageJson;
 
     if (!json.dependencies) {
       json.dependencies = {};
@@ -44,7 +48,7 @@ export function getPackageVersionFromPackageJson(tree: Tree, name: string): stri
     return null;
   }
 
-  const packageJson = JSON.parse(tree.read('package.json')!.toString('utf8'));
+  const packageJson = JSON.parse(tree.read('package.json')!.toString('utf8')) as PackageJson;
 
   if (packageJson.dependencies && packageJson.dependencies[name]) {
     return packageJson.dependencies[name];

src/e2e-app/BUILD.bazel

@@ -1,4 +1,4 @@
-load("@npm//@bazel/typescript:index.bzl", "ts_devserver")
+load("@npm//@bazel/concatjs:index.bzl", "concatjs_devserver")
 load("//:packages.bzl", "getAngularUmdTargets")
 load("//tools:defaults.bzl", "ng_module", "sass_binary")
 
@@ -85,7 +85,7 @@ sass_binary(
     ],
 )
 
-ts_devserver(
+concatjs_devserver(
     name = "devserver",
     testonly = True,
     additional_root_paths = [

src/material-experimental/mdc-helpers/BUILD.bazel

@@ -10,7 +10,28 @@ filegroup(
 
 npm_sass_library(
     name = "mdc_scss_deps_lib",
-    deps = ["@npm//material-components-web"],
+    deps = [
+        "@npm//@material/card",
+        "@npm//@material/checkbox",
+        "@npm//@material/chips",
+        "@npm//@material/circular-progress",
+        "@npm//@material/data-table",
+        "@npm//@material/dialog",
+        "@npm//@material/fab",
+        "@npm//@material/form-field",
+        "@npm//@material/linear-progress",
+        "@npm//@material/list",
+        "@npm//@material/menu-surface",
+        "@npm//@material/radio",
+        "@npm//@material/snackbar",
+        "@npm//@material/switch",
+        "@npm//@material/tab",
+        "@npm//@material/tab-bar",
+        "@npm//@material/tab-indicator",
+        "@npm//@material/textfield",
+        "@npm//@material/tooltip",
+        "@npm//material-components-web",
+    ],
 )
 
 sass_library(

src/material/schematics/ng-add/index.spec.ts

@@ -13,6 +13,10 @@ import {getWorkspace} from '@schematics/angular/utility/workspace';
 import {COLLECTION_PATH} from '../index.spec';
 import {addPackageToPackageJson} from './package-config';
 
+interface PackageJson {
+  dependencies: Record<string, string>;
+}
+
 describe('ng-add schematic', () => {
   let runner: SchematicTestRunner;
   let appTree: Tree;
@@ -43,7 +47,7 @@ describe('ng-add schematic', () => {
 
   /** Removes the specified dependency from the /package.json in the given tree. */
   function removePackageJsonDependency(tree: Tree, dependencyName: string) {
-    const packageContent = JSON.parse(getFileContent(tree, '/package.json'));
+    const packageContent = JSON.parse(getFileContent(tree, '/package.json')) as PackageJson;
     delete packageContent.dependencies[dependencyName];
     tree.overwrite('/package.json', JSON.stringify(packageContent, null, 2));
   }
@@ -55,7 +59,7 @@ describe('ng-add schematic', () => {
     removePackageJsonDependency(appTree, '@angular/animations');
 
     const tree = await runner.runSchematicAsync('ng-add', {}, appTree).toPromise();
-    const packageJson = JSON.parse(getFileContent(tree, '/package.json'));
+    const packageJson = JSON.parse(getFileContent(tree, '/package.json')) as PackageJson;
     const dependencies = packageJson.dependencies;
     const angularCoreVersion = dependencies['@angular/core'];
 
@@ -87,7 +91,7 @@ describe('ng-add schematic', () => {
     addPackageToPackageJson(appTree, '@angular/material', '^9.0.0');
 
     const tree = await runner.runSchematicAsync('ng-add', {}, appTree).toPromise();
-    const packageJson = JSON.parse(getFileContent(tree, '/package.json'));
+    const packageJson = JSON.parse(getFileContent(tree, '/package.json')) as PackageJson;
     const dependencies = packageJson.dependencies;
 
     expect(dependencies['@angular/material']).toBe('^9.0.0');