Use modern JSX runtime in Flight fixture (#35677)

fixtures/flight/config/webpack.config.js

@@ -76,19 +76,6 @@ const cssModuleRegex = /\.module\.css$/;
 const sassRegex = /\.(scss|sass)$/;
 const sassModuleRegex = /\.module\.(scss|sass)$/;
 
-const hasJsxRuntime = (() => {
-  if (process.env.DISABLE_NEW_JSX_TRANSFORM === 'true') {
-    return false;
-  }
-
-  try {
-    require.resolve('react/jsx-runtime');
-    return true;
-  } catch (e) {
-    return false;
-  }
-})();
-
 // This is the production and development configuration.
 // It is focused on developer experience, fast rebuilds, and a minimal bundle.
 module.exports = function (webpackEnv) {
@@ -425,7 +412,7 @@ module.exports = function (webpackEnv) {
                   [
                     require.resolve('babel-preset-react-app'),
                     {
-                      runtime: hasJsxRuntime ? 'automatic' : 'classic',
+                      runtime: 'automatic',
                     },
                   ],
                 ],

fixtures/flight/loader/global.js

@@ -5,7 +5,7 @@ const babelOptions = {
   ignore: [/\/(build|node_modules)\//],
   plugins: [
     '@babel/plugin-syntax-import-meta',
-    '@babel/plugin-transform-react-jsx',
+    ['@babel/plugin-transform-react-jsx', {runtime: 'automatic'}],
   ],
 };
 

fixtures/flight/loader/region.js

@@ -14,7 +14,7 @@ const babelOptions = {
   ignore: [/\/(build|node_modules)\//],
   plugins: [
     '@babel/plugin-syntax-import-meta',
-    '@babel/plugin-transform-react-jsx',
+    ['@babel/plugin-transform-react-jsx', {runtime: 'automatic'}],
   ],
   sourceMaps: process.env.NODE_ENV === 'development' ? 'inline' : false,
 };

fixtures/flight/src/Button.js

@@ -1,6 +1,5 @@
 'use client';
 
-import * as React from 'react';
 import {useFormStatus} from 'react-dom';
 import ErrorBoundary from './ErrorBoundary.js';
 

fixtures/flight/src/Container.js

@@ -1,5 +1,3 @@
-import * as React from 'react';
-
 export default function Container({children}) {
   return <div>{children}</div>;
 }

fixtures/flight/src/Dynamic.js

@@ -1,7 +1,5 @@
 'use client';
 
-import * as React from 'react';
-
 export function Dynamic() {
   return (
     <div>

fixtures/flight/src/GenerateImage.js

@@ -1,5 +1,3 @@
-import * as React from 'react';
-
 import {createCanvas} from 'canvas';
 
 export async function GenerateImage({message}) {

fixtures/flight/src/LargeContent.js

@@ -1,5 +1,3 @@
-import * as React from 'react';
-
 export default async function LargeContent() {
   return (
     <div>

fixtures/flight/src/index.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import {use, Suspense, useState, startTransition, Profiler} from 'react';
 import ReactDOM from 'react-dom/client';
 import {createFromFetch, encodeReply} from 'react-server-dom-webpack/client';