Upgrade react 18 to rc, drop prerelease warning (vercel#32619)

huozhi · web-flow · commit b3b92b610f12 · 2021-12-20T13:43:42.000Z
### Enhancement

* Auto enable reactRoot API for react 18 since the legacy render in `react-dom` is dropped
* Remove prelrease warning
diff --git a/package.json b/package.json
@@ -137,9 +137,9 @@
     "pretty-ms": "7.0.0",
     "random-seed": "0.3.0",
     "react": "17.0.2",
-    "react-18": "npm:react@18.0.0-beta-0cc724c77-20211125",
+    "react-18": "npm:react@18.0.0-rc.0",
     "react-dom": "17.0.2",
-    "react-dom-18": "npm:react-dom@18.0.0-beta-0cc724c77-20211125",
+    "react-dom-18": "npm:react-dom@18.0.0-rc.0",
     "react-ssr-prepass": "1.0.8",
     "release": "6.3.0",
     "request-promise-core": "1.1.2",
diff --git a/packages/next/build/webpack-config.ts b/packages/next/build/webpack-config.ts
@@ -346,13 +346,15 @@ export default async function getBaseWebpackConfig(
     Boolean(reactDomVersion) &&
     (semver.gte(reactDomVersion!, '18.0.0') ||
       semver.coerce(reactDomVersion)?.version === '18.0.0')
-  const hasReactPrerelease =
-    (Boolean(reactDomVersion) && semver.prerelease(reactDomVersion!) != null) ||
-    isReactExperimental
 
   const hasReactRoot: boolean =
     config.experimental.reactRoot || hasReact18 || isReactExperimental
 
+  // Make sure reactRoot is enabled when react 18 is detected
+  if (hasReactRoot) {
+    config.experimental.reactRoot = true
+  }
+
   // Only inform during one of the builds
   if (
     !isServer &&
@@ -381,19 +383,6 @@ export default async function getBaseWebpackConfig(
     hasConcurrentFeatures && !!config.experimental.serverComponents
   const targetWeb = webServerRuntime || !isServer
 
-  // Only inform during one of the builds
-  if (!isServer) {
-    if (hasReactRoot) {
-      Log.info('Using the createRoot API for React')
-    }
-    if (hasReactPrerelease) {
-      Log.warn(
-        `You are using an unsupported prerelease of 'react-dom' which may cause ` +
-          `unexpected or broken application behavior. Continue at your own risk.`
-      )
-    }
-  }
-
   if (webServerRuntime) {
     Log.warn(
       'You are using the experimental Edge Runtime with `concurrentFeatures`.'
diff --git a/test/integration/react-18/test/index.test.js b/test/integration/react-18/test/index.test.js
@@ -24,8 +24,6 @@ const nextConfig = new File(join(appDir, 'next.config.js'))
 const dynamicHello = new File(join(appDir, 'components/dynamic-hello.js'))
 const unwrappedPage = new File(join(appDir, 'pages/suspense/unwrapped.js'))
 
-const UNSUPPORTED_PRERELEASE =
-  "You are using an unsupported prerelease of 'react-dom'"
 const USING_CREATE_ROOT = 'Using the createRoot API for React'
 
 async function getBuildOutput(dir) {
@@ -70,13 +68,11 @@ describe('React 18 Support', () => {
     test('supported version of react in dev', async () => {
       const output = await getDevOutput(appDir)
       expect(output).not.toMatch(USING_CREATE_ROOT)
-      expect(output).not.toMatch(UNSUPPORTED_PRERELEASE)
     })
 
     test('supported version of react in build', async () => {
       const output = await getBuildOutput(appDir)
       expect(output).not.toMatch(USING_CREATE_ROOT)
-      expect(output).not.toMatch(UNSUPPORTED_PRERELEASE)
     })
 
     test('suspense is not allowed in blocking rendering mode (prod)', async () => {
@@ -90,32 +86,6 @@ describe('React 18 Support', () => {
       )
     })
   })
-
-  describe('Use react-dom 18 prerelease', () => {
-    beforeAll(async () => {
-      const reactDomPkgPath = join(
-        appDir,
-        'node_modules/react-dom/package.json'
-      )
-      await fs.outputJson(reactDomPkgPath, {
-        name: 'react-dom',
-        version: '18.0.0-alpha-c76e4dbbc-20210722',
-      })
-    })
-    afterAll(async () => await fs.remove(join(appDir, 'node_modules')))
-
-    test('prerelease version of react in dev', async () => {
-      const output = await getDevOutput(appDir)
-      expect(output).toMatch(USING_CREATE_ROOT)
-      expect(output).toMatch(UNSUPPORTED_PRERELEASE)
-    })
-
-    test('prerelease version of react in build', async () => {
-      const output = await getBuildOutput(appDir)
-      expect(output).toMatch(USING_CREATE_ROOT)
-      expect(output).toMatch(UNSUPPORTED_PRERELEASE)
-    })
-  })
 })
 
 describe('Basics', () => {
diff --git a/yarn.lock b/yarn.lock
@@ -16482,22 +16482,22 @@ rc@^1.0.1, rc@^1.1.6, rc@^1.2.7, rc@^1.2.8:
     minimist "^1.2.0"
     strip-json-comments "~2.0.1"
 
-"react-18@npm:react@18.0.0-beta-0cc724c77-20211125":
-  version "18.0.0-beta-0cc724c77-20211125"
-  resolved "https://registry.yarnpkg.com/react/-/react-18.0.0-beta-0cc724c77-20211125.tgz#e0050eb21c398902c5c0f7da9f4b8b52b8effd66"
-  integrity sha512-odsMe3EsqWSZy/ksPiSGuUcs41iAQQGEcws0565jsSQskJMLm7NOZ51AAoClIj8kZI4i3uHe/o22tZff9EsGnA==
+"react-18@npm:react@18.0.0-rc.0":
+  version "18.0.0-rc.0"
+  resolved "https://registry.yarnpkg.com/react/-/react-18.0.0-rc.0.tgz#60bfcf1edd0b35fbeeeca852515c6cc2ce06a6eb"
+  integrity sha512-PawosMBgF8k5Nlc3++ibzjFqPvo1XKv80MNtVYqz3abHHB2w3IpU65sSdSmBd2ooCwVhcp9b1vkx/twqhakNtA==
   dependencies:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
 
-"react-dom-18@npm:react-dom@18.0.0-beta-0cc724c77-20211125":
-  version "18.0.0-beta-0cc724c77-20211125"
-  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-18.0.0-beta-0cc724c77-20211125.tgz#7f7ac2a37e69c16cb97a42a52ffe24e80ab02027"
-  integrity sha512-SzWHSBjNIzn43jB+IeQhqgQE3zLJTFMv5KzvSFttKC9QSBS11vuYLdELjpiUNAMaAOmY4qmcnLEQvmKNwGK5fQ==
+"react-dom-18@npm:react-dom@18.0.0-rc.0":
+  version "18.0.0-rc.0"
+  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-18.0.0-rc.0.tgz#aa07044bdd6399ff94c664b2985e2e25948fbf3e"
+  integrity sha512-tdD1n0svTndHBQvVAq/f2Kx7FgQ30CpSLp87/neQKAHPW5WtdgW1sBSwmFAcMQOrmstTuP0M+zRlH86f9kMX/A==
   dependencies:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
-    scheduler "0.21.0-beta-0cc724c77-20211125"
+    scheduler "^0.21.0-rc.0"
 
 react-dom@17.0.2:
   version "17.0.2"
@@ -17464,14 +17464,6 @@ saxes@^5.0.1:
   dependencies:
     xmlchars "^2.2.0"
 
-scheduler@0.21.0-beta-0cc724c77-20211125:
-  version "0.21.0-beta-0cc724c77-20211125"
-  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.21.0-beta-0cc724c77-20211125.tgz#2251f681a2e4e24bb0ad42909ce6dae253a39925"
-  integrity sha512-ZqjVAbosIfddFmNMdlJO/F0kr33qdgTGlLFCgIXsNIz/SjNq0Hn+lIaYtaIQPhZRFPwIgYOt+ssui0zZJ58rVg==
-  dependencies:
-    loose-envify "^1.1.0"
-    object-assign "^4.1.1"
-
 scheduler@^0.20.2:
   version "0.20.2"
   resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.20.2.tgz#4baee39436e34aa93b4874bddcbf0fe8b8b50e91"
@@ -17480,6 +17472,14 @@ scheduler@^0.20.2:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
 
+scheduler@^0.21.0-rc.0:
+  version "0.21.0-rc.0-next-f2a59df48-20211208"
+  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.21.0-rc.0-next-f2a59df48-20211208.tgz#54e18e1d360194fd54b47a00616e46403fcabdf1"
+  integrity sha512-x0oLd3YIih9GHqWTaFYejVe6Au+4TadOWZciAq8m4+Fuo5qCi4/3M35a9irVSIP3+qcg/fCqHKJETT9G0ejD1A==
+  dependencies:
+    loose-envify "^1.1.0"
+    object-assign "^4.1.1"
+
 "schema-utils2@npm:schema-utils@2.7.1":
   version "2.7.1"
   resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-2.7.1.tgz#1ca4f32d1b24c590c203b8e7a50bf0ea4cd394d7"
