feat(build)!: Drop pre-ES2020 polyfills (#14882)

This PR updates to use a forked version of sucrase
(https://github.com/getsentry/sucrase/tree/es2020-polyfills).
On this branch, a new option `disableES2019Transforms` is added, which
can be used to only polyfill ES2020 features:

* numeric separators (e.g. `10_000`)
* class fields (e.g. `class X { field; }`)

It also adds a lint step that checks all build output for ES2020
compatibility, to avoid regressions in this regard.

Author: mydea

.github/workflows/build.yml

@@ -267,6 +267,8 @@ jobs:
         run: yarn lint:lerna
       - name: Lint C++ files
         run: yarn lint:clang
+      - name: Lint for ES compatibility
+        run: yarn lint:es-compatibility
 
   job_check_format:
     name: Check file formatting

dev-packages/e2e-tests/test-applications/webpack-4/build.mjs

@@ -19,6 +19,20 @@ webpack(
     },
     plugins: [new HtmlWebpackPlugin(), new webpack.EnvironmentPlugin(['E2E_TEST_DSN'])],
     mode: 'production',
+    // webpack 4 does not support ES2020 features out of the box, so we need to transpile them
+    module: {
+      rules: [
+        {
+          test: /\.(?:js|mjs|cjs)$/,
+          use: {
+            loader: 'babel-loader',
+            options: {
+              presets: [['@babel/preset-env', { targets: 'ie 11' }]],
+            },
+          },
+        },
+      ],
+    },
   },
   (err, stats) => {
     if (err) {

dev-packages/e2e-tests/test-applications/webpack-4/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "webpack-4-test",
+  "name": "webpack-4",
   "version": "1.0.0",
   "scripts": {
     "start": "serve -s build",
@@ -11,6 +11,9 @@
     "@playwright/test": "^1.44.1",
     "@sentry-internal/test-utils": "link:../../../test-utils",
     "@sentry/browser": "latest || *",
+    "babel-loader": "^8.0.0",
+    "@babel/core": "^7.0.0",
+    "@babel/preset-env": "^7.0.0",
     "webpack": "^4.47.0",
     "terser-webpack-plugin": "^4.2.3",
     "html-webpack-plugin": "^4.5.2",

dev-packages/rollup-utils/npmHelpers.mjs

@@ -33,13 +33,12 @@ export function makeBaseNPMConfig(options = {}) {
     esModuleInterop = false,
     hasBundles = false,
     packageSpecificConfig = {},
-    addPolyfills = true,
     sucrase = {},
     bundledBuiltins = [],
   } = options;
 
   const nodeResolvePlugin = makeNodeResolvePlugin();
-  const sucrasePlugin = makeSucrasePlugin({}, { disableESTransforms: !addPolyfills, ...sucrase });
+  const sucrasePlugin = makeSucrasePlugin({}, sucrase);
   const debugBuildStatementReplacePlugin = makeDebugBuildStatementReplacePlugin();
   const importMetaUrlReplacePlugin = makeImportMetaUrlReplacePlugin();
   const cleanupPlugin = makeCleanupPlugin();
@@ -64,13 +63,9 @@ export function makeBaseNPMConfig(options = {}) {
       // output individual files rather than one big bundle
       preserveModules: true,
 
-      // Allow wrappers or helper functions generated by rollup to use any ES2015 features except symbols. (Symbols in
-      // general are fine, but the `[Symbol.toStringTag]: 'Module'` which Rollup adds alongside `__esModule:
-      // true` in CJS modules makes it so that Jest <= 29.2.2 crashes when trying to mock generated `@sentry/xxx`
-      // packages. See https://github.com/getsentry/sentry-javascript/pull/6043.)
+      // Allow wrappers or helper functions generated by rollup to use any ES2015 features
       generatedCode: {
         preset: 'es2015',
-        symbols: false,
       },
 
       // don't add `"use strict"` to the top of cjs files

dev-packages/rollup-utils/plugins/npmPlugins.mjs

@@ -29,6 +29,10 @@ export function makeSucrasePlugin(options = {}, sucraseOptions = {}) {
     },
     {
       transforms: ['typescript', 'jsx'],
+      // We use a custom forked version of sucrase,
+      // where there is a new option `disableES2019Transforms`
+      disableESTransforms: false,
+      disableES2019Transforms: true,
       ...sucraseOptions,
     },
   );

package.json

@@ -31,6 +31,7 @@
     "lint:lerna": "lerna run lint",
     "lint:biome": "biome check .",
     "lint:prettier": "prettier \"**/*.md\" \"**/*.css\" --check",
+    "lint:es-compatibility": "es-check es2020 ./packages/*/build/{bundles,npm/cjs,cjs}/*.js && es-check es2020 ./packages/*/build/{npm/esm,esm}/*.js --module",
     "postpublish": "lerna run --stream --concurrency 1 postpublish",
     "test": "lerna run --ignore \"@sentry-internal/{browser-integration-tests,e2e-tests,integration-shims,node-integration-tests}\" test",
     "test:unit": "lerna run --ignore \"@sentry-internal/{browser-integration-tests,e2e-tests,integration-shims,node-integration-tests}\" test:unit",
@@ -115,6 +116,7 @@
     "@vitest/coverage-v8": "^1.6.0",
     "deepmerge": "^4.2.2",
     "downlevel-dts": "~0.11.0",
+    "es-check": "^7.2.1",
     "eslint": "7.32.0",
     "jest": "^27.5.1",
     "jest-environment-node": "^27.5.1",
@@ -144,7 +146,8 @@
   "resolutions": {
     "gauge/strip-ansi": "6.0.1",
     "wide-align/string-width": "4.2.3",
-    "cliui/wrap-ansi": "7.0.0"
+    "cliui/wrap-ansi": "7.0.0",
+    "**/sucrase": "getsentry/sucrase#es2020-polyfills"
   },
   "version": "0.0.0",
   "name": "sentry-javascript",

packages/node/rollup.anr-worker.config.mjs

@@ -7,7 +7,6 @@ export function createWorkerCodeBuilder(entry, outDir) {
     makeBaseBundleConfig({
       bundleType: 'node-worker',
       entrypoints: [entry],
-      sucrase: { disableESTransforms: true },
       licenseTitle: '@sentry/node',
       outputFileBase: () => 'worker-script.js',
       packageSpecificConfig: {