feat(@schematics/angular): augment universal schematics to import platform-server shims

In angular/angular#40559, a new `@angular/platform-server/shims`
entry-point was introduced, which can be used to shim the server
environment with APIs normally provided by the browser (such as DOM
globals).

If the project is using a version of Angular (and thus
`@angular/platform-server`) that is known to include this new
entry-point, the newly generated `main.server.ts` file should import it
at the top in order to ensure that the shims will be available as soon
as possible (before other direct or transitive imports that may rely on
them). See also angular/angular#40559 for more details.

NOTE:
This `universal` schematic is the base for `app-shell`,
`@nguniversal/express-engine` and `@nguniversal/hapi-engine`.

Author: gkalpak

packages/schematics/angular/universal/files/src/__main@stripTsExtension__.ts.template

@@ -1,6 +1,15 @@
-<% if (hasLocalizePackage) { %>/***************************************************************************************************
+<% if (hasPlatformServerShims) { %>/***************************************************************************************************
+ * Load `@angular/platform-server` shims onto the global scope - provides DOM built-in types on the server.
+ *
+ * NOTE:
+ * This import must come before any imports (direct or transitive) that rely on DOM built-ins being
+ * available, such as `@angular/elements`.
+ */
+import '@angular/localize/init';
+
+<% } %><% if (hasLocalizePackage) { %>/***************************************************************************************************
  * Load `$localize` onto the global scope - used if i18n tags appear in Angular templates.
-*/
+ */
 import '@angular/localize/init';
 
 <% } %>import { enableProdMode } from '@angular/core';

packages/schematics/angular/universal/index.ts

@@ -248,6 +248,8 @@ export default function (options: UniversalOptions): Rule {
     // and we don't want to break the 'ng add @nguniversal/express-engine schematics'
     const rootInSrc = clientProject.root === '' && clientTsConfig.includes('src/');
     const tsConfigDirectory = join(normalize(clientProject.root), rootInSrc ? 'src' : '');
+    const ngVersion = getPackageJsonDependency(host, '@angular/core')?.version ?? '0.0.0';
+    const ngMajorVersion = ngVersion.match(/^[^~>=]*(\d+)/)?.[1] ?? '0';
 
     if (!options.skipInstall) {
       context.addTask(new NodePackageInstallTask());
@@ -259,6 +261,7 @@ export default function (options: UniversalOptions): Rule {
         ...options as object,
         stripTsExtension: (s: string) => s.replace(/\.ts$/, ''),
         hasLocalizePackage: !!getPackageJsonDependency(host, '@angular/localize'),
+        hasPlatformServerShims: Number(ngMajorVersion) >= 12,
       }),
       move(join(normalize(clientProject.root), 'src')),
     ]);