Update Angular dev and peer dependencies to version 16.0.0-rc.1 and u…

…pdate zone.js to version 0.13.0; add check for Angular version 16 or newer before running ngcc

code/frameworks/angular/package.json

@@ -66,18 +66,18 @@
     "webpack": "5"
   },
   "devDependencies": {
-    "@angular-devkit/architect": "^0.1500.4",
-    "@angular-devkit/build-angular": "^15.1.1",
-    "@angular-devkit/core": "^15.1.1",
-    "@angular/animations": "^15.1.1",
-    "@angular/cli": "^15.1.1",
-    "@angular/common": "^15.1.1",
-    "@angular/compiler": "^15.1.1",
-    "@angular/compiler-cli": "^15.1.1",
-    "@angular/core": "^15.1.1",
-    "@angular/forms": "^15.1.1",
-    "@angular/platform-browser": "^15.1.1",
-    "@angular/platform-browser-dynamic": "^15.1.1",
+    "@angular-devkit/architect": "^0.1600.0-rc.1",
+    "@angular-devkit/build-angular": "^16.0.0-rc.1",
+    "@angular-devkit/core": "^16.0.0-rc.1",
+    "@angular/animations": "^16.0.0-rc.1",
+    "@angular/cli": "^16.0.0-rc.1",
+    "@angular/common": "^16.0.0-rc.1",
+    "@angular/compiler": "^16.0.0-rc.1",
+    "@angular/compiler-cli": "^16.0.0-rc.1",
+    "@angular/core": "^16.0.0-rc.1",
+    "@angular/forms": "^16.0.0-rc.1",
+    "@angular/platform-browser": "^16.0.0-rc.1",
+    "@angular/platform-browser-dynamic": "^16.0.0-rc.1",
     "@types/rimraf": "^3.0.2",
     "@types/tmp": "^0.2.3",
     "cross-spawn": "^7.0.3",
@@ -88,20 +88,20 @@
     "tmp": "^0.2.1",
     "typescript": "~4.9.3",
     "webpack": "5",
-    "zone.js": "^0.12.0"
+    "zone.js": "^0.13.0"
   },
   "peerDependencies": {
-    "@angular-devkit/architect": ">=0.1400.0 < 0.1600.0",
+    "@angular-devkit/architect": ">=0.1400.0 < 0.1700.0",
     "@angular-devkit/build-angular": ">=14.1.0 < 17.0.0",
-    "@angular-devkit/core": ">=14.1.0 < 16.0.0",
-    "@angular/cli": ">=14.1.0 < 16.0.0",
-    "@angular/common": ">=14.1.0 < 16.0.0",
-    "@angular/compiler": ">=14.1.0 < 16.0.0",
-    "@angular/compiler-cli": ">=14.1.0 < 16.0.0",
-    "@angular/core": ">=14.1.0 < 16.0.0",
-    "@angular/forms": ">=14.1.0 < 16.0.0",
-    "@angular/platform-browser": ">=14.1.0 < 16.0.0",
-    "@angular/platform-browser-dynamic": ">=14.1.0 < 16.0.0",
+    "@angular-devkit/core": ">=14.1.0 < 17.0.0",
+    "@angular/cli": ">=14.1.0 < 17.0.0",
+    "@angular/common": ">=14.1.0 < 17.0.0",
+    "@angular/compiler": ">=14.1.0 < 17.0.0",
+    "@angular/compiler-cli": ">=14.1.0 < 17.0.0",
+    "@angular/core": ">=14.1.0 < 17.0.0",
+    "@angular/forms": ">=14.1.0 < 17.0.0",
+    "@angular/platform-browser": ">=14.1.0 < 17.0.0",
+    "@angular/platform-browser-dynamic": ">=14.1.0 < 17.0.0",
     "@babel/core": "*",
     "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
     "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0",

code/frameworks/angular/src/server/framework-preset-angular-ivy.ts

@@ -1,4 +1,5 @@
 import { Configuration } from 'webpack';
+import { VERSION } from '@angular/core';
 import * as path from 'path';
 import { Preset } from '@storybook/types';
 
@@ -30,13 +31,12 @@ function loadEsmModule<T>(modulePath: string): Promise<T> {
  * Information about Ivy can be found here https://angular.io/guide/ivy
  */
 export const runNgcc = async () => {
-  let ngcc: typeof import('@angular/compiler-cli/ngcc');
+  let ngcc: any;
   try {
-    ngcc = await import('@angular/compiler-cli/ngcc');
+    // eslint-disable-next-line global-require
+    ngcc = require('@angular/compiler-cli/ngcc');
   } catch (error) {
-    ngcc = await loadEsmModule<typeof import('@angular/compiler-cli/ngcc')>(
-      '@angular/compiler-cli/ngcc'
-    );
+    ngcc = await loadEsmModule('@angular/compiler-cli/ngcc');
   }
 
   ngcc.process({
@@ -52,13 +52,15 @@ export const runNgcc = async () => {
 export const webpack = async (webpackConfig: Configuration, options: PresetOptions) => {
   const framework = await options.presets.apply<Preset>('framework');
   const angularOptions = (typeof framework === 'object' ? framework.options : {}) as AngularOptions;
+  const isAngular16OrNewer = parseInt(VERSION.major, 10) >= 16;
 
   // Default to true, if undefined
   if (angularOptions.enableIvy === false) {
     return webpackConfig;
   }
 
-  if (angularOptions.enableNgcc !== false) {
+  if (angularOptions.enableNgcc !== false && !isAngular16OrNewer) {
+    // TODO: Drop if Angular 14 and 15 are not supported anymore
     runNgcc();
   }