build: update to [email protected]

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

Author: josephperrott

WORKSPACE

@@ -8,21 +8,17 @@ 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",
     ],
 )
 
@@ -49,10 +45,6 @@ node_repositories(
 
 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 = [
@@ -61,22 +53,15 @@ yarn_install(
     ],
     package_json = "//:package.json",
     quiet = False,
+    strict_visibility = False,
     yarn_lock = "//:yarn.lock",
 )
 
-# Install all bazel dependencies of the @ngdeps npm packages
-load("@npm//:install_bazel_dependencies.bzl", "install_bazel_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,
-)
+load("@npm//@bazel/protractor:package.bzl", "npm_bazel_protractor_dependencies")
 
-# Fetch transitive dependencies which are needed to use the karma rules.
-load("@npm//@bazel/karma:package.bzl", "npm_bazel_karma_dependencies")
+npm_bazel_protractor_dependencies()
 
-npm_bazel_karma_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)

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

@@ -71,6 +71,55 @@
     "zone.js": "~0.11.3"
   },
   "devDependencies": {
+    "diff": "^3.5.0",
+    "reflect-metadata": "^0.1.3",
+    "@material/animation": "10.0.0-canary.d29ec2862.0",
+    "@material/auto-init": "10.0.0-canary.d29ec2862.0",
+    "@material/banner": "10.0.0-canary.d29ec2862.0",
+    "@material/base": "10.0.0-canary.d29ec2862.0",
+    "@material/button": "10.0.0-canary.d29ec2862.0",
+    "@material/card": "10.0.0-canary.d29ec2862.0",
+    "@material/checkbox": "10.0.0-canary.d29ec2862.0",
+    "@material/chips": "10.0.0-canary.d29ec2862.0",
+    "@material/circular-progress": "10.0.0-canary.d29ec2862.0",
+    "@material/data-table": "10.0.0-canary.d29ec2862.0",
+    "@material/density": "10.0.0-canary.d29ec2862.0",
+    "@material/dialog": "10.0.0-canary.d29ec2862.0",
+    "@material/dom": "10.0.0-canary.d29ec2862.0",
+    "@material/drawer": "10.0.0-canary.d29ec2862.0",
+    "@material/elevation": "10.0.0-canary.d29ec2862.0",
+    "@material/fab": "10.0.0-canary.d29ec2862.0",
+    "@material/feature-targeting": "10.0.0-canary.d29ec2862.0",
+    "@material/floating-label": "10.0.0-canary.d29ec2862.0",
+    "@material/form-field": "10.0.0-canary.d29ec2862.0",
+    "@material/icon-button": "10.0.0-canary.d29ec2862.0",
+    "@material/image-list": "10.0.0-canary.d29ec2862.0",
+    "@material/layout-grid": "10.0.0-canary.d29ec2862.0",
+    "@material/line-ripple": "10.0.0-canary.d29ec2862.0",
+    "@material/linear-progress": "10.0.0-canary.d29ec2862.0",
+    "@material/list": "10.0.0-canary.d29ec2862.0",
+    "@material/menu": "10.0.0-canary.d29ec2862.0",
+    "@material/menu-surface": "10.0.0-canary.d29ec2862.0",
+    "@material/notched-outline": "10.0.0-canary.d29ec2862.0",
+    "@material/radio": "10.0.0-canary.d29ec2862.0",
+    "@material/ripple": "10.0.0-canary.d29ec2862.0",
+    "@material/rtl": "10.0.0-canary.d29ec2862.0",
+    "@material/segmented-button": "10.0.0-canary.d29ec2862.0",
+    "@material/select": "10.0.0-canary.d29ec2862.0",
+    "@material/shape": "10.0.0-canary.d29ec2862.0",
+    "@material/slider": "10.0.0-canary.d29ec2862.0",
+    "@material/snackbar": "10.0.0-canary.d29ec2862.0",
+    "@material/switch": "10.0.0-canary.d29ec2862.0",
+    "@material/tab": "10.0.0-canary.d29ec2862.0",
+    "@material/tab-bar": "10.0.0-canary.d29ec2862.0",
+    "@material/tab-indicator": "10.0.0-canary.d29ec2862.0",
+    "@material/tab-scroller": "10.0.0-canary.d29ec2862.0",
+    "@material/textfield": "10.0.0-canary.d29ec2862.0",
+    "@material/theme": "10.0.0-canary.d29ec2862.0",
+    "@material/tooltip": "10.0.0-canary.d29ec2862.0",
+    "@material/top-app-bar": "10.0.0-canary.d29ec2862.0",
+    "@material/touch-target": "10.0.0-canary.d29ec2862.0",
+    "@material/typography": "10.0.0-canary.d29ec2862.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",
@@ -85,12 +134,12 @@
     "@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/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/universal-app/BUILD.bazel

@@ -59,5 +59,11 @@ nodejs_test(
         ":server",
         ":theme_scss",
     ],
+
+    templated_args = [
+            # TODO(josephperrott): update dependency usages to no longer need bazel patch module resolver
+            # See: https://github.com/bazelbuild/rules_nodejs/wiki#--bazel_patch_module_resolver-now-defaults-to-false-2324
+            "--bazel_patch_module_resolver",
+    ],
     entry_point = ":prerender.ts",
 )

