Remove unnecessary warnings (#18135)
Dan Abramov committed
Feb 27, 2020 at 02:14 UTC
849e8328b596ce67720f33d73a1d57108e6de504
9 files changed
+31
-195
packages/react-dom/src/__tests__/ReactCompositeComponent-test.js
-37
@@ -493,43 +493,6 @@ describe('ReactCompositeComponent', () => {
493
ReactDOM.render(<Component prop={123} />, container);
494
});
495
496
- it('should warn about `setState` in getChildContext', () => {
497
- const container = document.createElement('div');
498
-
499
- let renderPasses = 0;
500
-
501
- class Component extends React.Component {
502
- state = {value: 0};
503
-
504
- getChildContext() {
505
- if (this.state.value === 0) {
506
- this.setState({value: 1});
507
- }
508
- }
509
-
510
- render() {
511
- renderPasses++;
512
- return <div />;
513
- }
514
- }
515
- Component.childContextTypes = {};
516
-
517
- let instance;
518
-
519
- expect(() => {
520
- instance = ReactDOM.render(<Component />, container);
521
- }).toErrorDev(
522
- 'Warning: setState(...): Cannot call setState() inside getChildContext()',
523
- );
524
-
525
- expect(renderPasses).toBe(2);
526
- expect(instance.state.value).toBe(1);
527
-
528
- // Test deduplication; (no additional warnings are expected).
529
- ReactDOM.unmountComponentAtNode(container);
530
- ReactDOM.render(<Component />, container);
531
- });
532
-
496
it('should cleanup even if render() fatals', () => {
497
class BadComponent extends React.Component {
498
render() {
packages/react-dom/src/__tests__/ReactDOMComponent-test.js
-47
@@ -1242,53 +1242,6 @@ describe('ReactDOMComponent', () => {
1242
);
1243
});
1244
1245
- it('should emit a warning once for a named custom component using shady DOM', () => {
1246
- const defaultCreateElement = document.createElement.bind(document);
1247
-
1248
- try {
1249
- document.createElement = element => {
1250
- const container = defaultCreateElement(element);
1251
- container.shadyRoot = {};
1252
- return container;
1253
- };
1254
- class ShadyComponent extends React.Component {
1255
- render() {
1256
- return <polymer-component />;
1257
- }
1258
- }
1259
- const node = document.createElement('div');
1260
- expect(() => ReactDOM.render(<ShadyComponent />, node)).toErrorDev(
1261
- 'ShadyComponent is using shady DOM. Using shady DOM with React can ' +
1262
- 'cause things to break subtly.',
1263
- );
1264
- mountComponent({is: 'custom-shady-div2'});
1265
- } finally {
1266
- document.createElement = defaultCreateElement;
1267
- }
1268
- });
1269
-
1270
- it('should emit a warning once for an unnamed custom component using shady DOM', () => {
1271
- const defaultCreateElement = document.createElement.bind(document);
1272
-
1273
- try {
1274
- document.createElement = element => {
1275
- const container = defaultCreateElement(element);
1276
- container.shadyRoot = {};
1277
- return container;
1278
- };
1279
-
1280
- expect(() => mountComponent({is: 'custom-shady-div'})).toErrorDev(
1281
- 'A component is using shady DOM. Using shady DOM with React can ' +
1282
- 'cause things to break subtly.',
1283
- );
1284
-
1285
- // No additional warnings are expected
1286
- mountComponent({is: 'custom-shady-div2'});
1287
- } finally {
1288
- document.createElement = defaultCreateElement;
1289
- }
1290
- });
1291
-
1245
it('should treat menuitem as a void element but still create the closing tag', () => {
1246
// menuitem is not implemented in jsdom, so this triggers the unknown warning error
1247
const container = document.createElement('div');
packages/react-dom/src/client/ReactDOMComponent.js
-27
@@ -7,8 +7,6 @@
7
* @flow
8
*/
9
10
-// TODO: direct imports like some-package/src/* are bad. Fix me.
11
-import {getCurrentFiberOwnerNameInDevOrNull} from 'react-reconciler/src/ReactCurrentFiber';
10
import {registrationNameModules} from 'legacy-events/EventPluginRegistry';
11
import {canUseDOM} from 'shared/ExecutionEnvironment';
12
import endsWith from 'shared/endsWith';
@@ -90,7 +88,6 @@ import {
88
import {legacyListenToEvent} from '../events/DOMLegacyEventPluginSystem';
89
90
let didWarnInvalidHydration = false;
93
-let didWarnShadyDOM = false;
91
let didWarnScriptTags = false;
92
93
const DANGEROUSLY_SET_INNER_HTML = 'dangerouslySetInnerHTML';
@@ -509,18 +506,6 @@ export function setInitialProperties(
506
const isCustomComponentTag = isCustomComponent(tag, rawProps);
507
if (__DEV__) {
508
validatePropertiesInDevelopment(tag, rawProps);
512
- if (
513
- isCustomComponentTag &&
514
- !didWarnShadyDOM &&
515
- (domElement: any).shadyRoot
516
- ) {
517
- console.error(
518
- '%s is using shady DOM. Using shady DOM with React can ' +
519
- 'cause things to break subtly.',
520
- getCurrentFiberOwnerNameInDevOrNull() || 'A component',
521
- );
522
- didWarnShadyDOM = true;
523
- }
509
}
510
511
// TODO: Make sure that we check isMounted before firing any of these events.
@@ -906,18 +891,6 @@ export function diffHydratedProperties(
891
suppressHydrationWarning = rawProps[SUPPRESS_HYDRATION_WARNING] === true;
892
isCustomComponentTag = isCustomComponent(tag, rawProps);
893
validatePropertiesInDevelopment(tag, rawProps);
909
- if (
910
- isCustomComponentTag &&
911
- !didWarnShadyDOM &&
912
- (domElement: any).shadyRoot
913
- ) {
914
- console.error(
915
- '%s is using shady DOM. Using shady DOM with React can ' +
916
- 'cause things to break subtly.',
917
- getCurrentFiberOwnerNameInDevOrNull() || 'A component',
918
- );
919
- didWarnShadyDOM = true;
920
- }
894
}
895
896
// TODO: Make sure that we check isMounted before firing any of these events.
packages/react-reconciler/src/ReactCurrentFiber.js
+5
-7
@@ -23,8 +23,6 @@ import getComponentName from 'shared/getComponentName';
23
24
const ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
25
26
-type LifeCyclePhase = 'render' | 'getChildContext';
27
-
26
function describeFiber(fiber: Fiber): string {
27
switch (fiber.tag) {
28
case HostRoot:
@@ -57,7 +55,7 @@ export function getStackByFiberInDevAndProd(workInProgress: Fiber): string {
55
}
56
57
export let current: Fiber | null = null;
60
-export let phase: LifeCyclePhase | null = null;
58
+export let isRendering: boolean = false;
59
60
export function getCurrentFiberOwnerNameInDevOrNull(): string | null {
61
if (__DEV__) {
@@ -88,7 +86,7 @@ export function resetCurrentFiber() {
86
if (__DEV__) {
87
ReactDebugCurrentFrame.getCurrentStack = null;
88
current = null;
91
- phase = null;
89
+ isRendering = false;
90
}
91
}
92
@@ -96,12 +94,12 @@ export function setCurrentFiber(fiber: Fiber) {
94
if (__DEV__) {
95
ReactDebugCurrentFrame.getCurrentStack = getCurrentFiberStackInDev;
96
current = fiber;
99
- phase = null;
97
+ isRendering = false;
98
}
99
}
100
103
-export function setCurrentPhase(lifeCyclePhase: LifeCyclePhase | null) {
101
+export function setIsRendering(rendering: boolean) {
102
if (__DEV__) {
105
- phase = lifeCyclePhase;
103
+ isRendering = rendering;
104
}
105
}
packages/react-reconciler/src/ReactFiberBeginWork.js
+11
-25
@@ -74,9 +74,9 @@ import ReactStrictModeWarnings from './ReactStrictModeWarnings';
74
import {refineResolvedLazyComponent} from 'shared/ReactLazyComponent';
75
import {REACT_LAZY_TYPE, getIteratorFn} from 'shared/ReactSymbols';
76
import {
77
- setCurrentPhase,
77
getCurrentFiberOwnerNameInDevOrNull,
78
getCurrentFiberStackInDev,
79
+ setIsRendering,
80
} from './ReactCurrentFiber';
81
import {startWorkTimer, cancelWorkTimer} from './ReactDebugFiberPerf';
82
import {
@@ -193,7 +193,6 @@ let didWarnAboutContextTypeOnFunctionComponent;
193
let didWarnAboutGetDerivedStateOnFunctionComponent;
194
let didWarnAboutFunctionRefs;
195
export let didWarnAboutReassigningProps;
196
-let didWarnAboutMaxDuration;
196
let didWarnAboutRevealOrder;
197
let didWarnAboutTailOptions;
198
let didWarnAboutDefaultPropsOnFunctionComponent;
@@ -205,7 +204,6 @@ if (__DEV__) {
204
didWarnAboutGetDerivedStateOnFunctionComponent = {};
205
didWarnAboutFunctionRefs = {};
206
didWarnAboutReassigningProps = false;
208
- didWarnAboutMaxDuration = false;
207
didWarnAboutRevealOrder = {};
208
didWarnAboutTailOptions = {};
209
didWarnAboutDefaultPropsOnFunctionComponent = {};
@@ -312,7 +310,7 @@ function updateForwardRef(
310
prepareToReadContext(workInProgress, renderExpirationTime);
311
if (__DEV__) {
312
ReactCurrentOwner.current = workInProgress;
315
- setCurrentPhase('render');
313
+ setIsRendering(true);
314
nextChildren = renderWithHooks(
315
current,
316
workInProgress,
@@ -337,7 +335,7 @@ function updateForwardRef(
335
);
336
}
337
}
340
- setCurrentPhase(null);
338
+ setIsRendering(false);
339
} else {
340
nextChildren = renderWithHooks(
341
current,
@@ -644,7 +642,7 @@ function updateFunctionComponent(
642
prepareToReadContext(workInProgress, renderExpirationTime);
643
if (__DEV__) {
644
ReactCurrentOwner.current = workInProgress;
647
- setCurrentPhase('render');
645
+ setIsRendering(true);
646
nextChildren = renderWithHooks(
647
current,
648
workInProgress,
@@ -669,7 +667,7 @@ function updateFunctionComponent(
667
);
668
}
669
}
672
- setCurrentPhase(null);
670
+ setIsRendering(false);
671
} else {
672
nextChildren = renderWithHooks(
673
current,
@@ -720,7 +718,7 @@ function updateBlock(
718
prepareToReadContext(workInProgress, renderExpirationTime);
719
if (__DEV__) {
720
ReactCurrentOwner.current = workInProgress;
723
- setCurrentPhase('render');
721
+ setIsRendering(true);
722
nextChildren = renderWithHooks(
723
current,
724
workInProgress,
@@ -745,7 +743,7 @@ function updateBlock(
743
);
744
}
745
}
748
- setCurrentPhase(null);
746
+ setIsRendering(false);
747
} else {
748
nextChildren = renderWithHooks(
749
current,
@@ -923,7 +921,7 @@ function finishClassComponent(
921
}
922
} else {
923
if (__DEV__) {
926
- setCurrentPhase('render');
924
+ setIsRendering(true);
925
nextChildren = instance.render();
926
if (
927
debugRenderPhaseSideEffectsForStrictMode &&
@@ -931,7 +929,7 @@ function finishClassComponent(
929
) {
930
instance.render();
931
}
934
- setCurrentPhase(null);
932
+ setIsRendering(false);
933
} else {
934
nextChildren = instance.render();
935
}
@@ -1637,18 +1635,6 @@ function updateSuspenseComponent(
1635
1636
pushSuspenseContext(workInProgress, suspenseContext);
1637
1640
- if (__DEV__) {
1641
- if ('maxDuration' in nextProps) {
1642
- if (!didWarnAboutMaxDuration) {
1643
- didWarnAboutMaxDuration = true;
1644
- console.error(
1645
- 'maxDuration has been removed from React. ' +
1646
- 'Remove the maxDuration prop.',
1647
- );
1648
- }
1649
- }
1650
- }
1651
-
1638
// This next part is a bit confusing. If the children timeout, we switch to
1639
// showing the fallback children in place of the "primary" children.
1640
// However, we don't want to delete the primary children because then their
@@ -2732,9 +2718,9 @@ function updateContextConsumer(
2718
let newChildren;
2719
if (__DEV__) {
2720
ReactCurrentOwner.current = workInProgress;
2735
- setCurrentPhase('render');
2721
+ setIsRendering(true);
2722
newChildren = render(newValue);
2737
- setCurrentPhase(null);
2723
+ setIsRendering(false);
2724
} else {
2725
newChildren = render(newValue);
2726
}
packages/react-reconciler/src/ReactFiberContext.js
+1
-7
@@ -17,7 +17,7 @@ import getComponentName from 'shared/getComponentName';
17
import invariant from 'shared/invariant';
18
import checkPropTypes from 'prop-types/checkPropTypes';
19
20
-import {setCurrentPhase, getCurrentFiberStackInDev} from './ReactCurrentFiber';
20
+import {getCurrentFiberStackInDev} from './ReactCurrentFiber';
21
import {startPhaseTimer, stopPhaseTimer} from './ReactDebugFiberPerf';
22
import {createCursor, push, pop} from './ReactFiberStack';
23
@@ -210,15 +210,9 @@ function processChildContext(
210
}
211
212
let childContext;
213
- if (__DEV__) {
214
- setCurrentPhase('getChildContext');
215
- }
213
startPhaseTimer(fiber, 'getChildContext');
214
childContext = instance.getChildContext();
215
stopPhaseTimer();
219
- if (__DEV__) {
220
- setCurrentPhase(null);
221
- }
216
for (let contextKey in childContext) {
217
invariant(
218
contextKey in childContextTypes,
packages/react-reconciler/src/ReactFiberReconciler.js
+2
-2
@@ -70,7 +70,7 @@ import {
70
import {createUpdate, enqueueUpdate} from './ReactUpdateQueue';
71
import {
72
getStackByFiberInDevAndProd,
73
- phase as ReactCurrentFiberPhase,
73
+ isRendering as ReactCurrentFiberIsRendering,
74
current as ReactCurrentFiberCurrent,
75
} from './ReactCurrentFiber';
76
import {StrictMode} from './ReactTypeOfMode';
@@ -259,7 +259,7 @@ export function updateContainer(
259
260
if (__DEV__) {
261
if (
262
- ReactCurrentFiberPhase === 'render' &&
262
+ ReactCurrentFiberIsRendering &&
263
ReactCurrentFiberCurrent !== null &&
264
!didWarnAboutNestedUpdates
265
) {
packages/react-reconciler/src/ReactFiberWorkLoop.js
+12
-24
@@ -156,7 +156,7 @@ import {
156
import getComponentName from 'shared/getComponentName';
157
import ReactStrictModeWarnings from './ReactStrictModeWarnings';
158
import {
159
- phase as ReactCurrentDebugFiberPhaseInDEV,
159
+ isRendering as ReactCurrentDebugFiberIsRenderingInDEV,
160
resetCurrentFiber as resetCurrentDebugFiberInDEV,
161
setCurrentFiber as setCurrentDebugFiberInDEV,
162
getStackByFiberInDevAndProd,
@@ -2793,7 +2793,6 @@ if (__DEV__ && replayFailedUnitOfWorkWithInvokeGuardedCallback) {
2793
}
2794
2795
let didWarnAboutUpdateInRender = false;
2796
-let didWarnAboutUpdateInGetChildContext = false;
2796
function warnAboutRenderPhaseUpdatesInDEV(fiber) {
2797
if (__DEV__) {
2798
if ((executionContext & RenderContext) !== NoContext) {
@@ -2808,29 +2807,18 @@ function warnAboutRenderPhaseUpdatesInDEV(fiber) {
2807
break;
2808
}
2809
case ClassComponent: {
2811
- switch (ReactCurrentDebugFiberPhaseInDEV) {
2812
- case 'getChildContext':
2813
- if (didWarnAboutUpdateInGetChildContext) {
2814
- return;
2815
- }
2816
- console.error(
2817
- 'setState(...): Cannot call setState() inside getChildContext()',
2818
- );
2819
- didWarnAboutUpdateInGetChildContext = true;
2820
- break;
2821
- case 'render':
2822
- if (didWarnAboutUpdateInRender) {
2823
- return;
2824
- }
2825
- console.error(
2826
- 'Cannot update during an existing state transition (such as ' +
2827
- 'within `render`). Render methods should be a pure ' +
2828
- 'function of props and state.',
2829
- );
2830
- didWarnAboutUpdateInRender = true;
2831
- break;
2810
+ if (
2811
+ ReactCurrentDebugFiberIsRenderingInDEV &&
2812
+ !didWarnAboutUpdateInRender
2813
+ ) {
2814
+ console.error(
2815
+ 'Cannot update during an existing state transition (such as ' +
2816
+ 'within `render`). Render methods should be a pure ' +
2817
+ 'function of props and state.',
2818
+ );
2819
+ didWarnAboutUpdateInRender = true;
2820
+ break;
2821
}
2833
- break;
2822
}
2823
}
2824
}
packages/react-reconciler/src/__tests__/ReactSuspenseWithNoopRenderer-test.internal.js
-19
@@ -110,25 +110,6 @@ function loadModules({
110
}
111
}
112
113
- it('warns if the deprecated maxDuration option is used', () => {
114
- function Foo() {
115
- return (
116
- <Suspense maxDuration={100} fallback="Loading...">
117
- <div />;
118
- </Suspense>
119
- );
120
- }
121
-
122
- ReactNoop.render(<Foo />);
123
-
124
- expect(() => Scheduler.unstable_flushAll()).toErrorDev([
125
- 'Warning: maxDuration has been removed from React. ' +
126
- 'Remove the maxDuration prop.' +
127
- '\n in Suspense (at **)' +
128
- '\n in Foo (at **)',
129
- ]);
130
- });
131
-
113
it('does not restart rendering for initial render', async () => {
114
function Bar(props) {
115
Scheduler.unstable_yieldValue('Bar');