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

Author: alan-agius4

Diff for: packages/schematics/angular/server/index.ts

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

Diff for: packages/schematics/angular/server/index_spec.ts

@@ -91,6 +91,12 @@ describe('Server Schematic', () => {
       expect(contents.compilerOptions.types).toEqual(['node']);
       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', () => {
@@ -128,6 +134,12 @@ describe('Server Schematic', () => {
       const contents = tree.readContent(filePath);
       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', () => {