fix(angular): do not wrap bootstrap call when setting up ssr in works…

…paces with angular >= 15.2.0 (#16714)

packages/angular/src/generators/host/__snapshots__/host.spec.ts.snap

@@ -22,21 +22,7 @@ export class AppModule {}
 `;
 
 exports[`Host App Generator --ssr should generate the correct files 2`] = `
-"import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
-
-import { AppModule } from './app/app.module';
-
-function bootstrap() {
- platformBrowserDynamic()
- .bootstrapModule(AppModule)
- .catch((err) => console.error(err));
-}
-
-if (document.readyState !== 'loading') {
- bootstrap();
-} else {
- document.addEventListener('DOMContentLoaded', bootstrap);
-}
+"import('./bootstrap').catch((err) => console.error(err));
 "
 `;
 

packages/angular/src/generators/setup-ssr/files/pre-v15-2/src/main.ts__tpl__

@@ -0,0 +1,14 @@
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+import { AppModule } from './app/app.module';
+
+function bootstrap() {
+ platformBrowserDynamic()
+ .bootstrapModule(AppModule)
+ .catch((err) => console.error(err));
+}
+
+if (document.readyState !== 'loading') {
+ bootstrap();
+} else {
+ document.addEventListener('DOMContentLoaded', bootstrap);
+}

packages/angular/src/generators/setup-ssr/lib/generate-files.ts

@@ -4,8 +4,12 @@ import {
  joinPathFragments,
  readProjectConfiguration,
 } from '@nx/devkit';
-import { getInstalledAngularMajorVersion } from '../../utils/version-utils';
+import {
+ getInstalledAngularMajorVersion,
+ getInstalledAngularVersionInfo,
+} from '../../utils/version-utils';
 import type { Schema } from '../schema';
+import { lt } from 'semver';
 
 export function generateSSRFiles(tree: Tree, schema: Schema) {
  const projectRoot = readProjectConfiguration(tree, schema.project).root;
@@ -17,7 +21,8 @@ export function generateSSRFiles(tree: Tree, schema: Schema) {
  { ...schema, tpl: '' }
  );
 
- const angularMajorVersion = getInstalledAngularMajorVersion(tree);
+ const { major: angularMajorVersion, version: angularVersion } =
+ getInstalledAngularVersionInfo(tree);
  if (angularMajorVersion < 15) {
  generateFiles(
  tree,
@@ -26,4 +31,13 @@ export function generateSSRFiles(tree: Tree, schema: Schema) {
  { ...schema, tpl: '' }
  );
  }
+
+ if (lt(angularVersion, '15.2.0')) {
+ generateFiles(
+ tree,
+ joinPathFragments(__dirname, '..', 'files', 'pre-v15-2'),
+ projectRoot,
+ { ...schema, tpl: '' }
+ );
+ }
 }

packages/angular/src/generators/setup-ssr/setup-ssr.spec.ts

@@ -35,20 +35,11 @@ describe('setupSSR', () => {
  `);
  expect(tree.read('apps/app1/src/main.ts', 'utf-8')).toMatchInlineSnapshot(`
  "import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
-
  import { AppModule } from './app/app.module';
 
- function bootstrap() {
- platformBrowserDynamic()
- .bootstrapModule(AppModule)
- .catch((err) => console.error(err));
- }
-
- if (document.readyState !== 'loading') {
- bootstrap();
- } else {
- document.addEventListener('DOMContentLoaded', bootstrap);
- }
+ platformBrowserDynamic()
+ .bootstrapModule(AppModule)
+ .catch((err) => console.error(err));
  "
  `);
  expect(tree.read('apps/app1/tsconfig.server.json', 'utf-8'))
@@ -220,5 +211,40 @@ describe('setupSSR', () => {
  "
  `);
  });
+
+ it('should wrap bootstrap call for Angular versions lower than 15.2', async () => {
+ // ARRANGE
+ const tree = createTreeWithEmptyWorkspace({ layout: 'apps-libs' });
+ await generateTestApplication(tree, {
+ name: 'app1',
+ });
+ updateJson(tree, 'package.json', (json) => ({
+ ...json,
+ dependencies: { '@angular/core': '15.1.0' },
+ }));
+
+ // ACT
+ await setupSsr(tree, { project: 'app1' });
+
+ // ASSERT
+ expect(tree.read('apps/app1/src/main.ts', 'utf-8'))
+ .toMatchInlineSnapshot(`
+ "import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+ import { AppModule } from './app/app.module';
+
+ function bootstrap() {
+ platformBrowserDynamic()
+ .bootstrapModule(AppModule)
+ .catch((err) => console.error(err));
+ }
+
+ if (document.readyState !== 'loading') {
+ bootstrap();
+ } else {
+ document.addEventListener('DOMContentLoaded', bootstrap);
+ }
+ "
+ `);
+ });
  });
 });

packages/angular/src/migrations/update-15-9-0/update-file-server-executor.spec.ts

@@ -78,8 +78,6 @@ describe('updateFileServerExecutor', () => {
  addProjectConfiguration(tree, 'test', project);
 
  // ACT
- expect(async () => {
- await updateFileServerExecutor(tree);
- }).not.toThrow();
+ await expect(updateFileServerExecutor(tree)).resolves.not.toThrow();
  });
 });