Add targets option to @babel/plugin-transform-runtime

packages/babel-plugin-transform-runtime/package.json

@@ -16,8 +16,11 @@
     "./src/get-runtime-path/index.js": "./src/get-runtime-path/browser.js"
   },
   "dependencies": {
+    "@babel/compat-data": "^7.9.6",
+    "@babel/helper-compilation-targets": "^7.9.6",
     "@babel/helper-module-imports": "^7.8.3",
     "@babel/helper-plugin-utils": "^7.8.3",
+    "core-js-compat": "^3.6.5",
     "resolve": "^1.8.1",
     "semver": "^5.5.1"
   },

packages/babel-plugin-transform-runtime/src/index.js

@@ -1,12 +1,42 @@
 import { declare } from "@babel/helper-plugin-utils";
 import { addDefault, isModule } from "@babel/helper-module-imports";
 import { types as t } from "@babel/core";
+import getTargets, {
+  filterItems,
+  isRequired,
+} from "@babel/helper-compilation-targets";
+import corejs2Polyfills from "@babel/compat-data/corejs2-built-ins";
+import corejs3Polyfills from "core-js-compat/data";
 
 import getCoreJS2Definitions from "./runtime-corejs2-definitions";
 import getCoreJS3Definitions from "./runtime-corejs3-definitions";
 import { typeAnnotationToString } from "./helpers";
 import getRuntimePath from "./get-runtime-path";
 
+/* TODO: use `packages/babel-preset-env/src/polyfills/corejs3/built-in-definitions.js`
+ * instead of `core-js-compat` after moving to `@babel/compat-data`
+ *
+ * corejs sometimes lumps multiple functions/identifiers under one name
+ */
+corejs3Polyfills["web.set-immediate"] = corejs3Polyfills["web.immediate"];
+corejs3Polyfills["web.clear-immediate"] = corejs3Polyfills["web.immediate"];
+corejs3Polyfills["web.set-interval"] = corejs3Polyfills["web.timers"];
+corejs3Polyfills["web.clear-interval"] = corejs3Polyfills["web.timers"];
+corejs3Polyfills["web.set-timeout"] = corejs3Polyfills["web.timers"];
+corejs3Polyfills["web.clear-timeout"] = corejs3Polyfills["web.timers"];
+corejs3Polyfills["es.array.entries"] = corejs3Polyfills["es.array.iterator"];
+corejs3Polyfills["es.array.keys"] = corejs3Polyfills["es.array.iterator"];
+corejs3Polyfills["es.array.values"] = corejs3Polyfills["es.array.iterator"];
+corejs3Polyfills["es.string.trim-left"] =
+  corejs3Polyfills["es.string.trim-start"];
+corejs3Polyfills["es.string.trim-right"] =
+  corejs3Polyfills["es.string.trim-end"];
+corejs3Polyfills["es.symbol.for"] = corejs3Polyfills["es.symbol"];
+corejs3Polyfills["es.symbol.key-for"] = corejs3Polyfills["es.symbol"];
+corejs3Polyfills["es.object.get-own-property-symbols"] =
+  corejs3Polyfills["es.symbol"];
+corejs2Polyfills["es6.symbol.iterator"] = corejs2Polyfills["es6.symbol"];
+
 function supportsStaticESM(caller) {
   return !!caller?.supportsStaticESM;
 }
