{"parents":["d926936f0b5ebe160819717924d7a124c2f65471"],"patch":"diff --git a\/packages\/react-debug-tools\/src\/__tests__\/ReactHooksInspection-test.js b\/packages\/react-debug-tools\/src\/__tests__\/ReactHooksInspection-test.js\nindex f5b57a531a..f1c54cdecb 100644\n--- a\/packages\/react-debug-tools\/src\/__tests__\/ReactHooksInspection-test.js\n+++ b\/packages\/react-debug-tools\/src\/__tests__\/ReactHooksInspection-test.js\n@@ -279,7 +279,12 @@ describe('ReactHooksInspection', () => {\n expect(() => {\n ReactDebugTools.inspectHooks(Foo, {}, FakeDispatcherRef);\n }).toThrow(\n- 'Hooks can only be called inside the body of a function component.',\n+ 'Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for' +\n+ ' one of the following reasons:\\n' +\n+ '1. You might have mismatching versions of React and the renderer (such as React DOM)\\n' +\n+ '2. You might be breaking the Rules of Hooks\\n' +\n+ '3. You might have more than one copy of React in the same app\\n' +\n+ 'See https:\/\/fb.me\/react-invalid-hook-call for tips about how to debug and fix this problem.',\n );\n \n expect(getterCalls).toBe(1);\ndiff --git a\/packages\/react-debug-tools\/src\/__tests__\/ReactHooksInspectionIntegration-test.js b\/packages\/react-debug-tools\/src\/__tests__\/ReactHooksInspectionIntegration-test.js\nindex c12270626b..8faffa48e5 100644\n--- a\/packages\/react-debug-tools\/src\/__tests__\/ReactHooksInspectionIntegration-test.js\n+++ b\/packages\/react-debug-tools\/src\/__tests__\/ReactHooksInspectionIntegration-test.js\n@@ -657,7 +657,12 @@ describe('ReactHooksInspectionIntegration', () => {\n expect(() => {\n ReactDebugTools.inspectHooksOfFiber(childFiber, FakeDispatcherRef);\n }).toThrow(\n- 'Hooks can only be called inside the body of a function component.',\n+ 'Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for' +\n+ ' one of the following reasons:\\n' +\n+ '1. You might have mismatching versions of React and the renderer (such as React DOM)\\n' +\n+ '2. You might be breaking the Rules of Hooks\\n' +\n+ '3. You might have more than one copy of React in the same app\\n' +\n+ 'See https:\/\/fb.me\/react-invalid-hook-call for tips about how to debug and fix this problem.',\n );\n \n expect(getterCalls).toBe(1);\ndiff --git a\/packages\/react-dom\/src\/__tests__\/ReactDOMServerIntegrationHooks-test.internal.js b\/packages\/react-dom\/src\/__tests__\/ReactDOMServerIntegrationHooks-test.internal.js\nindex f93c51b838..a0a91763a8 100644\n--- a\/packages\/react-dom\/src\/__tests__\/ReactDOMServerIntegrationHooks-test.internal.js\n+++ b\/packages\/react-dom\/src\/__tests__\/ReactDOMServerIntegrationHooks-test.internal.js\n@@ -144,7 +144,12 @@ describe('ReactDOMServerHooks', () => {\n \n return render();\n },\n- 'Hooks can only be called inside the body of a function component.',\n+ 'Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for' +\n+ ' one of the following reasons:\\n' +\n+ '1. You might have mismatching versions of React and the renderer (such as React DOM)\\n' +\n+ '2. You might be breaking the Rules of Hooks\\n' +\n+ '3. You might have more than one copy of React in the same app\\n' +\n+ 'See https:\/\/fb.me\/react-invalid-hook-call for tips about how to debug and fix this problem.',\n );\n \n itRenders('multiple times when an updater is called', async render => {\n@@ -626,7 +631,12 @@ describe('ReactDOMServerHooks', () => {\n \n return render();\n },\n- 'Hooks can only be called inside the body of a function component.',\n+ 'Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for' +\n+ ' one of the following reasons:\\n' +\n+ '1. You might have mismatching versions of React and the renderer (such as React DOM)\\n' +\n+ '2. You might be breaking the Rules of Hooks\\n' +\n+ '3. You might have more than one copy of React in the same app\\n' +\n+ 'See https:\/\/fb.me\/react-invalid-hook-call for tips about how to debug and fix this problem.',\n );\n });\n \ndiff --git a\/packages\/react-dom\/src\/server\/ReactPartialRendererHooks.js b\/packages\/react-dom\/src\/server\/ReactPartialRendererHooks.js\nindex f1d2de025d..33c333cc79 100644\n--- a\/packages\/react-dom\/src\/server\/ReactPartialRendererHooks.js\n+++ b\/packages\/react-dom\/src\/server\/ReactPartialRendererHooks.js\n@@ -57,8 +57,12 @@ let currentHookNameInDev: ?string;\n function resolveCurrentlyRenderingComponent(): Object {\n invariant(\n currentlyRenderingComponent !== null,\n- 'Hooks can only be called inside the body of a function component. ' +\n- '(https:\/\/fb.me\/react-invalid-hook-call)',\n+ 'Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for' +\n+ ' one of the following reasons:\\n' +\n+ '1. You might have mismatching versions of React and the renderer (such as React DOM)\\n' +\n+ '2. You might be breaking the Rules of Hooks\\n' +\n+ '3. You might have more than one copy of React in the same app\\n' +\n+ 'See https:\/\/fb.me\/react-invalid-hook-call for tips about how to debug and fix this problem.',\n );\n if (__DEV__) {\n warning(\ndiff --git a\/packages\/react-reconciler\/src\/ReactFiberHooks.js b\/packages\/react-reconciler\/src\/ReactFiberHooks.js\nindex 655955072f..57d8a7c4ed 100644\n--- a\/packages\/react-reconciler\/src\/ReactFiberHooks.js\n+++ b\/packages\/react-reconciler\/src\/ReactFiberHooks.js\n@@ -278,8 +278,12 @@ function warnOnHookMismatchInDev(currentHookName: HookType) {\n function throwInvalidHookError() {\n invariant(\n false,\n- 'Hooks can only be called inside the body of a function component. ' +\n- '(https:\/\/fb.me\/react-invalid-hook-call)',\n+ 'Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for' +\n+ ' one of the following reasons:\\n' +\n+ '1. You might have mismatching versions of React and the renderer (such as React DOM)\\n' +\n+ '2. You might be breaking the Rules of Hooks\\n' +\n+ '3. You might have more than one copy of React in the same app\\n' +\n+ 'See https:\/\/fb.me\/react-invalid-hook-call for tips about how to debug and fix this problem.',\n );\n }\n \ndiff --git a\/packages\/react-reconciler\/src\/__tests__\/ReactHooks-test.internal.js b\/packages\/react-reconciler\/src\/__tests__\/ReactHooks-test.internal.js\nindex b02561c2e7..8933125cbf 100644\n--- a\/packages\/react-reconciler\/src\/__tests__\/ReactHooks-test.internal.js\n+++ b\/packages\/react-reconciler\/src\/__tests__\/ReactHooks-test.internal.js\n@@ -46,7 +46,12 @@ describe('ReactHooks', () => {\n expect(() => {\n ReactTestRenderer.create();\n }).toThrow(\n- 'Hooks can only be called inside the body of a function component.',\n+ 'Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen' +\n+ ' for one of the following reasons:\\n' +\n+ '1. You might have mismatching versions of React and the renderer (such as React DOM)\\n' +\n+ '2. You might be breaking the Rules of Hooks\\n' +\n+ '3. You might have more than one copy of React in the same app\\n' +\n+ 'See https:\/\/fb.me\/react-invalid-hook-call for tips about how to debug and fix this problem.',\n );\n });\n }\n@@ -875,15 +880,30 @@ describe('ReactHooks', () => {\n const root = ReactTestRenderer.create();\n \/\/ trying to render again should trigger comparison and throw\n expect(() => root.update()).toThrow(\n- 'Hooks can only be called inside the body of a function component',\n+ 'Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for' +\n+ ' one of the following reasons:\\n' +\n+ '1. You might have mismatching versions of React and the renderer (such as React DOM)\\n' +\n+ '2. You might be breaking the Rules of Hooks\\n' +\n+ '3. You might have more than one copy of React in the same app\\n' +\n+ 'See https:\/\/fb.me\/react-invalid-hook-call for tips about how to debug and fix this problem.',\n );\n \/\/ the next round, it does a fresh mount, so should render\n expect(() => root.update()).not.toThrow(\n- 'Hooks can only be called inside the body of a function component',\n+ 'Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for' +\n+ ' one of the following reasons:\\n' +\n+ '1. You might have mismatching versions of React and the renderer (such as React DOM)\\n' +\n+ '2. You might be breaking the Rules of Hooks\\n' +\n+ '3. You might have more than one copy of React in the same app\\n' +\n+ 'See https:\/\/fb.me\/react-invalid-hook-call for tips about how to debug and fix this problem.',\n );\n \/\/ and then again, fail\n expect(() => root.update()).toThrow(\n- 'Hooks can only be called inside the body of a function component',\n+ 'Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for' +\n+ ' one of the following reasons:\\n' +\n+ '1. You might have mismatching versions of React and the renderer (such as React DOM)\\n' +\n+ '2. You might be breaking the Rules of Hooks\\n' +\n+ '3. You might have more than one copy of React in the same app\\n' +\n+ 'See https:\/\/fb.me\/react-invalid-hook-call for tips about how to debug and fix this problem.',\n );\n });\n \ndiff --git a\/packages\/react-reconciler\/src\/__tests__\/ReactHooksWithNoopRenderer-test.internal.js b\/packages\/react-reconciler\/src\/__tests__\/ReactHooksWithNoopRenderer-test.internal.js\nindex 8988181be2..6fd77a90e4 100644\n--- a\/packages\/react-reconciler\/src\/__tests__\/ReactHooksWithNoopRenderer-test.internal.js\n+++ b\/packages\/react-reconciler\/src\/__tests__\/ReactHooksWithNoopRenderer-test.internal.js\n@@ -110,7 +110,12 @@ describe('ReactHooksWithNoopRenderer', () => {\n ReactNoop.render();\n \n expect(Scheduler).toFlushAndThrow(\n- 'Hooks can only be called inside the body of a function component.',\n+ 'Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for' +\n+ ' one of the following reasons:\\n' +\n+ '1. You might have mismatching versions of React and the renderer (such as React DOM)\\n' +\n+ '2. You might be breaking the Rules of Hooks\\n' +\n+ '3. You might have more than one copy of React in the same app\\n' +\n+ 'See https:\/\/fb.me\/react-invalid-hook-call for tips about how to debug and fix this problem.',\n );\n \n \/\/ Confirm that a subsequent hook works properly.\n@@ -133,7 +138,12 @@ describe('ReactHooksWithNoopRenderer', () => {\n }\n ReactNoop.render();\n expect(Scheduler).toFlushAndThrow(\n- 'Hooks can only be called inside the body of a function component.',\n+ 'Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for' +\n+ ' one of the following reasons:\\n' +\n+ '1. You might have mismatching versions of React and the renderer (such as React DOM)\\n' +\n+ '2. You might be breaking the Rules of Hooks\\n' +\n+ '3. You might have more than one copy of React in the same app\\n' +\n+ 'See https:\/\/fb.me\/react-invalid-hook-call for tips about how to debug and fix this problem.',\n );\n \n \/\/ Confirm that a subsequent hook works properly.\n@@ -147,7 +157,12 @@ describe('ReactHooksWithNoopRenderer', () => {\n \n it('throws when called outside the render phase', () => {\n expect(() => useState(0)).toThrow(\n- 'Hooks can only be called inside the body of a function component.',\n+ 'Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for' +\n+ ' one of the following reasons:\\n' +\n+ '1. You might have mismatching versions of React and the renderer (such as React DOM)\\n' +\n+ '2. You might be breaking the Rules of Hooks\\n' +\n+ '3. You might have more than one copy of React in the same app\\n' +\n+ 'See https:\/\/fb.me\/react-invalid-hook-call for tips about how to debug and fix this problem.',\n );\n });\n \ndiff --git a\/packages\/react-reconciler\/src\/__tests__\/ReactNewContext-test.internal.js b\/packages\/react-reconciler\/src\/__tests__\/ReactNewContext-test.internal.js\nindex 8e57a66792..e04b75dc59 100644\n--- a\/packages\/react-reconciler\/src\/__tests__\/ReactNewContext-test.internal.js\n+++ b\/packages\/react-reconciler\/src\/__tests__\/ReactNewContext-test.internal.js\n@@ -1517,7 +1517,12 @@ describe('ReactNewContext', () => {\n }\n ReactNoop.render();\n expect(Scheduler).toFlushAndThrow(\n- 'Hooks can only be called inside the body of a function component.',\n+ 'Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen' +\n+ ' for one of the following reasons:\\n' +\n+ '1. You might have mismatching versions of React and the renderer (such as React DOM)\\n' +\n+ '2. You might be breaking the Rules of Hooks\\n' +\n+ '3. You might have more than one copy of React in the same app\\n' +\n+ 'See https:\/\/fb.me\/react-invalid-hook-call for tips about how to debug and fix this problem.',\n );\n });\n \ndiff --git a\/packages\/react-test-renderer\/src\/ReactShallowRenderer.js b\/packages\/react-test-renderer\/src\/ReactShallowRenderer.js\nindex 120fe54383..850b2b3741 100644\n--- a\/packages\/react-test-renderer\/src\/ReactShallowRenderer.js\n+++ b\/packages\/react-test-renderer\/src\/ReactShallowRenderer.js\n@@ -218,8 +218,12 @@ class ReactShallowRenderer {\n _validateCurrentlyRenderingComponent() {\n invariant(\n this._rendering && !this._instance,\n- 'Hooks can only be called inside the body of a function component. ' +\n- '(https:\/\/fb.me\/react-invalid-hook-call)',\n+ 'Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for' +\n+ ' one of the following reasons:\\n' +\n+ '1. You might have mismatching versions of React and the renderer (such as React DOM)\\n' +\n+ '2. You might be breaking the Rules of Hooks\\n' +\n+ '3. You might have more than one copy of React in the same app\\n' +\n+ 'See https:\/\/fb.me\/react-invalid-hook-call for tips about how to debug and fix this problem.',\n );\n }\n \ndiff --git a\/packages\/react\/src\/ReactHooks.js b\/packages\/react\/src\/ReactHooks.js\nindex 784ab8fe31..9c325b32a4 100644\n--- a\/packages\/react\/src\/ReactHooks.js\n+++ b\/packages\/react\/src\/ReactHooks.js\n@@ -17,8 +17,12 @@ function resolveDispatcher() {\n const dispatcher = ReactCurrentDispatcher.current;\n invariant(\n dispatcher !== null,\n- 'Hooks can only be called inside the body of a function component. ' +\n- '(https:\/\/fb.me\/react-invalid-hook-call)',\n+ 'Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for' +\n+ ' one of the following reasons:\\n' +\n+ '1. You might have mismatching versions of React and the renderer (such as React DOM)\\n' +\n+ '2. You might be breaking the Rules of Hooks\\n' +\n+ '3. You might have more than one copy of React in the same app\\n' +\n+ 'See https:\/\/fb.me\/react-invalid-hook-call for tips about how to debug and fix this problem.',\n );\n return dispatcher;\n }\n","body":"* Add more info to invalid hook call error message\r\n\r\n* Update other renderers + change call to action\r\n\r\n* Update related tests for new hooks error message\r\n\r\n* Fix lint errors","files":[{"status":"M","path":"packages\/react-debug-tools\/src\/__tests__\/ReactHooksInspection-test.js"},{"status":"M","path":"packages\/react-debug-tools\/src\/__tests__\/ReactHooksInspectionIntegration-test.js"},{"status":"M","path":"packages\/react-dom\/src\/__tests__\/ReactDOMServerIntegrationHooks-test.internal.js"},{"status":"M","path":"packages\/react-dom\/src\/server\/ReactPartialRendererHooks.js"},{"status":"M","path":"packages\/react-reconciler\/src\/ReactFiberHooks.js"},{"status":"M","path":"packages\/react-reconciler\/src\/__tests__\/ReactHooks-test.internal.js"},{"status":"M","path":"packages\/react-reconciler\/src\/__tests__\/ReactHooksWithNoopRenderer-test.internal.js"},{"status":"M","path":"packages\/react-reconciler\/src\/__tests__\/ReactNewContext-test.internal.js"},{"status":"M","path":"packages\/react-test-renderer\/src\/ReactShallowRenderer.js"},{"status":"M","path":"packages\/react\/src\/ReactHooks.js"}],"commit":{"revision":"2b93d686e359c7afa299e2ec5cf63160a32a1155","authorEmail":"jaredloganpalmer@gmail.com","shortRevision":"2b93d686e3","subject":"Add more info to invalid hook call error message (#15139)","authoredAt":"2019-03-18T14:22:38-04:00","authorName":"Jared Palmer"}}

dillon1000/react

Files changed