build(react/remix): Use new jsx JSX transform instead of React.createElement

.size-limit.js

@@ -83,13 +83,15 @@ module.exports = [
     name: '@sentry/react',
     path: 'packages/react/build/esm/index.js',
     import: createImport('init', 'ErrorBoundary'),
+    ignore: ['react/jsx-runtime'],
     gzip: true,
     limit: '27 KB',
   },
   {
     name: '@sentry/react (incl. Tracing)',
     path: 'packages/react/build/esm/index.js',
     import: createImport('init', 'ErrorBoundary', 'reactRouterV6BrowserTracingIntegration'),
+    ignore: ['react/jsx-runtime'],
     gzip: true,
     limit: '37 KB',
   },

dev-packages/rollup-utils/bundleHelpers.mjs

@@ -27,7 +27,7 @@ export function makeBaseBundleConfig(options) {
   const { bundleType, entrypoints, licenseTitle, outputFileBase, packageSpecificConfig, sucrase } = options;
 
   const nodeResolvePlugin = makeNodeResolvePlugin();
-  const sucrasePlugin = makeSucrasePlugin(sucrase);
+  const sucrasePlugin = makeSucrasePlugin({}, sucrase);
   const cleanupPlugin = makeCleanupPlugin();
   const markAsBrowserBuildPlugin = makeBrowserBuildPlugin(true);
   const licensePlugin = makeLicensePlugin(licenseTitle);

dev-packages/rollup-utils/npmHelpers.mjs

@@ -40,7 +40,7 @@ export function makeBaseNPMConfig(options = {}) {
   } = options;
 
   const nodeResolvePlugin = makeNodeResolvePlugin();
-  const sucrasePlugin = makeSucrasePlugin({ disableESTransforms: !addPolyfills, ...sucrase });
+  const sucrasePlugin = makeSucrasePlugin({}, { disableESTransforms: !addPolyfills, ...sucrase });
   const debugBuildStatementReplacePlugin = makeDebugBuildStatementReplacePlugin();
   const importMetaUrlReplacePlugin = makeImportMetaUrlReplacePlugin();
   const cleanupPlugin = makeCleanupPlugin();

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

@@ -13,21 +13,26 @@ import * as path from 'path';
 import { codecovRollupPlugin } from '@codecov/rollup-plugin';
 import json from '@rollup/plugin-json';
 import replace from '@rollup/plugin-replace';
-import sucrase from '@rollup/plugin-sucrase';
 import cleanup from 'rollup-plugin-cleanup';
+import sucrase from './vendor/sucrase-plugin.mjs';
 
 /**
  * Create a plugin to transpile TS syntax using `sucrase`.
  *
  * @returns An instance of the `@rollup/plugin-sucrase` plugin
  */
-export function makeSucrasePlugin(options = {}) {
-  return sucrase({
-    // Required for bundling OTEL code properly
-    exclude: ['**/*.json'],
-    transforms: ['typescript', 'jsx'],
-    ...options,
-  });
+export function makeSucrasePlugin(options = {}, sucraseOptions = {}) {
+  return sucrase(
+    {
+      // Required for bundling OTEL code properly
+      exclude: ['**/*.json'],
+      ...options,
+    },
+    {
+      transforms: ['typescript', 'jsx'],
+      ...sucraseOptions,
+    },
+  );
 }
 
 export function makeJsonPlugin() {

dev-packages/rollup-utils/plugins/vendor/sucrase-plugin.mjs

@@ -0,0 +1,79 @@
+// Vendored from https://github.com/rollup/plugins/blob/0090e728f52828d39b071ab5c7925b9b575cd568/packages/sucrase/src/index.js and modified
+
+/*
+
+The MIT License (MIT)
+
+Copyright (c) 2019 RollupJS Plugin Contributors (https://github.com/rollup/plugins/graphs/contributors)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.
+
+*/
+
+import fs from 'fs';
+import path from 'path';
+
+import { createFilter } from '@rollup/pluginutils';
+import { transform } from 'sucrase';
+
+export default function sucrase(opts = {}, sucraseOpts = {}) {
+  const filter = createFilter(opts.include, opts.exclude);
+
+  return {
+    name: 'sucrase',
+
+    // eslint-disable-next-line consistent-return
+    resolveId(importee, importer) {
+      if (importer && /^[./]/.test(importee)) {
+        const resolved = path.resolve(importer ? path.dirname(importer) : process.cwd(), importee);
+        // resolve in the same order that TypeScript resolves modules
+        const resolvedFilenames = [
+          `${resolved}.ts`,
+          `${resolved}.tsx`,
+          `${resolved}/index.ts`,
+          `${resolved}/index.tsx`,
+        ];
+        if (resolved.endsWith('.js')) {
+          resolvedFilenames.splice(2, 0, `${resolved.slice(0, -3)}.ts`, `${resolved.slice(0, -3)}.tsx`);
+        }
+        const resolvedFilename = resolvedFilenames.find(filename => fs.existsSync(filename));
+
+        if (resolvedFilename) {
+          return resolvedFilename;
+        }
+      }
+    },
+
+    transform(code, id) {
+      if (!filter(id)) return null;
+      const result = transform(code, {
+        transforms: sucraseOpts.transforms,
+        filePath: id,
+        sourceMapOptions: {
+          compiledFilename: id,
+        },
+        ...sucraseOpts,
+      });
+      return {
+        code: result.code,
+        map: result.sourceMap,
+      };
+    },
+  };
+}

package.json

@@ -97,6 +97,7 @@
     "@rollup/plugin-sucrase": "^5.0.2",
     "@rollup/plugin-terser": "^0.4.4",
     "@rollup/plugin-typescript": "^11.1.6",
+    "@rollup/pluginutils": "^5.1.0",
     "@size-limit/file": "~11.1.0",
     "@size-limit/webpack": "~11.1.0",
     "@strictsoftware/typedoc-plugin-monorepo": "^0.3.1",
@@ -124,6 +125,7 @@
     "rollup-plugin-cleanup": "^3.2.1",
     "rollup-plugin-license": "^3.3.1",
     "size-limit": "~11.1.0",
+    "sucrase": "^3.35.0",
     "ts-jest": "^27.1.4",
     "ts-node": "10.9.1",
     "typedoc": "^0.18.0",

packages/feedback/rollup.bundle.config.mjs

@@ -9,8 +9,10 @@ export default [
       licenseTitle: '@sentry-internal/feedback',
       outputFileBase: () => 'bundles/feedback',
       sucrase: {
+        // The feedback widget is using preact so we need different pragmas and jsx runtimes
         jsxPragma: 'h',
         jsxFragmentPragma: 'Fragment',
+        jsxRuntime: 'classic',
       },
     }),
   ),
@@ -22,8 +24,10 @@ export default [
       licenseTitle: '@sentry-internal/feedback',
       outputFileBase: () => 'bundles/feedback-screenshot',
       sucrase: {
+        // The feedback widget is using preact so we need different pragmas and jsx runtimes
         jsxPragma: 'h',
         jsxFragmentPragma: 'Fragment',
+        jsxRuntime: 'classic',
       },
     }),
   ),
