build: switch to rules_angular CLI rules

.github/workflows/docs-preview-build.yml

@@ -35,4 +35,4 @@ jobs:
           workflow-artifact-name: 'docs-preview'
           pull-number: '${{github.event.pull_request.number}}'
           artifact-build-revision: '${{github.event.pull_request.head.sha}}'
-          deploy-directory: './dist/bin/docs/material-angular-io.production'
+          deploy-directory: './dist/bin/docs/dist'

WORKSPACE

@@ -88,7 +88,6 @@ npm_translate_lock(
     },
     data = [
         "//:package.json",
-        "//:patches/@angular-devkit__architect-cli.patch",
         "//:pnpm-workspace.yaml",
         "//integration:package.json",
         "//src/cdk:package.json",
@@ -204,7 +203,7 @@ setup_dependencies_2()
 
 git_repository(
     name = "rules_angular",
-    commit = "0a54fca16350cab2b823908f1725aec175fcfeb2",
+    commit = "84a8039330a4accc86f0b53c4ef5ff745c3e1bbe",
     remote = "https://github.com/devversion/rules_angular.git",
 )
 

docs/BUILD.bazel

@@ -1,3 +1,4 @@
+load("@rules_angular//src/architect:ng_config.bzl", "ng_config")
 load("@aspect_bazel_lib//lib:copy_to_bin.bzl", "copy_to_bin")
 load("@aspect_rules_js//js:defs.bzl", "js_binary", "js_library", "js_test")
 load("@npm//:defs.bzl", "npm_link_all_packages")
@@ -12,9 +13,7 @@ npm_link_all_packages(name = "node_modules")
 copy_to_bin(
     name = "ng-base-config",
     srcs = [
-        "angular.json",
         "package.json",
-        "tsconfig.json",
     ],
 )
 
@@ -26,6 +25,10 @@ copy_to_bin(
     ],
 )
 
+ng_config(
+    name = "config",
+)
+
 # The main application
 ng_app(
     name = "app",
@@ -39,6 +42,11 @@ ng_app(
     ],
 )
 