test/bazel-karma-local-config.js

@@ -3,12 +3,12 @@
  * want to launch any browser and just enable manual browser debugging.
  */
 
-const bazelKarma = require('@bazel/karma');
+const bazelKarma = require('@bazel/concatjs');
 
 module.exports = config => {
   const overwrites = {};
 
-  // By default "@bazel/karma" configures Chrome as browser. Since we don't want
+  // By default "@bazel/concatjs" configures Chrome as browser. Since we don't want
   // to launch any browser at all, we overwrite the "browsers" option. Since the
   // default config tries to extend the browsers array with "Chrome", we need to
   // always return a new empty array.
@@ -19,16 +19,16 @@ module.exports = config => {
   });
 
   // Ensures that tests start executing once browsers have been manually connected. We need
-  // to use "defineProperty" because the default "@bazel/karma" config overwrites the option.
+  // to use "defineProperty" because the default "@bazel/concatjs" config overwrites the option.
   Object.defineProperty(overwrites, 'autoWatch', {
     get: () => true,
     set: () => {},
     enumerable: true,
   });
 
-  // When not running with ibazel, do not set up the `@bazel/karma` watcher. This one
+  // When not running with ibazel, do not set up the `@bazel/concatjs` watcher. This one
   // relies on ibazel to write to the `stdin` interface. When running without ibazel, the
-  // watcher will kill Karma since there is no data written to the `stdin` interface.
+  // watcher will kill concatjs since there is no data written to the `stdin` interface.
   if (process.env['IBAZEL_NOTIFY_CHANGES'] !== 'y') {
     delete bazelKarma['watcher'];
   }

tools/defaults.bzl

@@ -3,7 +3,7 @@
 load("@io_bazel_rules_sass//:defs.bzl", _sass_binary = "sass_binary", _sass_library = "sass_library")
 load("@npm//@angular/bazel:index.bzl", _ng_module = "ng_module", _ng_package = "ng_package")
 load("@npm//@bazel/jasmine:index.bzl", _jasmine_node_test = "jasmine_node_test")
-load("@npm//@bazel/karma:index.bzl", _karma_web_test = "karma_web_test", _karma_web_test_suite = "karma_web_test_suite")
+load("@npm//@bazel/concatjs:index.bzl", _karma_web_test = "karma_web_test", _karma_web_test_suite = "karma_web_test_suite")
 load("@npm//@bazel/protractor:index.bzl", _protractor_web_test_suite = "protractor_web_test_suite")
 load("@npm//@bazel/typescript:index.bzl", _ts_library = "ts_library")
 load("//:packages.bzl", "VERSION_PLACEHOLDER_REPLACEMENTS", "getAngularUmdTargets")

tools/dev-server/BUILD.bazel

