fix(@angular-devkit/build-angular): browsers that partially support es6 modules are being marked as not supported

caniuse-api only returns true for a feature when it's fully supported. This might causes redundant ES5 builds if users opt to support only browsers which do support ES6 modules but either require polyfills such as Safari 10.1 or when both bundles will be downloaded such as Edge 18

See: https://github.com/Nyalab/caniuse-api/blob/1b74c10257e36877709da4f6630513db10203a78/src/index.js#L49 and Nyalab/caniuse-api#82

Fixes #14580

Author: alan-agius4

package.json

@@ -88,7 +88,7 @@
     "@bazel/typescript": "~0.26.0",
     "@ngtools/json-schema": "^1.1.0",
     "@types/browserslist": "^4.4.0",
-    "@types/caniuse-api": "^3.0.0",
+    "@types/caniuse-lite": "^1.0.0",
     "@types/copy-webpack-plugin": "^4.4.1",
     "@types/express": "^4.16.0",
     "@types/glob": "^7.0.0",

packages/angular_devkit/build_angular/package.json

@@ -15,7 +15,7 @@
     "ajv": "6.10.0",
     "autoprefixer": "9.5.1",
     "browserslist": "4.5.5",
-    "caniuse-api": "3.0.0",
+    "caniuse-lite": "1.0.30000974",
     "circular-dependency-plugin": "5.0.2",
     "clean-css": "4.2.1",
     "copy-webpack-plugin": "5.0.2",

packages/angular_devkit/build_angular/src/utils/build-browser-features.ts

@@ -34,7 +34,7 @@ export class BuildBrowserFeatures {
    * True, when one or more browsers requires ES5 support
    */
   isEs5SupportNeeded(): boolean {
-    return !caniuse.isSupported('es6-module', this._supportedBrowsers.join(', '));
+    return !this.isFeatureSupported('es6-module');
   }
 
   /**
@@ -55,4 +55,33 @@ export class BuildBrowserFeatures {
 
     return this._supportedBrowsers.some(browser => safariBrowsers.includes(browser));
   }
+
+  /**
+   * True, when a browser feature is supported partially or fully.
+   */
+  isFeatureSupported(featureId: string): boolean {
+    // y: feature is fully available
+    // n: feature is unavailable
+    // a: feature is partially supported
+    // x: feature is prefixed
+    const criteria = [
+      'y',
+      'a',
+    ];
+
+    const data = feature(features[featureId]);
+
+    return !this._supportedBrowsers
+      .some(browser => {
+        const [agentId, version] = browser.split(' ');
+
+        const browserData = data.stats[agentId];
+        const featureStatus = (browserData && browserData[version]) as string | undefined;
+
+        // We are only interested in the first character
+        // Ex: when 'a #4 #5', we only need to check for 'a'
+        // as for such cases we should polyfill these features as needed
+        return !featureStatus || !criteria.includes(featureStatus.charAt(0));
+      });
+  }
 }

yarn.lock

@@ -300,10 +300,10 @@
   resolved "https://registry.yarnpkg.com/@types/browserslist/-/browserslist-4.4.0.tgz#e2a5f7f8c7e97afb39f50812a77e5230d3ca2353"
   integrity sha512-hrIjWSu7Hh96/rKlpChe58qHEwIZ0+F5Zf4QNdvSVP5LUXbaJM04g9tBjo702VTNqPZr5znEJeqNR3nAV3vJPg==
 
-"@types/caniuse-api@^3.0.0":
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/@types/caniuse-api/-/caniuse-api-3.0.0.tgz#af31cc52062be0ab24583be072fd49b634dcc2fe"
-  integrity sha512-wT1VfnScjAftZsvLYaefu/UuwYJdYBwD2JDL2OQd01plGmuAoir5V6HnVHgrfh7zEwcasoiyO2wQ+W58sNh2sw==
+"@types/caniuse-lite@^1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@types/caniuse-lite/-/caniuse-lite-1.0.0.tgz#6506ed4b3f8d19def130d19419062960e86cc3bc"
+  integrity sha512-g28510gzJpFL0xqvuGAlI+dfIr3qvUcZQVFc7f7u2VlWVqI1oBkWhGLYh3fXfoflR7HRnU4w0NRux0pPJQ7VVg==
 
 "@types/caseless@*":
   version "0.12.1"
@@ -1823,20 +1823,10 @@ camelcase@^5.0.0:
   resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-5.3.1.tgz#e3c9b31569e106811df242f715725a1f4c494320"
   integrity sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==
 
-[email protected]:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/caniuse-api/-/caniuse-api-3.0.0.tgz#5e4d90e2274961d46291997df599e3ed008ee4c0"
-  integrity sha512-bsTwuIg/BZZK/vreVTYYbSWoe2F+71P7K5QGEX+pT250DZbfU1MQ5prOKpPR+LL6uWKK3KMwMCAS74QB3Um1uw==
-  dependencies:
-    browserslist "^4.0.0"
-    caniuse-lite "^1.0.0"
-    lodash.memoize "^4.1.2"
-    lodash.uniq "^4.5.0"
-
-caniuse-lite@^1.0.0:
-  version "1.0.30000955"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000955.tgz#360fdb9a1e41d6dd996130411334e44a39e4446d"
-  integrity sha512-6AwmIKgqCYfDWWadRkAuZSHMQP4Mmy96xAXEdRBlN/luQhlRYOKgwOlZ9plpCOsVbBuqbTmGqDK3JUM/nlr8CA==
+[email protected]:
+  version "1.0.30000974"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000974.tgz#b7afe14ee004e97ce6dc73e3f878290a12928ad8"
+  integrity sha512-xc3rkNS/Zc3CmpMKuczWEdY2sZgx09BkAxfvkxlAEBTqcMHeL8QnPqhKse+5sRTi3nrw2pJwToD2WvKn1Uhvww==
 
 caniuse-lite@^1.0.30000898:
   version "1.0.30000903"
@@ -5700,11 +5690,6 @@ lodash.get@^4.4.2:
   resolved "https://registry.yarnpkg.com/lodash.get/-/lodash.get-4.4.2.tgz#2d177f652fa31e939b4438d5341499dfa3825e99"
   integrity sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk=
 
-lodash.memoize@^4.1.2:
-  version "4.1.2"
-  resolved "https://registry.yarnpkg.com/lodash.memoize/-/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe"
-  integrity sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4=
-
 lodash.tail@^4.1.1:
   version "4.1.1"
   resolved "https://registry.yarnpkg.com/lodash.tail/-/lodash.tail-4.1.1.tgz#d2333a36d9e7717c8ad2f7cacafec7c32b444664"
@@ -5725,11 +5710,6 @@ lodash.templatesettings@^4.0.0:
   dependencies:
     lodash._reinterpolate "~3.0.0"
 
-lodash.uniq@^4.5.0:
-  version "4.5.0"
-  resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773"
-  integrity sha1-0CJTc662Uq3BvILklFM5qEJ1R3M=
-
 lodash@^4.16.6, lodash@^4.17.11, lodash@^4.17.5:
   version "4.17.11"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.11.tgz#b39ea6229ef607ecd89e2c8df12536891cac9b8d"