fix(@angular-devkit/build-angular): improve Safari browserslist to esbuild target conversion

The browser targets provided by `browserslist` have several differences than what `esbuild` expects for the Safari browsers. The first is that the iOS Safari is named `ios_saf` within browserslist and `ios` by esbuild. The former is now converted to the later when generating the target list for esbuild.  The second difference is that `browserslist` supports a `TP` (Technology Preview) version for Safari but esbuild expects a numeric value for all versions. Since a TP version of Safari is assumed to be the latest unreleased version and as a result supports all currently known features, a high version number (999) is used as a replacement when generating the target list for esbuild.

Author: clydin

packages/angular_devkit/build_angular/src/webpack/plugins/css-optimizer-plugin.ts

@@ -129,8 +129,23 @@ export class CssOptimizerPlugin {
     const esBuildSupportedBrowsers = new Set(['safari', 'firefox', 'edge', 'chrome', 'ios']);
 
     for (const browser of supportedBrowsers) {
-      const [browserName, version] = browser.split(' ');
+      let [browserName, version] = browser.split(' ');
+
+      // browserslist uses the name `ios_saf` for iOS Safari whereas esbuild uses `ios`
+      if (browserName === 'ios_saf') {
+        browserName = 'ios';
+        // browserslist also uses ranges for iOS Safari versions but only the lowest is required
+        // to perform minimum supported feature checks. esbuild also expects a single version.
+        [version] = version.split('-');
+      }
+
       if (esBuildSupportedBrowsers.has(browserName)) {
+        if (browserName === 'safari' && version === 'TP') {
+          // esbuild only supports numeric versions so `TP` is converted to a high number (999) since
+          // a Technology Preview (TP) of Safari is assumed to support all currently known features.
+          version = '999';
+        }
+
         transformed.push(browserName + version);
       }
     }