@@ -25,6 +25,7 @@ ts_library(
 
 nodejs_binary(
     name = "dev-server_bin",
+    templated_args = ["--bazel_patch_module_resolver"],
     data = [
         ":dev-server_lib",
     ],

tools/dgeni/BUILD.bazel

@@ -5,6 +5,7 @@ package(default_visibility = ["//visibility:public"])
 
 nodejs_binary(
     name = "dgeni",
+    templated_args = ["--bazel_patch_module_resolver"],
     data = [
         ":sources",
         "@npm//dgeni",

tools/example-module/BUILD.bazel

@@ -15,6 +15,7 @@ ts_library(
 
 nodejs_binary(
     name = "bazel-bin",
+    templated_args = ["--bazel_patch_module_resolver"],
     data = [
         ":example-module.template",
         ":example-module-lib",

tools/highlight-files/BUILD.bazel

@@ -10,6 +10,7 @@ ts_library(
     deps = [
         "//tools/region-parser",
         "@npm//@types/fs-extra",
+        "@npm//fs-extra",
         "@npm//@types/node",
     ],
 )
@@ -21,5 +22,10 @@ nodejs_binary(
         "@npm//fs-extra",
         "@npm//highlight.js",
     ],
+    templated_args = [
+            # TODO(josephperrott): update dependency usages to no longer need bazel patch module resolver
+            # See: https://github.com/bazelbuild/rules_nodejs/wiki#--bazel_patch_module_resolver-now-defaults-to-false-2324
+            "--bazel_patch_module_resolver",
+    ],
     entry_point = ":highlight-files.ts",
 )

tools/markdown-to-html/BUILD.bazel

@@ -15,6 +15,7 @@ ts_library(
     deps = [
         "//tools/highlight-files:sources",
         "@npm//@types/marked",
+        "@npm//marked",
         "@npm//@types/node",
     ],
 )
@@ -26,6 +27,7 @@ nodejs_binary(
         "@npm//highlight.js",
         "@npm//marked",
     ],
+    templated_args = ["--bazel_patch_module_resolver"],
     entry_point = ":transform-markdown.ts",
 )
 

tools/markdown-to-html/docs-marked-renderer.ts

@@ -81,7 +81,8 @@ export class DocsMarkdownRenderer extends Renderer {
     html = html.replace(exampleCommentRegex, (_match: string, content: string) => {
         // using [\s\S]* because .* does not match line breaks
         if (content.match(/\{[\s\S]*\}/g)) {
-          const {example, file, region} = JSON.parse(content);
+          const {example, file, region} = JSON.parse(content) as {
+            example: string, file: string, region: string};
           return `<div material-docs-example="${example}"
                              ${file ? `file="${file}"` : ''}
                              ${region ? `region="${region}"` : ''}></div>`;

tools/package-docs-content/BUILD.bazel

@@ -9,6 +9,7 @@ nodejs_binary(
         ":sources",
         "@npm//fs-extra",
     ],
+    templated_args = ["--bazel_patch_module_resolver"],
     entry_point = ":package-docs-content.ts",
 )
 

tools/postinstall/@bazel_typescript_tsc_wrapped_worker_cache_fix.patch

@@ -87,7 +87,7 @@ function applyPatches() {
     const hasFlatModuleBundle = fs.existsSync(filePath.replace('.d.ts', '.metadata.json'));
     if ((filePath.includes('node_modules/') || !hasFlatModuleBundle) && $1`,
       'node_modules/@angular/compiler-cli/src/transformers/compiler_host.js');
-  applyPatch(path.join(__dirname, './flat_module_factory_resolution.patch'));
+//  applyPatch(path.join(__dirname, './flat_module_factory_resolution.patch'));
   // The three replacements below ensure that metadata files can be read by NGC and
   // that metadata files are collected as Bazel action inputs.
   searchAndReplace(
@@ -108,10 +108,7 @@ function applyPatches() {
       'node_modules/@angular/bazel/src/ng_module.bzl');
 
   // Workaround for: https://github.com/bazelbuild/rules_nodejs/issues/1208.
-  applyPatch(path.join(__dirname, './manifest_externs_hermeticity.patch'));
-
-  // Patches the changes from: https://github.com/bazelbuild/rules_typescript/pull/504.
-  applyPatch(path.join(__dirname, './@bazel_typescript_tsc_wrapped_worker_cache_fix.patch'));
+//  applyPatch(path.join(__dirname, './manifest_externs_hermeticity.patch'));
 
   // Workaround for https://github.com/angular/angular/issues/33452:
   searchAndReplace(