[Fast Refresh] Upgrade react-refresh (#13285)

Closes #13254

packages/next/package.json

@@ -98,7 +98,7 @@
     "prop-types": "15.7.2",
     "prop-types-exact": "1.2.0",
     "react-is": "16.13.1",
-    "react-refresh": "0.8.2",
+    "react-refresh": "0.8.3",
     "resolve-url-loader": "3.1.1",
     "sass-loader": "8.0.2",
     "schema-utils": "2.6.6",

packages/react-refresh-utils/package.json

@@ -19,11 +19,11 @@
     "build": "tsc -d -w -p tsconfig.json"
   },
   "peerDependencies": {
-    "react-refresh": "0.8.2",
+    "react-refresh": "0.8.3",
     "webpack": "^4"
   },
   "devDependencies": {
-    "react-refresh": "0.8.2",
+    "react-refresh": "0.8.3",
     "webpack": "^4.42.1"
   }
 }

test/integration/getserversideprops/pages/refresh.js

@@ -0,0 +1,23 @@
+import { useEffect, useState } from 'react'
+
+const foo = (query) => query
+
+export const FOO = foo('query')
+
+const MyPage = () => {
+  const [isMounted, setMounted] = useState(false)
+  useEffect(() => {
+    setMounted(true)
+  }, [])
+  if (isMounted) {
+    return <p>client loaded</p>
+  }
+  return <p>server</p>
+}
+
+const getServerSideProps = async () => {
+  return { props: {} }
+}
+
+export default MyPage
+export { getServerSideProps }

test/integration/getserversideprops/test/index.test.js

@@ -109,6 +109,12 @@ const expectedManifestRoutes = () => [
     ),
     page: '/non-json',
   },
+  {
+    dataRouteRegex: normalizeRegEx(
+      `^\\/_next\\/data\\/${escapeRegex(buildId)}\\/refresh.json$`
+    ),
+    page: '/refresh',
+  },
   {
     dataRouteRegex: normalizeRegEx(
       `^\\/_next\\/data\\/${escapeRegex(buildId)}\\/something.json$`
@@ -352,6 +358,17 @@ const runTests = (dev = false) => {
     expect(text).toMatch(/a normal page/)
   })
 
+  it('should load a fast refresh page', async () => {
+    const browser = await webdriver(appPort, '/refresh')
+    expect(
+      await check(
+        () => browser.elementByCss('p').text(),
+        /client loaded/,
+        false
+      )
+    ).toBe(true)
+  })
+
   it('should provide correct query value for dynamic page', async () => {
     const html = await renderViaHTTP(
       appPort,

yarn.lock

@@ -13129,9 +13129,10 @@ react-is@^16.8.1, react-is@^16.8.4:
   version "16.12.0"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.12.0.tgz#2cc0fe0fba742d97fd527c42a13bec4eeb06241c"
 
-react-refresh@0.8.2:
-  version "0.8.2"
-  resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.8.2.tgz#24bb0858eac92b0d7b0dd561747f0c9fd6c60327"
+react-refresh@0.8.3:
+  version "0.8.3"
+  resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.8.3.tgz#721d4657672d400c5e3c75d063c4a85fb2d5d68f"
+  integrity sha512-X8jZHc7nCMjaCqoU+V2I0cOhNW+QMBwSUkeXnTi8IPe6zaRWfn60ZzvFDZqWPfmSJfjub7dDW1SP0jaHWLu/hg==
 
 react-ssr-prepass@1.0.8:
   version "1.0.8"