diff --git a/packages/react-dom/src/__tests__/ReactCompositeComponent-test.js b/packages/react-dom/src/__tests__/ReactCompositeComponent-test.js index 908d418cac7ef..49e107f877ef5 100644 --- a/packages/react-dom/src/__tests__/ReactCompositeComponent-test.js +++ b/packages/react-dom/src/__tests__/ReactCompositeComponent-test.js @@ -493,43 +493,6 @@ describe('ReactCompositeComponent', () => { ReactDOM.render(, container); }); - it('should warn about `setState` in getChildContext', () => { - const container = document.createElement('div'); - - let renderPasses = 0; - - class Component extends React.Component { - state = {value: 0}; - - getChildContext() { - if (this.state.value === 0) { - this.setState({value: 1}); - } - } - - render() { - renderPasses++; - return
; - } - } - Component.childContextTypes = {}; - - let instance; - - expect(() => { - instance = ReactDOM.render(, container); - }).toErrorDev( - 'Warning: setState(...): Cannot call setState() inside getChildContext()', - ); - - expect(renderPasses).toBe(2); - expect(instance.state.value).toBe(1); - - // Test deduplication; (no additional warnings are expected). - ReactDOM.unmountComponentAtNode(container); - ReactDOM.render(, container); - }); - it('should cleanup even if render() fatals', () => { class BadComponent extends React.Component { render() { diff --git a/packages/react-dom/src/__tests__/ReactDOMComponent-test.js b/packages/react-dom/src/__tests__/ReactDOMComponent-test.js index 7a0e286399528..1b9e644848894 100644 --- a/packages/react-dom/src/__tests__/ReactDOMComponent-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMComponent-test.js @@ -1242,53 +1242,6 @@ describe('ReactDOMComponent', () => { ); }); - it('should emit a warning once for a named custom component using shady DOM', () => { - const defaultCreateElement = document.createElement.bind(document); - - try { - document.createElement = element => { - const container = defaultCreateElement(element); - container.shadyRoot = {}; - return container; - }; - class ShadyComponent extends React.Component { - render() { - return ; - } - } - const node = document.createElement('div'); - expect(() => ReactDOM.render(, node)).toErrorDev( - 'ShadyComponent is using shady DOM. Using shady DOM with React can ' + - 'cause things to break subtly.', - ); - mountComponent({is: 'custom-shady-div2'}); - } finally { - document.createElement = defaultCreateElement; - } - }); - - it('should emit a warning once for an unnamed custom component using shady DOM', () => { - const defaultCreateElement = document.createElement.bind(document); - - try { - document.createElement = element => { - const container = defaultCreateElement(element); - container.shadyRoot = {}; - return container; - }; - - expect(() => mountComponent({is: 'custom-shady-div'})).toErrorDev( - 'A component is using shady DOM. Using shady DOM with React can ' + - 'cause things to break subtly.', - ); - - // No additional warnings are expected - mountComponent({is: 'custom-shady-div2'}); - } finally { - document.createElement = defaultCreateElement; - } - }); - it('should treat menuitem as a void element but still create the closing tag', () => { // menuitem is not implemented in jsdom, so this triggers the unknown warning error const container = document.createElement('div'); diff --git a/packages/react-dom/src/client/ReactDOMComponent.js b/packages/react-dom/src/client/ReactDOMComponent.js index 854137dec6fa6..cdf953207d0d1 100644 --- a/packages/react-dom/src/client/ReactDOMComponent.js +++ b/packages/react-dom/src/client/ReactDOMComponent.js @@ -7,8 +7,6 @@ * @flow */ -// TODO: direct imports like some-package/src/* are bad. Fix me. -import {getCurrentFiberOwnerNameInDevOrNull} from 'react-reconciler/src/ReactCurrentFiber'; import {registrationNameModules} from 'legacy-events/EventPluginRegistry'; import {canUseDOM} from 'shared/ExecutionEnvironment'; import endsWith from 'shared/endsWith'; @@ -90,7 +88,6 @@ import { import {legacyListenToEvent} from '../events/DOMLegacyEventPluginSystem'; let didWarnInvalidHydration = false; -let didWarnShadyDOM = false; let didWarnScriptTags = false; const DANGEROUSLY_SET_INNER_HTML = 'dangerouslySetInnerHTML'; @@ -509,18 +506,6 @@ export function setInitialProperties( const isCustomComponentTag = isCustomComponent(tag, rawProps); if (__DEV__) { validatePropertiesInDevelopment(tag, rawProps); - if ( - isCustomComponentTag && - !didWarnShadyDOM && - (domElement: any).shadyRoot - ) { - console.error( - '%s is using shady DOM. Using shady DOM with React can ' + - 'cause things to break subtly.', - getCurrentFiberOwnerNameInDevOrNull() || 'A component', - ); - didWarnShadyDOM = true; - } } // TODO: Make sure that we check isMounted before firing any of these events. @@ -906,18 +891,6 @@ export function diffHydratedProperties( suppressHydrationWarning = rawProps[SUPPRESS_HYDRATION_WARNING] === true; isCustomComponentTag = isCustomComponent(tag, rawProps); validatePropertiesInDevelopment(tag, rawProps); - if ( - isCustomComponentTag && - !didWarnShadyDOM && - (domElement: any).shadyRoot - ) { - console.error( - '%s is using shady DOM. Using shady DOM with React can ' + - 'cause things to break subtly.', - getCurrentFiberOwnerNameInDevOrNull() || 'A component', - ); - didWarnShadyDOM = true; - } } // TODO: Make sure that we check isMounted before firing any of these events. diff --git a/packages/react-reconciler/src/ReactCurrentFiber.js b/packages/react-reconciler/src/ReactCurrentFiber.js index 47baa167eb3d6..d6096791b674a 100644 --- a/packages/react-reconciler/src/ReactCurrentFiber.js +++ b/packages/react-reconciler/src/ReactCurrentFiber.js @@ -23,8 +23,6 @@ import getComponentName from 'shared/getComponentName'; const ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame; -type LifeCyclePhase = 'render' | 'getChildContext'; - function describeFiber(fiber: Fiber): string { switch (fiber.tag) { case HostRoot: @@ -57,7 +55,7 @@ export function getStackByFiberInDevAndProd(workInProgress: Fiber): string { } export let current: Fiber | null = null; -export let phase: LifeCyclePhase | null = null; +export let isRendering: boolean = false; export function getCurrentFiberOwnerNameInDevOrNull(): string | null { if (__DEV__) { @@ -88,7 +86,7 @@ export function resetCurrentFiber() { if (__DEV__) { ReactDebugCurrentFrame.getCurrentStack = null; current = null; - phase = null; + isRendering = false; } } @@ -96,12 +94,12 @@ export function setCurrentFiber(fiber: Fiber) { if (__DEV__) { ReactDebugCurrentFrame.getCurrentStack = getCurrentFiberStackInDev; current = fiber; - phase = null; + isRendering = false; } } -export function setCurrentPhase(lifeCyclePhase: LifeCyclePhase | null) { +export function setIsRendering(rendering: boolean) { if (__DEV__) { - phase = lifeCyclePhase; + isRendering = rendering; } } diff --git a/packages/react-reconciler/src/ReactFiberBeginWork.js b/packages/react-reconciler/src/ReactFiberBeginWork.js index 8eb9f9ffb9502..ddbdacd61a1dc 100644 --- a/packages/react-reconciler/src/ReactFiberBeginWork.js +++ b/packages/react-reconciler/src/ReactFiberBeginWork.js @@ -74,9 +74,9 @@ import ReactStrictModeWarnings from './ReactStrictModeWarnings'; import {refineResolvedLazyComponent} from 'shared/ReactLazyComponent'; import {REACT_LAZY_TYPE, getIteratorFn} from 'shared/ReactSymbols'; import { - setCurrentPhase, getCurrentFiberOwnerNameInDevOrNull, getCurrentFiberStackInDev, + setIsRendering, } from './ReactCurrentFiber'; import {startWorkTimer, cancelWorkTimer} from './ReactDebugFiberPerf'; import { @@ -193,7 +193,6 @@ let didWarnAboutContextTypeOnFunctionComponent; let didWarnAboutGetDerivedStateOnFunctionComponent; let didWarnAboutFunctionRefs; export let didWarnAboutReassigningProps; -let didWarnAboutMaxDuration; let didWarnAboutRevealOrder; let didWarnAboutTailOptions; let didWarnAboutDefaultPropsOnFunctionComponent; @@ -205,7 +204,6 @@ if (__DEV__) { didWarnAboutGetDerivedStateOnFunctionComponent = {}; didWarnAboutFunctionRefs = {}; didWarnAboutReassigningProps = false; - didWarnAboutMaxDuration = false; didWarnAboutRevealOrder = {}; didWarnAboutTailOptions = {}; didWarnAboutDefaultPropsOnFunctionComponent = {}; @@ -312,7 +310,7 @@ function updateForwardRef( prepareToReadContext(workInProgress, renderExpirationTime); if (__DEV__) { ReactCurrentOwner.current = workInProgress; - setCurrentPhase('render'); + setIsRendering(true); nextChildren = renderWithHooks( current, workInProgress, @@ -337,7 +335,7 @@ function updateForwardRef( ); } } - setCurrentPhase(null); + setIsRendering(false); } else { nextChildren = renderWithHooks( current, @@ -644,7 +642,7 @@ function updateFunctionComponent( prepareToReadContext(workInProgress, renderExpirationTime); if (__DEV__) { ReactCurrentOwner.current = workInProgress; - setCurrentPhase('render'); + setIsRendering(true); nextChildren = renderWithHooks( current, workInProgress, @@ -669,7 +667,7 @@ function updateFunctionComponent( ); } } - setCurrentPhase(null); + setIsRendering(false); } else { nextChildren = renderWithHooks( current, @@ -720,7 +718,7 @@ function updateBlock( prepareToReadContext(workInProgress, renderExpirationTime); if (__DEV__) { ReactCurrentOwner.current = workInProgress; - setCurrentPhase('render'); + setIsRendering(true); nextChildren = renderWithHooks( current, workInProgress, @@ -745,7 +743,7 @@ function updateBlock( ); } } - setCurrentPhase(null); + setIsRendering(false); } else { nextChildren = renderWithHooks( current, @@ -923,7 +921,7 @@ function finishClassComponent( } } else { if (__DEV__) { - setCurrentPhase('render'); + setIsRendering(true); nextChildren = instance.render(); if ( debugRenderPhaseSideEffectsForStrictMode && @@ -931,7 +929,7 @@ function finishClassComponent( ) { instance.render(); } - setCurrentPhase(null); + setIsRendering(false); } else { nextChildren = instance.render(); } @@ -1637,18 +1635,6 @@ function updateSuspenseComponent( pushSuspenseContext(workInProgress, suspenseContext); - if (__DEV__) { - if ('maxDuration' in nextProps) { - if (!didWarnAboutMaxDuration) { - didWarnAboutMaxDuration = true; - console.error( - 'maxDuration has been removed from React. ' + - 'Remove the maxDuration prop.', - ); - } - } - } - // This next part is a bit confusing. If the children timeout, we switch to // showing the fallback children in place of the "primary" children. // However, we don't want to delete the primary children because then their @@ -2732,9 +2718,9 @@ function updateContextConsumer( let newChildren; if (__DEV__) { ReactCurrentOwner.current = workInProgress; - setCurrentPhase('render'); + setIsRendering(true); newChildren = render(newValue); - setCurrentPhase(null); + setIsRendering(false); } else { newChildren = render(newValue); } diff --git a/packages/react-reconciler/src/ReactFiberContext.js b/packages/react-reconciler/src/ReactFiberContext.js index 946d33606c813..5f4375b4c5c1f 100644 --- a/packages/react-reconciler/src/ReactFiberContext.js +++ b/packages/react-reconciler/src/ReactFiberContext.js @@ -17,7 +17,7 @@ import getComponentName from 'shared/getComponentName'; import invariant from 'shared/invariant'; import checkPropTypes from 'prop-types/checkPropTypes'; -import {setCurrentPhase, getCurrentFiberStackInDev} from './ReactCurrentFiber'; +import {getCurrentFiberStackInDev} from './ReactCurrentFiber'; import {startPhaseTimer, stopPhaseTimer} from './ReactDebugFiberPerf'; import {createCursor, push, pop} from './ReactFiberStack'; @@ -210,15 +210,9 @@ function processChildContext( } let childContext; - if (__DEV__) { - setCurrentPhase('getChildContext'); - } startPhaseTimer(fiber, 'getChildContext'); childContext = instance.getChildContext(); stopPhaseTimer(); - if (__DEV__) { - setCurrentPhase(null); - } for (let contextKey in childContext) { invariant( contextKey in childContextTypes, diff --git a/packages/react-reconciler/src/ReactFiberReconciler.js b/packages/react-reconciler/src/ReactFiberReconciler.js index 8102f66c25f65..816a3946562e1 100644 --- a/packages/react-reconciler/src/ReactFiberReconciler.js +++ b/packages/react-reconciler/src/ReactFiberReconciler.js @@ -70,7 +70,7 @@ import { import {createUpdate, enqueueUpdate} from './ReactUpdateQueue'; import { getStackByFiberInDevAndProd, - phase as ReactCurrentFiberPhase, + isRendering as ReactCurrentFiberIsRendering, current as ReactCurrentFiberCurrent, } from './ReactCurrentFiber'; import {StrictMode} from './ReactTypeOfMode'; @@ -259,7 +259,7 @@ export function updateContainer( if (__DEV__) { if ( - ReactCurrentFiberPhase === 'render' && + ReactCurrentFiberIsRendering && ReactCurrentFiberCurrent !== null && !didWarnAboutNestedUpdates ) { diff --git a/packages/react-reconciler/src/ReactFiberWorkLoop.js b/packages/react-reconciler/src/ReactFiberWorkLoop.js index 3c2427594a798..1272338f75ad7 100644 --- a/packages/react-reconciler/src/ReactFiberWorkLoop.js +++ b/packages/react-reconciler/src/ReactFiberWorkLoop.js @@ -156,7 +156,7 @@ import { import getComponentName from 'shared/getComponentName'; import ReactStrictModeWarnings from './ReactStrictModeWarnings'; import { - phase as ReactCurrentDebugFiberPhaseInDEV, + isRendering as ReactCurrentDebugFiberIsRenderingInDEV, resetCurrentFiber as resetCurrentDebugFiberInDEV, setCurrentFiber as setCurrentDebugFiberInDEV, getStackByFiberInDevAndProd, @@ -2793,7 +2793,6 @@ if (__DEV__ && replayFailedUnitOfWorkWithInvokeGuardedCallback) { } let didWarnAboutUpdateInRender = false; -let didWarnAboutUpdateInGetChildContext = false; function warnAboutRenderPhaseUpdatesInDEV(fiber) { if (__DEV__) { if ((executionContext & RenderContext) !== NoContext) { @@ -2808,29 +2807,18 @@ function warnAboutRenderPhaseUpdatesInDEV(fiber) { break; } case ClassComponent: { - switch (ReactCurrentDebugFiberPhaseInDEV) { - case 'getChildContext': - if (didWarnAboutUpdateInGetChildContext) { - return; - } - console.error( - 'setState(...): Cannot call setState() inside getChildContext()', - ); - didWarnAboutUpdateInGetChildContext = true; - break; - case 'render': - if (didWarnAboutUpdateInRender) { - return; - } - console.error( - 'Cannot update during an existing state transition (such as ' + - 'within `render`). Render methods should be a pure ' + - 'function of props and state.', - ); - didWarnAboutUpdateInRender = true; - break; + if ( + ReactCurrentDebugFiberIsRenderingInDEV && + !didWarnAboutUpdateInRender + ) { + console.error( + 'Cannot update during an existing state transition (such as ' + + 'within `render`). Render methods should be a pure ' + + 'function of props and state.', + ); + didWarnAboutUpdateInRender = true; + break; } - break; } } } diff --git a/packages/react-reconciler/src/__tests__/ReactSuspenseWithNoopRenderer-test.internal.js b/packages/react-reconciler/src/__tests__/ReactSuspenseWithNoopRenderer-test.internal.js index 0cca771b1df22..0df7431977cf2 100644 --- a/packages/react-reconciler/src/__tests__/ReactSuspenseWithNoopRenderer-test.internal.js +++ b/packages/react-reconciler/src/__tests__/ReactSuspenseWithNoopRenderer-test.internal.js @@ -110,25 +110,6 @@ function loadModules({ } } - it('warns if the deprecated maxDuration option is used', () => { - function Foo() { - return ( - -
; - - ); - } - - ReactNoop.render(); - - expect(() => Scheduler.unstable_flushAll()).toErrorDev([ - 'Warning: maxDuration has been removed from React. ' + - 'Remove the maxDuration prop.' + - '\n in Suspense (at **)' + - '\n in Foo (at **)', - ]); - }); - it('does not restart rendering for initial render', async () => { function Bar(props) { Scheduler.unstable_yieldValue('Bar');