diff --git a/packages/create-subscription/package.json b/packages/create-subscription/package.json index aae1b59c782..4677c731b7b 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 3876194096b..2a1d8e8929d 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 caaf4f3f936..b611b4790fd 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 b593f6d5811..56fb3d4dee0 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 a0edddb8c31..18cb2e872ed 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 0d69a5f55f5..e0ab8b93209 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 817becdc0d0..476b073843e 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 9e550da1dd8..1f9f1e5f239 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 123cff92558..6a96e0d4942 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 316ede6a589..7a3fd32f296 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 60b41a1a68a..b8f21926514 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 5f32de2e857..5e2b11fa859 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 65efbfb1163..34c06e5ef96 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 601aa877433..4a5a575c0b5 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 d7d8f156fa9..2e2aa934aa1 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 7422e0f7c24..7c448e766e0 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 74fcd6143c4..c2907a4e298 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 77cbf1284ca..fbb3e0622e5 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 4dd0be98771..b15fbdd356e 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 29d293bf231..26ee45210b7 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 a44b7ad43e9..a45f8bf18f4 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 ab1fc13f27c..42c0e4913f9 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"