@@ -35,8 +39,10 @@ export default [
       licenseTitle: '@sentry-internal/feedback',
       outputFileBase: () => 'bundles/feedback-modal',
       sucrase: {
+        // The feedback widget is using preact so we need different pragmas and jsx runtimes
         jsxPragma: 'h',
         jsxFragmentPragma: 'Fragment',
+        jsxRuntime: 'classic',
       },
     }),
   ),

packages/feedback/rollup.npm.config.mjs

@@ -16,8 +16,10 @@ export default makeNPMConfigVariants(
       },
     },
     sucrase: {
+      // The feedback widget is using preact so we need different pragmas and jsx runtimes
       jsxPragma: 'h',
       jsxFragmentPragma: 'Fragment',
+      jsxRuntime: 'classic',
     },
   }),
 );

packages/react/package.json

@@ -49,7 +49,7 @@
     "hoist-non-react-statics": "^3.3.2"
   },
   "peerDependencies": {
-    "react": "16.x || 17.x || 18.x"
+    "react": "^16.14.0 || 17.x || 18.x"
   },
   "devDependencies": {
     "@testing-library/react": "^13.0.0",

packages/react/rollup.npm.config.mjs

@@ -3,5 +3,12 @@ import { makeBaseNPMConfig, makeNPMConfigVariants } from '@sentry-internal/rollu
 export default makeNPMConfigVariants(
   makeBaseNPMConfig({
     esModuleInterop: true,
+    packageSpecificConfig: {
+      external: ['react', 'react/jsx-runtime'],
+    },
+    sucrase: {
+      jsxRuntime: 'automatic', // React 19 emits a warning if we don't use the newer jsx transform: https://legacy.reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html
+      production: true, // This is needed so that sucrase uses the production jsx runtime (ie `import { jsx } from 'react/jsx-runtime'` instead of `import { jsxDEV as _jsxDEV } from 'react/jsx-dev-runtime'`)
+    },
   }),
 );

packages/remix/rollup.npm.config.mjs

@@ -5,12 +5,16 @@ export default [
     makeBaseNPMConfig({
       entrypoints: ['src/index.server.ts', 'src/index.client.tsx'],
       packageSpecificConfig: {
-        external: ['react-router', 'react-router-dom'],
+        external: ['react-router', 'react-router-dom', 'react', 'react/jsx-runtime'],
         output: {
           // make it so Rollup calms down about the fact that we're combining default and named exports
           exports: 'named',
         },
       },
+      sucrase: {
+        jsxRuntime: 'automatic', // React 19 emits a warning if we don't use the newer jsx transform: https://legacy.reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html
+        production: true, // This is needed so that sucrase uses the production jsx runtime (ie `import { jsx } from 'react/jsx-runtime'` instead of `import { jsxDEV as _jsxDEV } from 'react/jsx-dev-runtime'`)
+      },
     }),
   ),
   ...makeOtelLoaders('./build', 'sentry-node'),

yarn.lock

@@ -17356,15 +17356,15 @@ glob@^10.2.2:
     path-scurry "^1.10.0"
 
 glob@^10.3.10:
-  version "10.3.10"
-  resolved "https://registry.yarnpkg.com/glob/-/glob-10.3.10.tgz#0351ebb809fd187fe421ab96af83d3a70715df4b"
-  integrity sha512-fa46+tv1Ak0UPK1TOy/pZrIybNNt4HCv7SDzwyfiOZkvZLEbjsZkJBPtDHVshZjbecAoAGSC20MjLDG/qr679g==
+  version "10.4.1"
+  resolved "https://registry.yarnpkg.com/glob/-/glob-10.4.1.tgz#0cfb01ab6a6b438177bfe6a58e2576f6efe909c2"
+  integrity sha512-2jelhlq3E4ho74ZyVLN03oKdAZVUa6UDZzFLVH1H7dnoax+y9qyaq8zBkfDIggjniU19z0wU18y16jMB2eyVIw==
   dependencies:
     foreground-child "^3.1.0"
-    jackspeak "^2.3.5"
-    minimatch "^9.0.1"
-    minipass "^5.0.0 || ^6.0.2 || ^7.0.0"
-    path-scurry "^1.10.1"
+    jackspeak "^3.1.2"
+    minimatch "^9.0.4"
+    minipass "^7.1.2"
+    path-scurry "^1.11.1"
 
 glob@^10.3.4:
   version "10.3.4"
@@ -19494,10 +19494,10 @@ jackspeak@^2.0.3:
   optionalDependencies:
     "@pkgjs/parseargs" "^0.11.0"
 
-jackspeak@^2.3.5:
-  version "2.3.6"
-  resolved "https://registry.yarnpkg.com/jackspeak/-/jackspeak-2.3.6.tgz#647ecc472238aee4b06ac0e461acc21a8c505ca8"
-  integrity sha512-N3yCS/NegsOBokc8GAdM8UcmfsKiSS8cipheD/nivzr700H+nsMOxJjQnvwOcRYVuFkdH0wGUvW2WbXGmrZGbQ==
+jackspeak@^3.1.2:
+  version "3.1.2"
+  resolved "https://registry.yarnpkg.com/jackspeak/-/jackspeak-3.1.2.tgz#eada67ea949c6b71de50f1b09c92a961897b90ab"
+  integrity sha512-kWmLKn2tRtfYMF/BakihVVRzBKOxz4gJMiL2Rj91WnAB5TPZumSH99R/Yf1qE1u4uRimvCSJfm6hnxohXeEXjQ==
   dependencies:
     "@isaacs/cliui" "^8.0.2"
   optionalDependencies:
@@ -21084,6 +21084,11 @@ lowercase-keys@^2.0.0:
   resolved "https://registry.yarnpkg.com/lowercase-keys/-/lowercase-keys-2.0.0.tgz#2603e78b7b4b0006cbca2fbcc8a3202558ac9479"
   integrity sha512-tqNXrS78oMOE73NMxK4EMLQsQowWf8jKooH9g7xPavRT706R6bkQJ6DY2Te7QukaZsulxa30wQ7bk0pm4XiHmA==
 
+lru-cache@^10.2.0:
+  version "10.2.2"
+  resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-10.2.2.tgz#48206bc114c1252940c41b25b41af5b545aca878"
+  integrity sha512-9hp3Vp2/hFQUiIwKo8XCeFVnrg8Pk3TYNPIR7tJADKi5YfcF7vEaK7avFHTlSy3kOKYaJQaalfEo6YuXdceBOQ==
+
 lru-cache@^5.1.1:
   version "5.1.1"
   resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-5.1.1.tgz#1da27e6710271947695daf6848e847f01d84b920"
@@ -22131,6 +22136,13 @@ minimatch@^9.0.0, minimatch@^9.0.1:
   dependencies:
     brace-expansion "^2.0.1"
 
+minimatch@^9.0.4:
+  version "9.0.4"
+  resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-9.0.4.tgz#8e49c731d1749cbec05050ee5145147b32496a51"
+  integrity sha512-KqWh+VchfxcMNRAJjj2tnsSJdNbHsVgnkBhTNrW7AjVo6OvLtxw8zfT9oLw1JSohlFzJ8jCoTgaoXvJ+kHt6fw==
+  dependencies:
+    brace-expansion "^2.0.1"
+
 minimatch@~3.0.4:
   version "3.0.8"
   resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.0.8.tgz#5e6a59bd11e2ab0de1cfb843eb2d82e546c321c1"
@@ -22255,6 +22267,11 @@ minipass@^5.0.0:
   resolved "https://registry.yarnpkg.com/minipass/-/minipass-7.0.3.tgz#05ea638da44e475037ed94d1c7efcc76a25e1974"
   integrity sha512-LhbbwCfz3vsb12j/WkWQPZfKTsgqIe1Nf/ti1pKjYESGLHIVjWU96G9/ljLH4F9mWNVhlQOm0VySdAWzf05dpg==
 
+minipass@^7.1.2:
+  version "7.1.2"
+  resolved "https://registry.yarnpkg.com/minipass/-/minipass-7.1.2.tgz#93a9626ce5e5e66bd4db86849e7515e92340a707"
+  integrity sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==
+
 minizlib@^2.1.1, minizlib@^2.1.2:
   version "2.1.2"
   resolved "https://registry.yarnpkg.com/minizlib/-/minizlib-2.1.2.tgz#e90d3466ba209b932451508a11ce3d3632145931"
@@ -24265,6 +24282,14 @@ path-scurry@^1.10.1:
     lru-cache "^9.1.1 || ^10.0.0"
     minipass "^5.0.0 || ^6.0.2 || ^7.0.0"
 
+path-scurry@^1.11.1:
+  version "1.11.1"
+  resolved "https://registry.yarnpkg.com/path-scurry/-/path-scurry-1.11.1.tgz#7960a668888594a0720b12a911d1a742ab9f11d2"
+  integrity sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==
+  dependencies:
+    lru-cache "^10.2.0"
+    minipass "^5.0.0 || ^6.0.2 || ^7.0.0"
+
 path-scurry@^1.6.1:
   version "1.6.4"
   resolved "https://registry.yarnpkg.com/path-scurry/-/path-scurry-1.6.4.tgz#020a9449e5382a4acb684f9c7e1283bc5695de66"
@@ -24480,7 +24505,12 @@ pinkie@^2.0.0:
   resolved "https://registry.yarnpkg.com/pinkie/-/pinkie-2.0.4.tgz#72556b80cfa0d48a974e80e77248e80ed4f7f870"
   integrity sha1-clVrgM+g1IqXToDnckjoDtT3+HA=
 
-pirates@^4.0.1, pirates@^4.0.4:
+pirates@^4.0.1:
+  version "4.0.6"
+  resolved "https://registry.yarnpkg.com/pirates/-/pirates-4.0.6.tgz#3018ae32ecfcff6c29ba2267cbf21166ac1f36b9"
+  integrity sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==
+
+pirates@^4.0.4:
   version "4.0.5"
   resolved "https://registry.yarnpkg.com/pirates/-/pirates-4.0.5.tgz#feec352ea5c3268fb23a37c702ab1699f35a5f3b"
   integrity sha512-8V9+HQPupnaXMA23c5hvl69zXvTwTzyAYasnkb0Tts4XvO4CliqONMOnvlq26rkhLC3nWDFBJf73LU1e1VZLaQ==
@@ -28263,7 +28293,7 @@ [email protected], stylus@^0.59.0:
     sax "~1.2.4"
     source-map "^0.7.3"
 
-sucrase@^3.27.0:
+sucrase@^3.27.0, sucrase@^3.35.0:
   version "3.35.0"
   resolved "https://registry.yarnpkg.com/sucrase/-/sucrase-3.35.0.tgz#57f17a3d7e19b36d8995f06679d121be914ae263"
   integrity sha512-8EbVDiu9iN/nESwxeSxDKe0dunta1GOlHufmSSXxMD2z2/tMZpDMpvXQGsc+ajGo8y2uYUmixaSRUc/QPoQ0GA==
@@ -28682,7 +28712,7 @@ [email protected], text-table@^0.2.0:
 thenify-all@^1.0.0:
   version "1.6.0"
   resolved "https://registry.yarnpkg.com/thenify-all/-/thenify-all-1.6.0.tgz#1a1918d402d8fc3f98fbf234db0bcc8cc10e9726"
-  integrity sha1-GhkY1ALY/D+Y+/I02wvMjMEOlyY=
+  integrity sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==
   dependencies:
     thenify ">= 3.1.0 < 4"