+alias(
+    name = "serve",
+    actual = ":build.serve",
+)
+
 js_library(
     name = "audit_lib",
     srcs = [

docs/angular.json

@@ -109,7 +109,7 @@
           "builder": "@angular-devkit/build-angular:dev-server",
           "options": {
             "headers": {
-              // Keep in sync with `firebase.json`
+              "--NOTE--": "Keep in sync with `firebase.json`",
               "Content-Security-Policy": "upgrade-insecure-requests; default-src 'self'; font-src 'self' https://fonts.gstatic.com; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com; img-src 'self' data: *; frame-src https://www.youtube.com; media-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval' https://*.google-analytics.com https://www.googletagmanager.com; child-src 'self' blob:; connect-src 'self' https://material.angular.io https://*.google-analytics.com https://stats.g.doubleclick.net https://api.github.com https://www.googletagmanager.com;"
             },
             "buildTarget": "material-angular-io:build"

docs/defs.bzl

@@ -1,4 +1,5 @@
-load("@npm//:@angular-devkit/architect-cli/package_json.bzl", architect_cli = "bin")
+load("@rules_angular//src/architect:ng_application.bzl", "ng_application")
+load("@rules_angular//src/architect:ng_test.bzl", "ng_test")
 load("@aspect_bazel_lib//lib:copy_to_bin.bzl", "copy_to_bin")
 
 # NOTE:
@@ -9,66 +10,38 @@ load("@aspect_bazel_lib//lib:copy_to_bin.bzl", "copy_to_bin")
 COMMON_CONFIG = [
     "//docs:ng-base-config",
 
-    # The architect-cli invoking the build
-    "//docs:node_modules/@angular-devkit/architect-cli",
-
     # Required for angular.json reference to '@angular/cli/lib/config/schema.json'
     "//docs:node_modules/@angular/cli",
 
     # builders referenced from angular.json
     "//docs:node_modules/@angular-devkit/build-angular",
 ]
 
-# Standard dependencies common across libs/tests
-# Only include the core Angular + Components/Material which are versioned together
-NG_COMMON_DEPS = [
-    # Angular libraries versioned together
-    "//docs:node_modules/@angular/animations",
-    "//docs:node_modules/@angular/common",
-    "//docs:node_modules/@angular/core",
-    "//docs:node_modules/@angular/forms",
-    "//docs:node_modules/@angular/localize",
-    "//docs:node_modules/@angular/router",
-    "//docs:node_modules/@angular/platform-browser",
-    "//docs:node_modules/@angular/platform-browser-dynamic",
-
-    # Angular cdk+material libraries versioned together
+# Project dependencies common across libs/tests
+DEPS = [
     "//docs:node_modules/@angular/cdk",
     "//docs:node_modules/@angular/cdk-experimental",
     "//docs:node_modules/@angular/material",
     "//docs:node_modules/@angular/material-experimental",
     "//docs:node_modules/@angular/material-moment-adapter",
     "//docs:node_modules/@angular/youtube-player",
-
-    # Common libraries used throughout
-    "//docs:node_modules/rxjs",
-    "//docs:node_modules/tslib",
-    "//docs:node_modules/zone.js",
 ]
 
 # Common dependencies of Angular CLI applications
 APPLICATION_CONFIG = COMMON_CONFIG + [
     ":ng-app-config",
 ]
 
-# Common dependencies of Angular CLI test suites
-TEST_CONFIG = COMMON_CONFIG + [
+TEST_DEPS = [
     "@rules_browsers//src/browsers/chromium",
     "@rules_browsers//src/browsers/firefox",
-    "//docs:ng-base-test-config",
-    ":ng-test-config",
-    "//docs:node_modules/karma",
-    "//docs:node_modules/karma-chrome-launcher",
     "//docs:node_modules/karma-firefox-launcher",
-    "//docs:node_modules/karma-jasmine",
-    "//docs:node_modules/karma-jasmine-html-reporter",
-    "//docs:node_modules/karma-coverage-istanbul-reporter",
 ]
-TEST_DEPS = [
-    "//docs:node_modules/@types/jasmine",
-    "//docs:node_modules/@types/node",
-    "//docs:node_modules/@angular/compiler",
-    "//docs:node_modules/jasmine-core",
+
+# Common dependencies of Angular CLI test suites
+TEST_CONFIG = COMMON_CONFIG + [
+    "//docs:ng-base-test-config",
+    ":ng-test-config",
 ]
 
 # Common dependencies of Angular CLI e2e tests
@@ -151,39 +124,23 @@ def ng_app(name, project_name = None, deps = [], test_deps = [], e2e_deps = [],
 
     _architect_build(
         project_name,
-        srcs = srcs + deps + NG_COMMON_DEPS + APPLICATION_CONFIG,
+        srcs = srcs + deps + DEPS + APPLICATION_CONFIG,
         tags = tags + ["manual"],
         **kwargs
     )
     _architect_build(
         project_name,
-        srcs = srcs + deps + NG_COMMON_DEPS + APPLICATION_CONFIG,
+        srcs = srcs + deps + DEPS + APPLICATION_CONFIG,
         configuration = "production",
         tags = tags,
         **kwargs
     )
 
-    _architect_binary(
-        project_name,
-        "serve",
-        srcs = srcs + deps + NG_COMMON_DEPS + APPLICATION_CONFIG,
-        tags = tags + ["manual"],
-        **kwargs
-    )
-    _architect_binary(
-        project_name,
-        "serve",
-        configuration = "production",
-        srcs = srcs + deps + NG_COMMON_DEPS + APPLICATION_CONFIG,
-        tags = tags + ["manual"],
-        **kwargs
-    )
-
     _architect_test(
         project_name,
         "test",
         args = ["--no-watch"],
-        srcs = srcs + test_srcs + deps + test_deps + NG_COMMON_DEPS + TEST_DEPS + TEST_CONFIG,
+        srcs = srcs + test_srcs + deps + test_deps + DEPS + TEST_DEPS + TEST_CONFIG,
         tags = tags,
         **kwargs
     )
@@ -193,7 +150,7 @@ def ng_app(name, project_name = None, deps = [], test_deps = [], e2e_deps = [],
     #     project_name,
     #     "e2e",
     #     size = "large",
-    #     srcs = srcs + e2e_srcs + deps + e2e_deps + NG_COMMON_DEPS + E2E_DEPS + E2E_CONFIG,
+    #     srcs = srcs + e2e_srcs + deps + e2e_deps + DEPS + E2E_DEPS + E2E_CONFIG,
     #     args = [
     #       "--no-webdriver-update",
     #       "--port=0",
@@ -203,21 +160,19 @@ def ng_app(name, project_name = None, deps = [], test_deps = [], e2e_deps = [],
     # )
 
 def _architect_build(project_name, configuration = None, args = [], srcs = [], **kwargs):
-    output_dir = "%s%s" % (project_name, ".%s" % configuration if configuration else "")
+    args = []
 
-    args = [
-        "%s:build%s" % (project_name, ":%s" % configuration if configuration else ""),
-        "--output-path",
-        output_dir,
-    ] + args
+    if configuration != None:
+        args += ["--configuration", configuration]
 
-    architect_cli.architect(
+    ng_application(
         name = "%s%s" % ("build", ".%s" % configuration if configuration else ""),
-        chdir = native.package_name(),
+        ng_config = "//docs:config",
+        node_modules = "//docs:node_modules",
+        project_name = project_name,
+        args = args,
         # Needed for font inlining.
         execution_requirements = {"requires-network": "1"},
-        args = args,
-        out_dirs = [output_dir],
         srcs = srcs,
         **kwargs
     )
@@ -227,33 +182,26 @@ def _architect_test(project_name, command, configuration = None, args = [], srcs
     if native.package_name() != "":
         to_root = "".join(["../" for _ in native.package_name().split("/")])
 
+    args = []
+    if configuration != None:
+        args += ["--configuration", configuration]
+
     env = {
         "CHROME_BIN": to_root + "$(CHROME-HEADLESS-SHELL)",
         "CHROMEDRIVER_BIN": to_root + "$(CHROMEDRIVER)",
     }
 
-    architect_cli.architect_test(
+    ng_test(
         name = "%s%s" % (command, ".%s" % configuration if configuration else ""),
-        chdir = native.package_name(),
-        args = [
-            "%s:%s%s" % (project_name, command, ":%s" % configuration if configuration else ""),
-        ] + args,
-        data = srcs,
+        args = args,
+        project_name = project_name,
+        ng_config = "//docs:config",
+        node_modules = "//docs:node_modules",
+        srcs = srcs,
         env = env,
         toolchains = [
             "@rules_browsers//src/browsers/chromium:toolchain_alias",
             "@rules_browsers//src/browsers/firefox:toolchain_alias",
         ],
         **kwargs
     )
-
-def _architect_binary(project_name, command, configuration = None, args = [], srcs = [], **kwargs):
-    architect_cli.architect_binary(
-        name = "%s%s" % (command, ".%s" % configuration if configuration else ""),
-        chdir = native.package_name(),
-        args = [
-            "%s:%s%s" % (project_name, command, ":%s" % configuration if configuration else ""),
-        ] + args,
-        data = srcs,
-        **kwargs
-    )

docs/karma.conf.js

@@ -17,7 +17,6 @@ module.exports = function (config) {
       require('karma-chrome-launcher'),
       require('karma-firefox-launcher'),
       require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
       require('@angular-devkit/build-angular/plugins/karma'),
     ],
     client: {

docs/package.json

@@ -54,8 +54,6 @@
     "zone.js": "~0.15.0"
   },
   "devDependencies": {
-    "@angular-devkit/architect": "catalog:",
-    "@angular-devkit/architect-cli": "catalog:",
     "@angular-devkit/build-angular": "catalog:",
     "@angular/cli": "catalog:",
     "@angular/compiler-cli": "catalog:",
@@ -68,7 +66,7 @@
     "jasmine-spec-reporter": "7.0.0",
     "karma": "~6.4.4",
     "karma-chrome-launcher": "^3.1.1",
-    "karma-coverage-istanbul-reporter": "^3.0.3",
+    "karma-coverage": "~2.2.0",
     "karma-firefox-launcher": "^2.1.0",
     "karma-jasmine": "^4.0.1",
     "karma-jasmine-html-reporter": "^1.5.4",

docs/scenes/karma.conf.js

@@ -21,7 +21,6 @@ module.exports = function (config) {
       require('karma-chrome-launcher'),
       require('karma-firefox-launcher'),
       require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
       require('@angular-devkit/build-angular/plugins/karma'),
     ],
     client: {

package.json

@@ -57,7 +57,6 @@
   "dependencies": {
     "@angular-devkit/core": "catalog:",
     "@angular-devkit/schematics": "catalog:",
-    "@angular-devkit/architect-cli": "catalog:",
     "@angular/animations": "catalog:",
     "@angular/common": "catalog:",
     "@angular/compiler": "catalog:",
@@ -217,9 +216,6 @@
           "@nginfra/angular-linking": "1.0.9"
         }
       }
-    },
-    "patchedDependencies": {
-      "@angular-devkit/[email protected]": "patches/@angular-devkit__architect-cli.patch"
     }
   }
 }