feat(@schematics/angular): enable hydration when adding SSR, SSG or AppShell

This commits updates the internal server schematic that is used by SSR and AppShell schematics to include `provideClientHydration` in the list of providers, which causes hydration to be enabled for application.

For more information about `provideClientHydration`, see: https://angular.io/api/platform-browser/provideClientHydration
This commit is contained in:
Alan Agius 2023-09-22 09:06:38 +00:00 committed by Alan Agius
parent 6daf23faa2
commit 6979eba3c9
2 changed files with 18 additions and 0 deletions

View File

@ -22,6 +22,7 @@ import {
} from '@angular-devkit/schematics'; } from '@angular-devkit/schematics';
import { NodePackageInstallTask } from '@angular-devkit/schematics/tasks'; import { NodePackageInstallTask } from '@angular-devkit/schematics/tasks';
import { posix } from 'node:path'; import { posix } from 'node:path';
import { addRootProvider } from '../utility';
import { import {
NodeDependencyType, NodeDependencyType,
addPackageJsonDependency, addPackageJsonDependency,
@ -220,6 +221,11 @@ export default function (options: ServerOptions): Rule {
updateConfigFileBrowserBuilder(options, tsConfigDirectory), updateConfigFileBrowserBuilder(options, tsConfigDirectory),
]), ]),
addDependencies(), addDependencies(),
addRootProvider(
options.project,
({ code, external }) =>
code`${external('provideClientHydration', '@angular/platform-browser')}()`,
),
]); ]);
}; };
} }

View File

@ -91,6 +91,12 @@ describe('Server Schematic', () => {
expect(contents.compilerOptions.types).toEqual(['node']); expect(contents.compilerOptions.types).toEqual(['node']);
expect(contents.files).toEqual(['src/main.ts', 'src/main.server.ts']); expect(contents.files).toEqual(['src/main.ts', 'src/main.server.ts']);
}); });
it(`should add 'provideClientHydration' to the providers list`, async () => {
const tree = await schematicRunner.runSchematic('server', defaultOptions, appTree);
const contents = tree.readContent('/projects/bar/src/app/app.module.ts');
expect(contents).toContain(`provideClientHydration()`);
});
}); });
describe('standalone application', () => { describe('standalone application', () => {
@ -128,6 +134,12 @@ describe('Server Schematic', () => {
const contents = tree.readContent(filePath); const contents = tree.readContent(filePath);
expect(contents).toContain(`const serverConfig: ApplicationConfig = {`); expect(contents).toContain(`const serverConfig: ApplicationConfig = {`);
}); });
it(`should add 'provideClientHydration' to the providers list`, async () => {
const tree = await schematicRunner.runSchematic('server', defaultOptions, appTree);
const contents = tree.readContent('/projects/bar/src/app/app.config.ts');
expect(contents).toContain(`providers: [provideClientHydration()]`);
});
}); });
describe('Legacy browser builder', () => { describe('Legacy browser builder', () => {