Skip to content

Commit 891841b

Browse files
devversionzarend
authored andcommitted
build: update prerender test to work with ESM APF v13 packages
This commit updates the pre-render test to work with APF v13 package output which is strict ESM. Since the test runs inside Node, we would need to update our test to run in ESM as well. This is not possible with the Bazel NodeJS rules yet, and also there are a couple of more issues with running ESM devmode directly in NodeJS: * ESM requires an explicit extension for releative imports. TypeScript will not add an explict extension so this breaks for our local package output. A bundler is needed and this is what the CLI will do for SSR as well. * We want the Angular linked ESM bundles for framework packages as these are only partially compiled. This is not possible to do without modifiyng the node modules / or using a bundler that in-memory modifies the resolved framework packages (like the CLI does with its webpack plugins).
1 parent 2977ec7 commit 891841b

File tree

2 files changed

+25
-7
lines changed

2 files changed

+25
-7
lines changed

src/universal-app/BUILD.bazel

Lines changed: 19 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@ load("//src/cdk-experimental:config.bzl", "CDK_EXPERIMENTAL_TARGETS")
44
load("//src/material:config.bzl", "MATERIAL_TARGETS")
55
load("//src/material-experimental:config.bzl", "MATERIAL_EXPERIMENTAL_TARGETS")
66
load("//tools:defaults.bzl", "ng_module", "sass_binary", "ts_library")
7+
load("//tools/esbuild:index.bzl", "esbuild")
8+
load("//tools/angular:index.bzl", "LINKER_PROCESSED_FW_PACKAGES")
79

810
package(default_visibility = ["//visibility:public"])
911

@@ -33,6 +35,7 @@ ts_library(
3335
deps = [
3436
":kitchen-sink",
3537
"@npm//@angular/platform-server",
38+
"@npm//@bazel/runfiles",
3639
"@npm//@types/node",
3740
"@npm//reflect-metadata",
3841
"@npm//zone.js",
@@ -53,14 +56,28 @@ sass_binary(
5356
],
5457
)
5558

59+
esbuild(
60+
name = "server_bundle",
61+
entry_point = ":prerender.ts",
62+
platform = "node",
63+
# We cannot use `ES2017` or higher as that would result in `async/await` not being downleveled.
64+
# ZoneJS needs to be able to intercept these as otherwise change detection would not work properly.
65+
target = "es2016",
66+
# Note: We add all linker-processed FW packages as dependencies here so that ESBuild will
67+
# map all framework packages to their linker-processed bundles from `tools/angular`.
68+
deps = LINKER_PROCESSED_FW_PACKAGES + [
69+
":server",
70+
],
71+
)
72+
5673
nodejs_test(
5774
name = "server_test",
5875
data = [
5976
"index.html",
60-
":server",
77+
":server_bundle",
6178
":theme_scss",
6279
],
63-
entry_point = ":prerender.ts",
80+
entry_point = ":server_bundle.js",
6481
templated_args = [
6582
# TODO(josephperrott): update dependency usages to no longer need bazel patch module resolver
6683
# See: https://github.com/bazelbuild/rules_nodejs/wiki#--bazel_patch_module_resolver-now-defaults-to-false-2324

src/universal-app/prerender.ts

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,21 @@
11
import 'reflect-metadata';
22
import 'zone.js';
33

4-
import {renderModuleFactory} from '@angular/platform-server';
4+
import {renderModule} from '@angular/platform-server';
55
import {readFileSync, writeFileSync} from 'fs';
66
import {join} from 'path';
7+
import {runfiles} from '@bazel/runfiles';
78

8-
import {KitchenSinkRootServerModuleNgFactory} from './kitchen-sink-root.ngfactory';
9+
import {KitchenSinkRootServerModule} from './kitchen-sink-root';
910

1011
// Do not enable production mode, because otherwise the `MatCommonModule` won't execute
1112
// the browser related checks that could cause NodeJS issues.
1213

1314
// Resolve the path to the "index.html" through Bazel runfile resolution.
14-
const indexHtmlPath = require.resolve('./index.html');
15+
const indexHtmlPath = runfiles.resolvePackageRelative('./index.html');
1516

16-
const result = renderModuleFactory(
17-
KitchenSinkRootServerModuleNgFactory, {document: readFileSync(indexHtmlPath, 'utf-8')});
17+
const result = renderModule(
18+
KitchenSinkRootServerModule, {document: readFileSync(indexHtmlPath, 'utf-8')});
1819
const outDir = process.env.TEST_UNDECLARED_OUTPUTS_DIR as string;
1920

2021
result

0 commit comments

Comments
 (0)