From 415ee0e6ea0fe3e288e65868df2e3241143d5f7f Mon Sep 17 00:00:00 2001 From: Andrew Clark Date: Thu, 18 Apr 2024 11:56:30 -0400 Subject: [PATCH] Backport legacy context deprecation warning This backports a deprecation warning for legacy context, even when Strict Mode is not enabled. I didn't bother to update all the tests because the tests are in such a different state than what's on `main`, and on `main` we already updated the tests accordingly. So instead I silenced the warnings in our test config, like we've done for other warnings in the past. --- .../src/ReactFiberClassComponent.new.js | 35 +++++++++++++++++++ .../src/ReactFiberClassComponent.old.js | 35 +++++++++++++++++++ scripts/jest/shouldIgnoreConsoleError.js | 13 +++++++ 3 files changed, 83 insertions(+) diff --git a/packages/react-reconciler/src/ReactFiberClassComponent.new.js b/packages/react-reconciler/src/ReactFiberClassComponent.new.js index 45977bfa6fee8..fe1aea87f0687 100644 --- a/packages/react-reconciler/src/ReactFiberClassComponent.new.js +++ b/packages/react-reconciler/src/ReactFiberClassComponent.new.js @@ -96,6 +96,7 @@ let warnOnInvalidCallback; let didWarnAboutDirectlyAssigningPropsToState; let didWarnAboutContextTypeAndContextTypes; let didWarnAboutInvalidateContextType; +let didWarnAboutLegacyContext; if (__DEV__) { didWarnAboutStateAssignmentForComponent = new Set(); @@ -106,6 +107,7 @@ if (__DEV__) { didWarnAboutUndefinedDerivedState = new Set(); didWarnAboutContextTypeAndContextTypes = new Set(); didWarnAboutInvalidateContextType = new Set(); + didWarnAboutLegacyContext = new Set(); const didWarnOnInvalidCallback = new Set(); @@ -435,6 +437,39 @@ function checkClassInstance(workInProgress: Fiber, ctor: any, newProps: any) { ); } } else { + if ( + ctor.childContextTypes && + !didWarnAboutLegacyContext.has(ctor) && + // Strict Mode has its own warning for legacy context, so we can skip + // this one. + (workInProgress.mode & StrictLegacyMode) === NoMode + ) { + didWarnAboutLegacyContext.add(ctor); + console.error( + '%s uses the legacy childContextTypes API which is no longer ' + + 'supported and will be removed in the next major release. Use ' + + 'React.createContext() instead\n\n.' + + 'Learn more about this warning here: https://reactjs.org/link/legacy-context', + name, + ); + } + if ( + ctor.contextTypes && + !didWarnAboutLegacyContext.has(ctor) && + // Strict Mode has its own warning for legacy context, so we can skip + // this one. + (workInProgress.mode & StrictLegacyMode) === NoMode + ) { + didWarnAboutLegacyContext.add(ctor); + console.error( + '%s uses the legacy contextTypes API which is no longer supported ' + + 'and will be removed in the next major release. Use ' + + 'React.createContext() with static contextType instead.\n\n' + + 'Learn more about this warning here: https://reactjs.org/link/legacy-context', + name, + ); + } + if (instance.contextTypes) { console.error( 'contextTypes was defined as an instance property on %s. Use a static ' + diff --git a/packages/react-reconciler/src/ReactFiberClassComponent.old.js b/packages/react-reconciler/src/ReactFiberClassComponent.old.js index a921cf2f47ba9..b4ad1602dadf5 100644 --- a/packages/react-reconciler/src/ReactFiberClassComponent.old.js +++ b/packages/react-reconciler/src/ReactFiberClassComponent.old.js @@ -96,6 +96,7 @@ let warnOnInvalidCallback; let didWarnAboutDirectlyAssigningPropsToState; let didWarnAboutContextTypeAndContextTypes; let didWarnAboutInvalidateContextType; +let didWarnAboutLegacyContext; if (__DEV__) { didWarnAboutStateAssignmentForComponent = new Set(); @@ -106,6 +107,7 @@ if (__DEV__) { didWarnAboutUndefinedDerivedState = new Set(); didWarnAboutContextTypeAndContextTypes = new Set(); didWarnAboutInvalidateContextType = new Set(); + didWarnAboutLegacyContext = new Set(); const didWarnOnInvalidCallback = new Set(); @@ -435,6 +437,39 @@ function checkClassInstance(workInProgress: Fiber, ctor: any, newProps: any) { ); } } else { + if ( + ctor.childContextTypes && + !didWarnAboutLegacyContext.has(ctor) && + // Strict Mode has its own warning for legacy context, so we can skip + // this one. + (workInProgress.mode & StrictLegacyMode) === NoMode + ) { + didWarnAboutLegacyContext.add(ctor); + console.error( + '%s uses the legacy childContextTypes API which is no longer ' + + 'supported and will be removed in the next major release. Use ' + + 'React.createContext() instead\n\n.' + + 'Learn more about this warning here: https://reactjs.org/link/legacy-context', + name, + ); + } + if ( + ctor.contextTypes && + !didWarnAboutLegacyContext.has(ctor) && + // Strict Mode has its own warning for legacy context, so we can skip + // this one. + (workInProgress.mode & StrictLegacyMode) === NoMode + ) { + didWarnAboutLegacyContext.add(ctor); + console.error( + '%s uses the legacy contextTypes API which is no longer supported ' + + 'and will be removed in the next major release. Use ' + + 'React.createContext() with static contextType instead.\n\n' + + 'Learn more about this warning here: https://reactjs.org/link/legacy-context', + name, + ); + } + if (instance.contextTypes) { console.error( 'contextTypes was defined as an instance property on %s. Use a static ' + diff --git a/scripts/jest/shouldIgnoreConsoleError.js b/scripts/jest/shouldIgnoreConsoleError.js index 02af0bfd28521..04bec92c39636 100644 --- a/scripts/jest/shouldIgnoreConsoleError.js +++ b/scripts/jest/shouldIgnoreConsoleError.js @@ -23,6 +23,19 @@ module.exports = function shouldIgnoreConsoleError(format, args) { // We haven't finished migrating our tests to use createRoot. return true; } + if ( + format.indexOf( + 'uses the legacy contextTypes API which is no longer supported and will be removed' + ) !== -1 || + format.indexOf( + 'uses the legacy childContextTypes API which is no longer supported and will be removed' + ) !== -1 + ) { + // This is a backported warning. In `main`, there's a different warning + // (and it's fully tested). Not going to bother upgrading all the tests + // on this old release branch, so let's just silence it instead. + return true; + } } } else { if (