build: migrate @angular/ssr tests to rules_js

devversion · devversion · commit af25379a3b9d · 2025-01-23T15:27:55.000+01:00
Migrates the SSR tesst to run natively via `rules_js`. Notably, we still
need the bundling in between as the tests and SSR plain code is not
valid ESM technically; due to lack of extensions.

We'll need to revisit this in the future, or at the very least come up
with a `rules_js`-variant of the `spec_bundle`; but for this is
sufficient and unblocks other packages.
diff --git a/.aspect/rules/external_repository_action_cache/npm_translate_lock_MzA5NzUwNzMx b/.aspect/rules/external_repository_action_cache/npm_translate_lock_MzA5NzUwNzMx
@@ -3,16 +3,19 @@
 # This file should be checked into version control along with the pnpm-lock.yaml file.
 .npmrc=-1406867100
 package.json=52016778
+packages/angular/build/package.json=-235216329
 packages/angular/cli/package.json=-1878910022
 packages/angular/pwa/package.json=1108903917
+packages/angular/ssr/package.json=1104313629
 packages/angular_devkit/architect/package.json=-1496633956
 packages/angular_devkit/architect_cli/package.json=1551210941
+packages/angular_devkit/build_angular/package.json=-949307408
 packages/angular_devkit/build_webpack/package.json=373950017
 packages/angular_devkit/core/package.json=339935828
 packages/angular_devkit/schematics/package.json=673943597
 packages/angular_devkit/schematics_cli/package.json=-1663529211
 packages/ngtools/webpack/package.json=1463215526
 packages/schematics/angular/package.json=251715148
-pnpm-lock.yaml=836728353
-pnpm-workspace.yaml=1732591250
+pnpm-lock.yaml=-614321662
+pnpm-workspace.yaml=-1635877240
 yarn.lock=1005429013
