diff --git a/packages/create-subscription/package.json b/packages/create-subscription/package.json index aae1b59c78..4677c731b7 100644 --- a/packages/create-subscription/package.json +++ b/packages/create-subscription/package.json @@ -1,7 +1,7 @@ { "name": "create-subscription", "description": "utility for subscribing to external data sources inside React components", - "version": "16.13.1", + "version": "17.0.0-alpha.0", "repository": { "type": "git", "url": "https://github.com/facebook/react.git", @@ -15,7 +15,7 @@ "cjs/" ], "peerDependencies": { - "react": "^16.3.0" + "react": "^17.0.0-alpha" }, "devDependencies": { "rxjs": "^5.5.6" diff --git a/packages/jest-react/package.json b/packages/jest-react/package.json index 3876194096..2a1d8e8929 100644 --- a/packages/jest-react/package.json +++ b/packages/jest-react/package.json @@ -1,6 +1,6 @@ { "name": "jest-react", - "version": "0.11.1", + "version": "0.12.0-alpha.0", "description": "Jest matchers and utilities for testing React components.", "main": "index.js", "repository": { @@ -20,8 +20,8 @@ "homepage": "https://reactjs.org/", "peerDependencies": { "jest": "^23.0.1 || ^24.0.0 || ^25.1.0", - "react": "^16.0.0", - "react-test-renderer": "^16.0.0" + "react": "^17.0.0-alpha", + "react-test-renderer": "^17.0.0-alpha" }, "dependencies": { "object-assign": "^4.1.1" diff --git a/packages/react-art/package.json b/packages/react-art/package.json index caaf4f3f93..b611b4790f 100644 --- a/packages/react-art/package.json +++ b/packages/react-art/package.json @@ -1,7 +1,7 @@ { "name": "react-art", "description": "React ART is a JavaScript library for drawing vector graphics using React. It provides declarative and reactive bindings to the ART library. Using the same declarative API you can render the output to either Canvas, SVG or VML (IE8).", - "version": "16.13.1", + "version": "17.0.0-alpha.0", "main": "index.js", "repository": { "type": "git", @@ -29,7 +29,7 @@ "scheduler": "^0.19.0" }, "peerDependencies": { - "react": "^16.13.0" + "react": "^17.0.0-alpha" }, "files": [ "LICENSE", diff --git a/packages/react-cache/package.json b/packages/react-cache/package.json index b593f6d581..56fb3d4dee 100644 --- a/packages/react-cache/package.json +++ b/packages/react-cache/package.json @@ -17,6 +17,6 @@ "umd/" ], "peerDependencies": { - "react": "^16.3.0-alpha.1" + "react": "^17.0.0-alpha" } } diff --git a/packages/react-client/package.json b/packages/react-client/package.json index a0edddb8c3..18cb2e872e 100644 --- a/packages/react-client/package.json +++ b/packages/react-client/package.json @@ -24,7 +24,7 @@ "node": ">=0.10.0" }, "peerDependencies": { - "react": "^16.0.0" + "react": "^17.0.0-alpha" }, "dependencies": { "loose-envify": "^1.1.0", diff --git a/packages/react-debug-tools/package.json b/packages/react-debug-tools/package.json index 0d69a5f55f..e0ab8b9320 100644 --- a/packages/react-debug-tools/package.json +++ b/packages/react-debug-tools/package.json @@ -26,7 +26,7 @@ "node": ">=0.10.0" }, "peerDependencies": { - "react": "^16.0.0" + "react": "^17.0.0-alpha" }, "dependencies": { "error-stack-parser": "^2.0.2", diff --git a/packages/react-devtools-shared/src/__tests__/profilingCache-test.js b/packages/react-devtools-shared/src/__tests__/profilingCache-test.js index 817becdc0d..476b073843 100644 --- a/packages/react-devtools-shared/src/__tests__/profilingCache-test.js +++ b/packages/react-devtools-shared/src/__tests__/profilingCache-test.js @@ -716,4 +716,93 @@ describe('ProfilingCache', () => { TestRenderer.create(); }); }); + + // See https://github.com/facebook/react/issues/18831 + it('should not crash during route transitions with Suspense', () => { + const RouterContext = React.createContext(); + + function App() { + return ( + + + + + + + + + + + ); + } + + const Home = () => { + return ( + + Home + + ); + }; + + const About = () =>
About
; + + // Mimics https://github.com/ReactTraining/react-router/blob/master/packages/react-router/modules/Router.js + function Router({children}) { + const [path, setPath] = React.useState('/'); + return ( + + {children} + + ); + } + + // Mimics https://github.com/ReactTraining/react-router/blob/master/packages/react-router/modules/Switch.js + function Switch({children}) { + return ( + + {context => { + let element = null; + React.Children.forEach(children, child => { + if (context.path === child.props.path) { + element = child.props.children; + } + }); + return element ? React.cloneElement(element) : null; + }} + + ); + } + + // Mimics https://github.com/ReactTraining/react-router/blob/master/packages/react-router/modules/Route.js + function Route({children, path}) { + return null; + } + + const linkRef = React.createRef(); + + // Mimics https://github.com/ReactTraining/react-router/blob/master/packages/react-router-dom/modules/Link.js + function Link({children, path}) { + return ( + + {context => { + return ( + + ); + }} + + ); + } + + const {Simulate} = require('react-dom/test-utils'); + + const container = document.createElement('div'); + utils.act(() => ReactDOM.render(, container)); + expect(container.textContent).toBe('Home'); + utils.act(() => store.profilerStore.startProfiling()); + utils.act(() => Simulate.click(linkRef.current)); + utils.act(() => store.profilerStore.stopProfiling()); + expect(container.textContent).toBe('About'); + }); }); diff --git a/packages/react-devtools-shared/src/backend/renderer.js b/packages/react-devtools-shared/src/backend/renderer.js index 9e550da1dd..1f9f1e5f23 100644 --- a/packages/react-devtools-shared/src/backend/renderer.js +++ b/packages/react-devtools-shared/src/backend/renderer.js @@ -153,7 +153,8 @@ export function getInternalReactConstants( // ********************************************************** // The section below is copied from files in React repo. // Keep it in sync, and add version guards if it changes. - if (gte(version, '16.6.0-beta.0')) { + if (gte(version, '17.0.0-alpha')) { + // TODO (Offscreen) Update the version number above to reflect the first Offscreen alpha/beta release. ReactTypeOfWork = { Block: 22, ClassComponent: 1, @@ -181,6 +182,34 @@ export function getInternalReactConstants( SuspenseListComponent: 19, // Experimental YieldComponent: -1, // Removed }; + } else if (gte(version, '16.6.0-beta.0')) { + ReactTypeOfWork = { + Block: 22, + ClassComponent: 1, + ContextConsumer: 9, + ContextProvider: 10, + CoroutineComponent: -1, // Removed + CoroutineHandlerPhase: -1, // Removed + DehydratedSuspenseComponent: 18, // Behind a flag + ForwardRef: 11, + Fragment: 7, + FunctionComponent: 0, + HostComponent: 5, + HostPortal: 4, + HostRoot: 3, + HostText: 6, + IncompleteClassComponent: 17, + IndeterminateComponent: 2, + LazyComponent: 16, + MemoComponent: 14, + Mode: 8, + OffscreenComponent: -1, // Experimental + Profiler: 12, + SimpleMemoComponent: 15, + SuspenseComponent: 13, + SuspenseListComponent: 19, // Experimental + YieldComponent: -1, // Removed + }; } else if (gte(version, '16.4.3-alpha')) { ReactTypeOfWork = { Block: -1, // Doesn't exist yet @@ -452,14 +481,16 @@ export function attach( const debug = (name: string, fiber: Fiber, parentFiber: ?Fiber): void => { if (__DEBUG__) { const displayName = getDisplayNameForFiber(fiber) || 'null'; + const id = getFiberID(fiber); const parentDisplayName = (parentFiber != null && getDisplayNameForFiber(parentFiber)) || 'null'; + const parentID = parentFiber ? getFiberID(parentFiber) : ''; // NOTE: calling getFiberID or getPrimaryFiber is unsafe here // because it will put them in the map. For now, we'll omit them. // TODO: better debugging story for this. console.log( - `[renderer] %c${name} %c${displayName} %c${ - parentFiber ? parentDisplayName : '' + `[renderer] %c${name} %c${displayName} (${id}) %c${ + parentFiber ? `${parentDisplayName} (${parentID})` : '' }`, 'color: red; font-weight: bold;', 'color: blue;', @@ -1076,6 +1107,10 @@ export function attach( } function recordMount(fiber: Fiber, parentFiber: Fiber | null) { + if (__DEBUG__) { + debug('recordMount()', fiber, parentFiber); + } + const isRoot = fiber.tag === HostRoot; const id = getFiberID(getPrimaryFiber(fiber)); @@ -1130,6 +1165,10 @@ export function attach( } function recordUnmount(fiber: Fiber, isSimulated: boolean) { + if (__DEBUG__) { + debug('recordUnmount()', fiber); + } + if (trackedPathMatchFiber !== null) { // We're in the process of trying to restore previous selection. // If this fiber matched but is being unmounted, there's no use trying. @@ -1215,7 +1254,8 @@ export function attach( // because we don't want to highlight every host node inside of a newly mounted subtree. } - if (fiber.tag === ReactTypeOfWork.SuspenseComponent) { + const isSuspense = fiber.tag === ReactTypeOfWork.SuspenseComponent; + if (isSuspense) { const isTimedOut = fiber.memoizedState !== null; if (isTimedOut) { // Special case: if Suspense mounts in a timed-out state, diff --git a/packages/react-dom/package.json b/packages/react-dom/package.json index 123cff9255..6a96e0d494 100644 --- a/packages/react-dom/package.json +++ b/packages/react-dom/package.json @@ -1,6 +1,6 @@ { "name": "react-dom", - "version": "16.13.1", + "version": "17.0.0-alpha.0", "description": "React package for working with the DOM.", "main": "index.js", "repository": { @@ -22,7 +22,7 @@ "scheduler": "^0.19.0" }, "peerDependencies": { - "react": "^16.13.0" + "react": "^17.0.0-alpha" }, "files": [ "LICENSE", diff --git a/packages/react-fetch/package.json b/packages/react-fetch/package.json index 316ede6a58..7a3fd32f29 100644 --- a/packages/react-fetch/package.json +++ b/packages/react-fetch/package.json @@ -18,7 +18,7 @@ "cjs/" ], "peerDependencies": { - "react": "^16.13.1" + "react": "^17.0.0-alpha" }, "browser": { "./index.js": "./index.browser.js" diff --git a/packages/react-interactions/package.json b/packages/react-interactions/package.json index 60b41a1a68..b8f2192651 100644 --- a/packages/react-interactions/package.json +++ b/packages/react-interactions/package.json @@ -38,7 +38,7 @@ "loose-envify": "^1.1.0" }, "peerDependencies": { - "react": "^16.0.0" + "react": "^17.0.0-alpha" }, "browserify": { "transform": [ diff --git a/packages/react-is/package.json b/packages/react-is/package.json index 5f32de2e85..5e2b11fa85 100644 --- a/packages/react-is/package.json +++ b/packages/react-is/package.json @@ -1,6 +1,6 @@ { "name": "react-is", - "version": "16.13.1", + "version": "17.0.0-alpha.0", "description": "Brand checking of React Elements.", "main": "index.js", "repository": { diff --git a/packages/react-native-renderer/package.json b/packages/react-native-renderer/package.json index 65efbfb116..34c06e5ef9 100644 --- a/packages/react-native-renderer/package.json +++ b/packages/react-native-renderer/package.json @@ -12,6 +12,6 @@ "scheduler": "^0.11.0" }, "peerDependencies": { - "react": "^16.0.0" + "react": "^17.0.0-alpha" } } diff --git a/packages/react-noop-renderer/package.json b/packages/react-noop-renderer/package.json index 601aa87743..4a5a575c0b 100644 --- a/packages/react-noop-renderer/package.json +++ b/packages/react-noop-renderer/package.json @@ -17,7 +17,7 @@ "react-server": "*" }, "peerDependencies": { - "react": "^16.13.0" + "react": "^17.0.0-alpha" }, "files": [ "LICENSE", diff --git a/packages/react-reconciler/package.json b/packages/react-reconciler/package.json index d7d8f156fa..2e2aa934aa 100644 --- a/packages/react-reconciler/package.json +++ b/packages/react-reconciler/package.json @@ -26,7 +26,7 @@ "node": ">=0.10.0" }, "peerDependencies": { - "react": "^16.13.0" + "react": "^17.0.0-alpha" }, "dependencies": { "loose-envify": "^1.1.0", diff --git a/packages/react-server/package.json b/packages/react-server/package.json index 7422e0f7c2..7c448e766e 100644 --- a/packages/react-server/package.json +++ b/packages/react-server/package.json @@ -27,7 +27,7 @@ "node": ">=0.10.0" }, "peerDependencies": { - "react": "^16.0.0" + "react": "^17.0.0-alpha" }, "dependencies": { "loose-envify": "^1.1.0", diff --git a/packages/react-test-renderer/package.json b/packages/react-test-renderer/package.json index 74fcd6143c..c2907a4e29 100644 --- a/packages/react-test-renderer/package.json +++ b/packages/react-test-renderer/package.json @@ -1,6 +1,6 @@ { "name": "react-test-renderer", - "version": "16.13.1", + "version": "17.0.0-alpha.0", "description": "React package for snapshot testing.", "main": "index.js", "repository": { @@ -20,12 +20,15 @@ "homepage": "https://reactjs.org/", "dependencies": { "object-assign": "^4.1.1", - "react-is": "^16.8.6", + "react-is": "^17.0.0-alpha", "react-shallow-renderer": "^16.13.1", "scheduler": "^0.19.0" }, "peerDependencies": { - "react": "^16.13.0" + "react": "^17.0.0-alpha" + }, + "resolutions": { + "react-shallow-renderer/react-is": "^17.0.0-alpha" }, "files": [ "LICENSE", diff --git a/packages/react-transport-dom-relay/package.json b/packages/react-transport-dom-relay/package.json index 77cbf1284c..fbb3e0622e 100644 --- a/packages/react-transport-dom-relay/package.json +++ b/packages/react-transport-dom-relay/package.json @@ -12,7 +12,7 @@ "scheduler": "^0.11.0" }, "peerDependencies": { - "react": "^16.0.0", - "react-dom": "^16.0.0" + "react": "^17.0.0-alpha", + "react-dom": "^17.0.0-alpha" } } diff --git a/packages/react-transport-dom-webpack/package.json b/packages/react-transport-dom-webpack/package.json index 4dd0be9877..b15fbdd356 100644 --- a/packages/react-transport-dom-webpack/package.json +++ b/packages/react-transport-dom-webpack/package.json @@ -34,8 +34,8 @@ "node": ">=0.10.0" }, "peerDependencies": { - "react": "^16.0.0", - "react-dom": "^16.0.0", + "react": "^17.0.0-alpha", + "react-dom": "^17.0.0-alpha", "webpack": "^4.43.0" }, "dependencies": { diff --git a/packages/react/package.json b/packages/react/package.json index 29d293bf23..26ee45210b 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -4,7 +4,7 @@ "keywords": [ "react" ], - "version": "16.13.1", + "version": "17.0.0-alpha.0", "homepage": "https://reactjs.org/", "bugs": "https://github.com/facebook/react/issues", "license": "MIT", diff --git a/packages/shared/ReactVersion.js b/packages/shared/ReactVersion.js index a44b7ad43e..a45f8bf18f 100644 --- a/packages/shared/ReactVersion.js +++ b/packages/shared/ReactVersion.js @@ -6,4 +6,4 @@ */ // TODO: this is special because it gets imported during build. -export default '16.13.1'; +export default '17.0.0-alpha.0'; diff --git a/packages/use-subscription/package.json b/packages/use-subscription/package.json index ab1fc13f27..42c0e4913f 100644 --- a/packages/use-subscription/package.json +++ b/packages/use-subscription/package.json @@ -19,7 +19,7 @@ "object-assign": "^4.1.1" }, "peerDependencies": { - "react": "^16.8.0" + "react": "^17.0.0-alpha" }, "devDependencies": { "rxjs": "^5.5.6"