@@ -17,12 +47,25 @@ export default declare((api, options, dirname) => {
   const {
     corejs,
     helpers: useRuntimeHelpers = true,
-    regenerator: useRuntimeRegenerator = true,
+    regenerator = true,
     useESModules = false,
     version: runtimeVersion = "7.0.0-beta.0",
     absoluteRuntime = false,
+    targets: optionsTargets = {},
   } = options;
 
+  const targets = getTargets(
+    typeof optionsTargets === "string" || Array.isArray(optionsTargets)
+      ? { browsers: optionsTargets }
+      : { ...optionsTargets },
+    {
+      ignoreBrowserslistConfig: true,
+    },
+  );
+
+  const useRuntimeRegenerator =
+    regenerator && isRequired("transform-regenerator", targets);
+
   let proposals = false;
   let rawVersion;
 
@@ -83,7 +126,14 @@ export default declare((api, options, dirname) => {
   }
 
   function hasMapping(methods, name) {
-    return has(methods, name) && (proposals || methods[name].stable);
+    return (
+      has(methods, name) &&
+      (proposals || methods[name].stable) &&
+      (polyfillPaths.has(methods[name].path) ||
+        methods[name].types?.some(type =>
+          polyfillPaths.has(`${type}/${methods[name].path}`),
+        ))
+    );
   }
 
   function hasStaticMapping(object, method) {
@@ -174,6 +224,19 @@ export default declare((api, options, dirname) => {
     ? getCoreJS2Definitions
     : getCoreJS3Definitions)(runtimeVersion);
 
+  const corejsPolyfills = injectCoreJS3 ? corejs3Polyfills : corejs2Polyfills;
+
+  const polyfillPaths = new Set(
+    Array.from(
+      filterItems(corejsPolyfills, new Set(), new Set(), targets, null),
+      name =>
+        name
+          .split(".")
+          .slice(1)
+          .join("/"),
+    ),
+  );
+
   const HEADER_HELPERS = ["interopRequireWildcard", "interopRequireDefault"];
 
   const modulePath = getRuntimePath(moduleName, dirname, absoluteRuntime);
@@ -324,6 +387,8 @@ export default declare((api, options, dirname) => {
           return;
         }
 
+        if (!polyfillPaths.has("symbol/iterator")) return;
+
         // transform `something[Symbol.iterator]()` to calling `getIterator(something)` helper
         path.replaceWith(
           t.callExpression(
@@ -341,6 +406,7 @@ export default declare((api, options, dirname) => {
         if (!injectCoreJS) return;
         if (path.node.operator !== "in") return;
         if (!path.get("left").matchesPattern("Symbol.iterator")) return;
+        if (!polyfillPaths.has("symbol/iterator")) return;
 
         path.replaceWith(
           t.callExpression(
@@ -370,7 +436,8 @@ export default declare((api, options, dirname) => {
           if (
             !injectCoreJS2 &&
             node.computed &&
-            path.get("property").matchesPattern("Symbol.iterator")
+            path.get("property").matchesPattern("Symbol.iterator") &&
+            polyfillPaths.has("symbol/iterator")
           ) {
             path.replaceWith(
               t.callExpression(

packages/babel-plugin-transform-runtime/src/runtime-corejs3-definitions.js

@@ -185,47 +185,47 @@ export default () => {
     // See ./helpers.js@typeAnnotationToString for the supported types
 
     InstanceProperties: {
-      at: { stable: false, path: "at" },
-      bind: { stable: true, path: "bind" },
-      codePointAt: { stable: true, path: "code-point-at" },
-      codePoints: { stable: false, path: "code-points" },
+      at: { stable: false, path: "at", types: ["string"] },
+      bind: { stable: true, path: "bind", types: ["function"] },
+      codePointAt: { stable: true, path: "code-point-at", types: ["string"] },
+      codePoints: { stable: false, path: "code-points", types: ["string"] },
       concat: { stable: true, path: "concat", types: ["array"] },
-      copyWithin: { stable: true, path: "copy-within" },
-      endsWith: { stable: true, path: "ends-with" },
-      entries: { stable: true, path: "entries" },
-      every: { stable: true, path: "every" },
-      fill: { stable: true, path: "fill" },
-      filter: { stable: true, path: "filter" },
-      find: { stable: true, path: "find" },
-      findIndex: { stable: true, path: "find-index" },
-      flags: { stable: true, path: "flags" },
-      flatMap: { stable: true, path: "flat-map" },
-      flat: { stable: true, path: "flat" },
-      forEach: { stable: true, path: "for-each" },
-      includes: { stable: true, path: "includes" },
-      indexOf: { stable: true, path: "index-of" },
-      keys: { stable: true, path: "keys" },
-      lastIndexOf: { stable: true, path: "last-index-of" },
-      map: { stable: true, path: "map" },
-      matchAll: { stable: false, path: "match-all" },
-      padEnd: { stable: true, path: "pad-end" },
-      padStart: { stable: true, path: "pad-start" },
-      reduce: { stable: true, path: "reduce" },
-      reduceRight: { stable: true, path: "reduce-right" },
-      repeat: { stable: true, path: "repeat" },
-      replaceAll: { stable: false, path: "replace-all" },
-      reverse: { stable: true, path: "reverse" },
-      slice: { stable: true, path: "slice" },
-      some: { stable: true, path: "some" },
-      sort: { stable: true, path: "sort" },
-      splice: { stable: true, path: "splice" },
-      startsWith: { stable: true, path: "starts-with" },
-      trim: { stable: true, path: "trim" },
-      trimEnd: { stable: true, path: "trim-end" },
-      trimLeft: { stable: true, path: "trim-left" },
-      trimRight: { stable: true, path: "trim-right" },
-      trimStart: { stable: true, path: "trim-start" },
-      values: { stable: true, path: "values" },
+      copyWithin: { stable: true, path: "copy-within", types: ["array"] },
+      endsWith: { stable: true, path: "ends-with", types: ["string"] },
+      entries: { stable: true, path: "entries", types: ["array"] },
+      every: { stable: true, path: "every", types: ["array"] },
+      fill: { stable: true, path: "fill", types: ["array"] },
+      filter: { stable: true, path: "filter", types: ["array"] },
+      find: { stable: true, path: "find", types: ["array"] },
+      findIndex: { stable: true, path: "find-index", types: ["array"] },
+      flags: { stable: true, path: "flags", types: ["regexp"] },
+      flatMap: { stable: true, path: "flat-map", types: ["array"] },
+      flat: { stable: true, path: "flat", types: ["array"] },
+      forEach: { stable: true, path: "for-each", types: ["array"] },
+      includes: { stable: true, path: "includes", types: ["array", "string"] },
+      indexOf: { stable: true, path: "index-of", types: ["array"] },
+      keys: { stable: true, path: "keys", types: ["array"] },
+      lastIndexOf: { stable: true, path: "last-index-of", types: ["array"] },
+      map: { stable: true, path: "map", types: ["array"] },
+      matchAll: { stable: false, path: "match-all", types: ["string"] },
+      padEnd: { stable: true, path: "pad-end", types: ["string"] },
+      padStart: { stable: true, path: "pad-start", types: ["string"] },
+      reduce: { stable: true, path: "reduce", types: ["array"] },
+      reduceRight: { stable: true, path: "reduce-right", types: ["array"] },
+      repeat: { stable: true, path: "repeat", types: ["string"] },
+      replaceAll: { stable: false, path: "replace-all", types: ["string"] },
+      reverse: { stable: true, path: "reverse", types: ["array"] },
+      slice: { stable: true, path: "slice", types: ["array"] },
+      some: { stable: true, path: "some", types: ["array"] },
+      sort: { stable: true, path: "sort", types: ["array"] },
+      splice: { stable: true, path: "splice", types: ["array"] },
+      startsWith: { stable: true, path: "starts-with", types: ["string"] },
+      trim: { stable: true, path: "trim", types: ["string"] },
+      trimEnd: { stable: true, path: "trim-end", types: ["string"] },
+      trimLeft: { stable: true, path: "trim-left", types: ["string"] },
+      trimRight: { stable: true, path: "trim-right", types: ["string"] },
+      trimStart: { stable: true, path: "trim-start", types: ["string"] },
+      values: { stable: true, path: "values", types: ["array"] },
     },
   };
 };

packages/babel-plugin-transform-runtime/test/fixtures/runtime-corejs2/es6-for-of-esmodules-target/input.js

@@ -0,0 +1,3 @@
+for (var i of arr) {
+
+}

packages/babel-plugin-transform-runtime/test/fixtures/runtime-corejs2/es6-for-of-esmodules-target/options.json

@@ -0,0 +1,15 @@
+{
+  "plugins": [
+    "transform-for-of",
+    [
+      "transform-runtime",
+      {
+        "corejs": 2,
+        "version": "7.100.0",
+        "targets": {
+          "esmodules": true
+        }
+      }
+    ]
+  ]
+}

packages/babel-plugin-transform-runtime/test/fixtures/runtime-corejs2/es6-for-of-esmodules-target/output.js

@@ -0,0 +1,14 @@
+var _createForOfIteratorHelper = require("@babel/runtime-corejs2/helpers/createForOfIteratorHelper");
+
+var _iterator = _createForOfIteratorHelper(arr),
+    _step;
+
+try {
+  for (_iterator.s(); !(_step = _iterator.n()).done;) {
+    var i = _step.value;
+  }
+} catch (err) {
+  _iterator.e(err);
+} finally {
+  _iterator.f();
+}

packages/babel-plugin-transform-runtime/test/fixtures/runtime-corejs3/built-in-globals-esmodules-target/input.js

@@ -0,0 +1,33 @@
+AggregateError
+Map
+Observable
+Promise
+Set
+Symbol
+URL
+URLSearchParams
+WeakMap
+WeakSet
+clearImmediate
+compositeKey
+compositeSymbol
+globalThis
+parseFloat
+parseInt
+queueMicrotask
+setImmediate
+setInterval
+setTimeout
+
+Array
+Boolean
+Date
+Infinity
+JSON
+NaN
+Number
+Object
+clearInterval
+clearTimeout
+
+something

packages/babel-plugin-transform-runtime/test/fixtures/runtime-corejs3/built-in-globals-esmodules-target/options.json

@@ -0,0 +1,5 @@
+{
+  "plugins": [
+    ["transform-runtime", { "corejs": 3, "targets": { "esmodules": true } }]
+  ]
+}

packages/babel-plugin-transform-runtime/test/fixtures/runtime-corejs3/built-in-globals-esmodules-target/output.js

@@ -0,0 +1,43 @@
+var _setImmediate = require("@babel/runtime-corejs3/core-js-stable/set-immediate");
+
+var _queueMicrotask = require("@babel/runtime-corejs3/core-js-stable/queue-microtask");
+
+var _clearImmediate = require("@babel/runtime-corejs3/core-js-stable/clear-immediate");
+
+var _URLSearchParams = require("@babel/runtime-corejs3/core-js-stable/url-search-params");
+
+var _URL = require("@babel/runtime-corejs3/core-js-stable/url");
+
+var _Promise = require("@babel/runtime-corejs3/core-js-stable/promise");
+
+AggregateError;
+Map;
+Observable;
+_Promise;
+Set;
+Symbol;
+_URL;
+_URLSearchParams;
+WeakMap;
+WeakSet;
+_clearImmediate;
+compositeKey;
+compositeSymbol;
+globalThis;
+parseFloat;
+parseInt;
+_queueMicrotask;
+_setImmediate;
+setInterval;
+setTimeout;
+Array;
+Boolean;
+Date;
+Infinity;
+JSON;
+NaN;
+Number;
+Object;
+clearInterval;
+clearTimeout;
+something;

packages/babel-plugin-transform-runtime/test/fixtures/runtime-corejs3/built-in-globals-recent-target/input.js

@@ -0,0 +1,33 @@
+AggregateError
+Map
+Observable
+Promise
+Set
+Symbol
+URL
+URLSearchParams
+WeakMap
+WeakSet
+clearImmediate
+compositeKey
+compositeSymbol
+globalThis
+parseFloat
+parseInt
+queueMicrotask
+setImmediate
+setInterval
+setTimeout
+
+Array
+Boolean
+Date
+Infinity
+JSON
+NaN
+Number
+Object
+clearInterval
+clearTimeout
+
+something

packages/babel-plugin-transform-runtime/test/fixtures/runtime-corejs3/built-in-globals-recent-target/options.json

@@ -0,0 +1,5 @@
+{
+  "plugins": [
+    ["transform-runtime", { "corejs": 3, "targets": "last 2 chrome versions" }]
+  ]
+}