diff --git a/BUILD.bazel b/BUILD.bazel
@@ -34,18 +34,28 @@ rules_js_tsconfig(
 )
 
 rules_js_tsconfig(
-    name = "build-tsconfig-angular",
-    src = "tsconfig-build-ng.json",
+    name = "test-tsconfig",
+    src = "tsconfig-test.json",
     deps = [
         "tsconfig.json",
+        "//:node_modules/@types/jasmine",
+        "//:node_modules/@types/node",
     ],
 )
 
 rules_js_tsconfig(
-    name = "test-tsconfig",
-    src = "tsconfig-test.json",
+    name = "build-tsconfig-esm",
+    src = "tsconfig-build-esm.json",
     deps = [
         "tsconfig.json",
+    ],
+)
+
+rules_js_tsconfig(
+    name = "test-tsconfig-esm",
+    src = "tsconfig-test-esm.json",
+    deps = [
+        ":build-tsconfig-esm",
         "//:node_modules/@types/jasmine",
         "//:node_modules/@types/node",
     ],
@@ -92,8 +102,8 @@ config_setting(
 )
 
 ts_config(
-    name = "tsconfig-build-ng",
-    src = "tsconfig-build-ng.json",
+    name = "tsconfig-build-esm",
+    src = "tsconfig-build-esm.json",
     deps = [
         ":tsconfig.json",
     ],
diff --git a/WORKSPACE b/WORKSPACE
@@ -186,10 +186,13 @@ npm_translate_lock(
     data = [
         "//:package.json",
         "//:pnpm-workspace.yaml",
+        "//packages/angular/build:package.json",
         "//packages/angular/cli:package.json",
         "//packages/angular/pwa:package.json",
+        "//packages/angular/ssr:package.json",
         "//packages/angular_devkit/architect:package.json",
         "//packages/angular_devkit/architect_cli:package.json",
+        "//packages/angular_devkit/build_angular:package.json",
         "//packages/angular_devkit/build_webpack:package.json",
         "//packages/angular_devkit/core:package.json",
         "//packages/angular_devkit/schematics:package.json",
@@ -245,5 +248,4 @@ http_archive(
 
 load("@aspect_rules_jasmine//jasmine:dependencies.bzl", "rules_jasmine_dependencies")
 
-# Fetch dependencies which users need as well
 rules_jasmine_dependencies()
diff --git a/packages/angular/ssr/BUILD.bazel b/packages/angular/ssr/BUILD.bazel
@@ -1,7 +1,8 @@
+load("@aspect_rules_js//npm:defs.bzl", "npm_package")
 load("@npm//@angular/build-tooling/bazel/api-golden:index.bzl", "api_golden_test_npm_package")
 load("@rules_pkg//:pkg.bzl", "pkg_tar")
 load("//tools:defaults.bzl", "ng_package")
-load("//tools:interop.bzl", "ts_project")
+load("//tools:defaults2.bzl", "ts_project")
 
 package(default_visibility = ["//visibility:public"])
 
@@ -25,7 +26,7 @@ ts_project(
     ],
     module_name = "@angular/ssr",
     source_map = True,
-    tsconfig = "//:build-tsconfig-angular",
+    tsconfig = "//:build-tsconfig-esm",
     deps = [
         "//:node_modules/@angular/common",
         "//:node_modules/@angular/core",
@@ -37,7 +38,7 @@ ts_project(
 )
 
 ng_package(
-    name = "npm_package",
+    name = "angular_package",
     package_name = "@angular/ssr",
     srcs = [
         ":package.json",
@@ -51,7 +52,6 @@ ng_package(
     nested_packages = [
         "//packages/angular/ssr/schematics:npm_package",
     ],
-    tags = ["release-package"],
     deps = [
         ":ssr",
         "//packages/angular/ssr/node",
@@ -67,6 +67,21 @@ pkg_tar(
     tags = ["manual"],
 )
 
+# TODO: Replace when `ng_package` creates a valid `rules_js`-compliant npm package.
+npm_package(
+    name = "npm_package",
+    srcs = [":angular_package"],
+    replace_prefixes = {
+        "angular_package/": "",
+    },
+    tags = ["release-package"],
+)
+
+alias(
+    name = "pkg",
+    actual = ":npm_package",
+)
+
 api_golden_test_npm_package(
     name = "ssr_api",
     data = [
diff --git a/packages/angular/ssr/node/BUILD.bazel b/packages/angular/ssr/node/BUILD.bazel
@@ -16,7 +16,7 @@ ts_project(
     ],
     module_name = "@angular/ssr/node",
     source_map = True,
-    tsconfig = "//:build-tsconfig-angular",
+    tsconfig = "//:build-tsconfig-esm",
     deps = [
         "//:node_modules/@angular/core",
         "//:node_modules/@angular/platform-server",
diff --git a/packages/angular/ssr/package.json b/packages/angular/ssr/package.json
@@ -2,6 +2,7 @@
   "name": "@angular/ssr",
   "version": "0.0.0-PLACEHOLDER",
   "description": "Angular server side rendering utilities",
+  "type": "module",
   "license": "MIT",
   "homepage": "https://github.com/angular/angular-cli",
   "keywords": [
diff --git a/packages/angular/ssr/test/BUILD.bazel b/packages/angular/ssr/test/BUILD.bazel
@@ -1,13 +1,13 @@
 load("@npm//@angular/build-tooling/bazel/spec-bundling:index.bzl", "spec_bundle")
-load("@npm//@bazel/jasmine:index.bzl", "jasmine_node_test")
-load("//tools:interop.bzl", "ts_project")
+load("//tools:defaults2.bzl", "jasmine_test", "ts_project")
 
 ts_project(
     name = "unit_test_lib",
     testonly = True,
     srcs = glob(
         include = ["**/*.ts"],
     ),
+    tsconfig = "//:test-tsconfig-esm",
     deps = [
         "//:node_modules/@angular/common",
         "//:node_modules/@angular/compiler",
@@ -19,6 +19,8 @@ ts_project(
     ],
 )
 
+# TODO: Replace this with a `rules_js` variant, or make the SSR package
+# native ESM compatible! (import extensions etc.)
 spec_bundle(
     name = "esm_tests_bundled",
     downlevel_async_await = False,
@@ -29,7 +31,9 @@ spec_bundle(
     ],
 )
 
-jasmine_node_test(
+jasmine_test(
     name = "test",
-    deps = [":esm_tests_bundled"],
+    data = [
+        ":esm_tests_bundled",
+    ],
 )
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml
@@ -8,5 +8,6 @@ packages:
   - packages/angular_devkit/schematics_cli
   - packages/angular/cli
   - packages/angular/pwa
+  - packages/angular/ssr
   - packages/schematics/angular
   - packages/ngtools/webpack
diff --git a/tools/bazel/npm_package.bzl b/tools/bazel/npm_package.bzl
@@ -16,6 +16,7 @@ def npm_package(
         stamp_files = [],
         pkg_json = "package.json",
         extra_substitutions = {},
+        replace_prefixes = {},
         **kwargs):
     if name != "pkg":
         fail("Expected npm_package to be named `pkg`. " +
@@ -96,12 +97,12 @@ def npm_package(
         visibility = visibility,
         # Note: Order matters here! Last file takes precedence after replaced prefixes.
         srcs = deps + stamp_targets + [":final_package_json"],
-        replace_prefixes = {
+        replace_prefixes = dict({
             "substituted_final/": "",
             "substituted_with_tars/": "",
             "substituted_with_snapshot_repos/": "",
             "substituted/": "",
-        },
+        }, **replace_prefixes),
         allow_overwrites = True,
         **kwargs
     )
diff --git a/tools/defaults2.bzl b/tools/defaults2.bzl
@@ -8,7 +8,7 @@ def ts_project(**kwargs):
 def npm_package(**kwargs):
     _npm_package(**kwargs)
 
-def jasmine_test(data = [], **kwargs):
+def jasmine_test(data = [], args = [], **kwargs):
     # Create relative path to root, from current package dir. Necessary as
     # we change the `chdir` below to the package directory.
     relative_to_root = "/".join([".."] * len(native.package_name().split("/")))
@@ -18,8 +18,10 @@ def jasmine_test(data = [], **kwargs):
         chdir = native.package_name(),
         args = [
             "--require=%s/node_modules/source-map-support/register.js" % relative_to_root,
-            "**/*.js",
-        ],
+            "**/*spec.js",
+            "**/*spec.mjs",
+            "**/*spec.cjs",
+        ] + args,
         data = data + ["//:node_modules/source-map-support"],
         **kwargs
     )
diff --git a/tsconfig-build-esm.json b/tsconfig-build-esm.json
diff --git a/tsconfig-test-esm.json b/tsconfig-test-esm.json
@@ -0,0 +1,14 @@
+/**
+ * Root tsconfig file for use building all Angular packages. Note there is no rootDir
+ * and therefore any tsconfig in the package directory will need to define its own
+ * rootDir.
+ */
+{
+  "extends": "./tsconfig-build-esm.json",
+  "compilerOptions": {
+    "sourceMap": false,
+    "inlineSourceMap": true,
+    "inlineSources": true,
+    "types": ["node", "jasmine"]
+  }
+}
