From d068511bd28bf534529f1e1c77bdb4f5d3111a94 Mon Sep 17 00:00:00 2001 From: Jan Kassens Date: Tue, 10 Jan 2023 19:37:25 -0500 Subject: [PATCH 1/4] remove feature flag warnAboutDefaultPropsOnFunctionComponents --- packages/react-reconciler/src/ReactFiberBeginWork.js | 11 ++--------- packages/react-server/src/ReactFizzServer.js | 6 +----- packages/shared/ReactFeatureFlags.js | 5 ----- packages/shared/forks/ReactFeatureFlags.native-fb.js | 1 - packages/shared/forks/ReactFeatureFlags.native-oss.js | 1 - .../shared/forks/ReactFeatureFlags.test-renderer.js | 1 - .../forks/ReactFeatureFlags.test-renderer.native.js | 1 - .../forks/ReactFeatureFlags.test-renderer.www.js | 1 - packages/shared/forks/ReactFeatureFlags.testing.js | 1 - .../shared/forks/ReactFeatureFlags.testing.www.js | 1 - packages/shared/forks/ReactFeatureFlags.www.js | 1 - 11 files changed, 3 insertions(+), 27 deletions(-) diff --git a/packages/react-reconciler/src/ReactFiberBeginWork.js b/packages/react-reconciler/src/ReactFiberBeginWork.js index fc593516be33c..6a7c147ff3a17 100644 --- a/packages/react-reconciler/src/ReactFiberBeginWork.js +++ b/packages/react-reconciler/src/ReactFiberBeginWork.js @@ -97,7 +97,6 @@ import { disableModulePatternComponents, enableProfilerCommitHooks, enableProfilerTimer, - warnAboutDefaultPropsOnFunctionComponents, enableScopeAPI, enableCache, enableLazyContextPropagation, @@ -506,10 +505,7 @@ function updateMemoComponent( getComponentNameFromType(type), ); } - if ( - warnAboutDefaultPropsOnFunctionComponents && - Component.defaultProps !== undefined - ) { + if (Component.defaultProps !== undefined) { const componentName = getComponentNameFromType(type) || 'Unknown'; if (!didWarnAboutDefaultPropsOnFunctionComponent[componentName]) { console.error( @@ -2058,10 +2054,7 @@ function validateFunctionComponentInDev(workInProgress: Fiber, Component: any) { } } - if ( - warnAboutDefaultPropsOnFunctionComponents && - Component.defaultProps !== undefined - ) { + if (Component.defaultProps !== undefined) { const componentName = getComponentNameFromType(Component) || 'Unknown'; if (!didWarnAboutDefaultPropsOnFunctionComponent[componentName]) { diff --git a/packages/react-server/src/ReactFizzServer.js b/packages/react-server/src/ReactFizzServer.js index d0ad4ec09c4bc..281e8bf342a58 100644 --- a/packages/react-server/src/ReactFizzServer.js +++ b/packages/react-server/src/ReactFizzServer.js @@ -129,7 +129,6 @@ import ReactSharedInternals from 'shared/ReactSharedInternals'; import { disableLegacyContext, disableModulePatternComponents, - warnAboutDefaultPropsOnFunctionComponents, enableScopeAPI, enableSuspenseAvoidThisFallbackFizz, enableFloat, @@ -949,10 +948,7 @@ function validateFunctionComponentInDev(Component: any): void { } } - if ( - warnAboutDefaultPropsOnFunctionComponents && - Component.defaultProps !== undefined - ) { + if (Component.defaultProps !== undefined) { const componentName = getComponentNameFromType(Component) || 'Unknown'; if (!didWarnAboutDefaultPropsOnFunctionComponent[componentName]) { diff --git a/packages/shared/ReactFeatureFlags.js b/packages/shared/ReactFeatureFlags.js index dd01bb14e42de..22351cfb64da3 100644 --- a/packages/shared/ReactFeatureFlags.js +++ b/packages/shared/ReactFeatureFlags.js @@ -207,11 +207,6 @@ export const disableTextareaChildren = false; // New API for JSX transforms to target - https://github.com/reactjs/rfcs/pull/107 -// Part of the simplification of React.createElement so we can eventually move -// from React.createElement to React.jsx -// https://github.com/reactjs/rfcs/blob/createlement-rfc/text/0000-create-element-changes.md -export const warnAboutDefaultPropsOnFunctionComponents = true; // deprecate later, not 18.0 - // Enables a warning when trying to spread a 'key' to an element; // a deprecated pattern we want to get rid of in the future export const warnAboutSpreadingKeyToJSX = true; diff --git a/packages/shared/forks/ReactFeatureFlags.native-fb.js b/packages/shared/forks/ReactFeatureFlags.native-fb.js index 9fe2bdcfcd63a..0e1a239bcb9d9 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-fb.js +++ b/packages/shared/forks/ReactFeatureFlags.native-fb.js @@ -40,7 +40,6 @@ export const replayFailedUnitOfWorkWithInvokeGuardedCallback = __DEV__; export const enableScopeAPI = false; export const enableCreateEventHandleAPI = false; export const enableSuspenseCallback = false; -export const warnAboutDefaultPropsOnFunctionComponents = true; export const warnAboutStringRefs = true; export const disableLegacyContext = false; export const disableSchedulerTimeoutBasedOnReactExpirationTime = false; diff --git a/packages/shared/forks/ReactFeatureFlags.native-oss.js b/packages/shared/forks/ReactFeatureFlags.native-oss.js index 3d403ab509fbb..f1d0ce4ca9d9b 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-oss.js +++ b/packages/shared/forks/ReactFeatureFlags.native-oss.js @@ -30,7 +30,6 @@ export const enableSchedulerDebugging = false; export const enableScopeAPI = false; export const enableCreateEventHandleAPI = false; export const enableSuspenseCallback = false; -export const warnAboutDefaultPropsOnFunctionComponents = true; export const warnAboutStringRefs = true; export const disableLegacyContext = false; export const disableSchedulerTimeoutBasedOnReactExpirationTime = false; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.js index 907351d7102c2..2837b4767fb8d 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.js @@ -30,7 +30,6 @@ export const enableSchedulerDebugging = false; export const enableScopeAPI = false; export const enableCreateEventHandleAPI = false; export const enableSuspenseCallback = false; -export const warnAboutDefaultPropsOnFunctionComponents = true; export const warnAboutStringRefs = true; export const disableLegacyContext = false; export const disableSchedulerTimeoutBasedOnReactExpirationTime = false; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js index 34f467ab3012d..e1f8d28f21325 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js @@ -30,7 +30,6 @@ export const enableSchedulerDebugging = false; export const enableScopeAPI = false; export const enableCreateEventHandleAPI = false; export const enableSuspenseCallback = false; -export const warnAboutDefaultPropsOnFunctionComponents = true; export const warnAboutStringRefs = true; export const disableLegacyContext = false; export const disableSchedulerTimeoutBasedOnReactExpirationTime = false; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js index b7eecfaeef7a4..5d9c46b5f5acc 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js @@ -30,7 +30,6 @@ export const disableInputAttributeSyncing = false; export const enableScopeAPI = true; export const enableCreateEventHandleAPI = false; export const enableSuspenseCallback = true; -export const warnAboutDefaultPropsOnFunctionComponents = true; export const warnAboutStringRefs = true; export const disableLegacyContext = false; export const disableSchedulerTimeoutBasedOnReactExpirationTime = false; diff --git a/packages/shared/forks/ReactFeatureFlags.testing.js b/packages/shared/forks/ReactFeatureFlags.testing.js index 0f17f71b0d171..73af1b6373c36 100644 --- a/packages/shared/forks/ReactFeatureFlags.testing.js +++ b/packages/shared/forks/ReactFeatureFlags.testing.js @@ -30,7 +30,6 @@ export const enableSchedulerDebugging = false; export const enableScopeAPI = false; export const enableCreateEventHandleAPI = false; export const enableSuspenseCallback = false; -export const warnAboutDefaultPropsOnFunctionComponents = true; export const warnAboutStringRefs = true; export const disableLegacyContext = false; export const disableSchedulerTimeoutBasedOnReactExpirationTime = false; diff --git a/packages/shared/forks/ReactFeatureFlags.testing.www.js b/packages/shared/forks/ReactFeatureFlags.testing.www.js index bffb42bf78416..3052a878378dd 100644 --- a/packages/shared/forks/ReactFeatureFlags.testing.www.js +++ b/packages/shared/forks/ReactFeatureFlags.testing.www.js @@ -30,7 +30,6 @@ export const enableSchedulerDebugging = false; export const enableScopeAPI = true; export const enableCreateEventHandleAPI = true; export const enableSuspenseCallback = true; -export const warnAboutDefaultPropsOnFunctionComponents = true; export const warnAboutStringRefs = true; export const disableLegacyContext = __EXPERIMENTAL__; export const disableSchedulerTimeoutBasedOnReactExpirationTime = false; diff --git a/packages/shared/forks/ReactFeatureFlags.www.js b/packages/shared/forks/ReactFeatureFlags.www.js index 6953f09aef1d5..60aae8e878024 100644 --- a/packages/shared/forks/ReactFeatureFlags.www.js +++ b/packages/shared/forks/ReactFeatureFlags.www.js @@ -67,7 +67,6 @@ export const enableSchedulingProfiler: boolean = export const enableSchedulerDebugging = true; export const disableLegacyContext = __EXPERIMENTAL__; export const warnAboutStringRefs = true; -export const warnAboutDefaultPropsOnFunctionComponents = true; export const enableGetInspectorDataForInstanceInProduction = false; export const enableCache = true; From e0a08e12f3ee2b02aa313a614239ac79160125dd Mon Sep 17 00:00:00 2001 From: Jan Kassens Date: Tue, 10 Jan 2023 19:43:47 -0500 Subject: [PATCH 2/4] remove feature flag warnAboutStringRefs --- .../src/__tests__/ReactComponent-test.js | 27 ++---- .../ReactDOMServerIntegrationRefs-test.js | 18 ++-- packages/react-dom/src/__tests__/refs-test.js | 92 ++++++++----------- .../react-reconciler/src/ReactChildFiber.js | 33 ++----- .../ReactIncrementalSideEffects-test.js | 18 ++-- .../ReactCoffeeScriptClass-test.coffee | 18 ++-- .../react/src/__tests__/ReactES6Class-test.js | 18 ++-- .../src/__tests__/ReactStrictMode-test.js | 37 +++----- .../__tests__/ReactTypeScriptClass-test.ts | 18 ++-- packages/shared/ReactFeatureFlags.js | 2 - .../forks/ReactFeatureFlags.native-fb.js | 1 - .../forks/ReactFeatureFlags.native-oss.js | 1 - .../forks/ReactFeatureFlags.test-renderer.js | 1 - .../ReactFeatureFlags.test-renderer.native.js | 1 - .../ReactFeatureFlags.test-renderer.www.js | 1 - .../shared/forks/ReactFeatureFlags.testing.js | 1 - .../forks/ReactFeatureFlags.testing.www.js | 1 - .../shared/forks/ReactFeatureFlags.www.js | 1 - 18 files changed, 103 insertions(+), 186 deletions(-) diff --git a/packages/react-dom/src/__tests__/ReactComponent-test.js b/packages/react-dom/src/__tests__/ReactComponent-test.js index 4df1b8dfc1e17..4ac98e0b5a5ab 100644 --- a/packages/react-dom/src/__tests__/ReactComponent-test.js +++ b/packages/react-dom/src/__tests__/ReactComponent-test.js @@ -137,24 +137,15 @@ describe('ReactComponent', () => { expect(() => { ReactTestUtils.renderIntoDocument(); - }).toErrorDev( - ReactFeatureFlags.warnAboutStringRefs - ? [ - 'Warning: Component "div" contains the string ref "inner". ' + - 'Support for string refs will be removed in a future major release. ' + - 'We recommend using useRef() or createRef() instead. ' + - 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + - ' in div (at **)\n' + - ' in Wrapper (at **)\n' + - ' in Component (at **)', - 'Warning: Component "Component" contains the string ref "outer". ' + - 'Support for string refs will be removed in a future major release. ' + - 'We recommend using useRef() or createRef() instead. ' + - 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + - ' in Component (at **)', - ] - : [], - ); + }).toErrorDev([ + 'Warning: Component "div" contains the string ref "inner". ' + + 'Support for string refs will be removed in a future major release. ' + + 'We recommend using useRef() or createRef() instead. ' + + 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + + ' in div (at **)\n' + + ' in Wrapper (at **)\n' + + ' in Component (at **)', + ]); }); it('should not have string refs on unmounted components', () => { diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationRefs-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationRefs-test.js index 041dc9ebe7683..bb73ddfc06d78 100644 --- a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationRefs-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationRefs-test.js @@ -99,17 +99,13 @@ describe('ReactDOMServerIntegration', () => { root, true, ); - }).toErrorDev( - ReactFeatureFlags.warnAboutStringRefs - ? [ - 'Warning: Component "RefsComponent" contains the string ref "myDiv". ' + - 'Support for string refs will be removed in a future major release. ' + - 'We recommend using useRef() or createRef() instead. ' + - 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + - ' in RefsComponent (at **)', - ] - : [], - ); + }).toErrorDev([ + 'Warning: Component "RefsComponent" contains the string ref "myDiv". ' + + 'Support for string refs will be removed in a future major release. ' + + 'We recommend using useRef() or createRef() instead. ' + + 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + + ' in RefsComponent (at **)', + ]); expect(component.refs.myDiv).toBe(root.firstChild); }); }); diff --git a/packages/react-dom/src/__tests__/refs-test.js b/packages/react-dom/src/__tests__/refs-test.js index 363005f06658c..a8af8cfd66e84 100644 --- a/packages/react-dom/src/__tests__/refs-test.js +++ b/packages/react-dom/src/__tests__/refs-test.js @@ -123,28 +123,24 @@ describe('reactiverefs', () => { let testRefsComponent; expect(() => { testRefsComponent = ReactDOM.render(, container); - }).toErrorDev( - ReactFeatureFlags.warnAboutStringRefs - ? [ - 'Warning: Component "div" contains the string ref "resetDiv". ' + - 'Support for string refs will be removed in a future major release. ' + - 'We recommend using useRef() or createRef() instead. ' + - 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + - ' in div (at **)\n' + - ' in TestRefsComponent (at **)', - 'Warning: Component "span" contains the string ref "clickLog0". ' + - 'Support for string refs will be removed in a future major release. ' + - 'We recommend using useRef() or createRef() instead. ' + - 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + - ' in span (at **)\n' + - ' in ClickCounter (at **)\n' + - ' in div (at **)\n' + - ' in GeneralContainerComponent (at **)\n' + - ' in div (at **)\n' + - ' in TestRefsComponent (at **)', - ] - : [], - ); + }).toErrorDev([ + 'Warning: Component "div" contains the string ref "resetDiv". ' + + 'Support for string refs will be removed in a future major release. ' + + 'We recommend using useRef() or createRef() instead. ' + + 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + + ' in div (at **)\n' + + ' in TestRefsComponent (at **)', + 'Warning: Component "span" contains the string ref "clickLog0". ' + + 'Support for string refs will be removed in a future major release. ' + + 'We recommend using useRef() or createRef() instead. ' + + 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + + ' in span (at **)\n' + + ' in ClickCounter (at **)\n' + + ' in div (at **)\n' + + ' in GeneralContainerComponent (at **)\n' + + ' in div (at **)\n' + + ' in TestRefsComponent (at **)', + ]); expect(testRefsComponent instanceof TestRefsComponent).toBe(true); @@ -349,17 +345,13 @@ describe('ref swapping', () => { let a; expect(() => { a = ReactTestUtils.renderIntoDocument(); - }).toErrorDev( - ReactFeatureFlags.warnAboutStringRefs - ? [ - 'Warning: Component "A" contains the string ref "1". ' + - 'Support for string refs will be removed in a future major release. ' + - 'We recommend using useRef() or createRef() instead. ' + - 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + - ' in A (at **)', - ] - : [], - ); + }).toErrorDev([ + 'Warning: Component "A" contains the string ref "1". ' + + 'Support for string refs will be removed in a future major release. ' + + 'We recommend using useRef() or createRef() instead. ' + + 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + + ' in A (at **)', + ]); expect(a.refs[1].nodeName).toBe('DIV'); }); @@ -546,18 +538,14 @@ describe('strings refs across renderers', () => { let inst; expect(() => { inst = ReactDOM.render(, div1); - }).toErrorDev( - ReactFeatureFlags.warnAboutStringRefs - ? [ - 'Warning: Component "Indirection" contains the string ref "child1". ' + - 'Support for string refs will be removed in a future major release. ' + - 'We recommend using useRef() or createRef() instead. ' + - 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + - ' in Indirection (at **)\n' + - ' in Parent (at **)', - ] - : [], - ); + }).toErrorDev([ + 'Warning: Component "Indirection" contains the string ref "child1". ' + + 'Support for string refs will be removed in a future major release. ' + + 'We recommend using useRef() or createRef() instead. ' + + 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + + ' in Indirection (at **)\n' + + ' in Parent (at **)', + ]); // Only the first ref has rendered yet. expect(inst.refs.child1.tagName).toBe('DIV'); @@ -567,14 +555,12 @@ describe('strings refs across renderers', () => { // Now both refs should be rendered. ReactDOM.render(, div1); }).toErrorDev( - ReactFeatureFlags.warnAboutStringRefs - ? [ - 'Warning: Component "Root" contains the string ref "child2". ' + - 'Support for string refs will be removed in a future major release. ' + - 'We recommend using useRef() or createRef() instead. ' + - 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref', - ] - : [], + [ + 'Warning: Component "Root" contains the string ref "child2". ' + + 'Support for string refs will be removed in a future major release. ' + + 'We recommend using useRef() or createRef() instead. ' + + 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref', + ], {withoutStack: true}, ); expect(inst.refs.child1.tagName).toBe('DIV'); diff --git a/packages/react-reconciler/src/ReactChildFiber.js b/packages/react-reconciler/src/ReactChildFiber.js index 6d9c6e83f9a6e..593af0d8d944d 100644 --- a/packages/react-reconciler/src/ReactChildFiber.js +++ b/packages/react-reconciler/src/ReactChildFiber.js @@ -28,7 +28,6 @@ import { } from 'shared/ReactSymbols'; import {ClassComponent, HostText, HostPortal, Fragment} from './ReactWorkTags'; import isArray from 'shared/isArray'; -import {warnAboutStringRefs} from 'shared/ReactFeatureFlags'; import {checkPropStringCoercion} from 'shared/CheckStringCoercion'; import { @@ -113,10 +112,7 @@ function coerceRef( typeof mixedRef !== 'object' ) { if (__DEV__) { - // TODO: Clean this up once we turn on the string ref warning for - // everyone, because the strict mode case will no longer be relevant if ( - (returnFiber.mode & StrictLegacyMode || warnAboutStringRefs) && // We warn in ReactElement.js if owner and self are equal for string refs // because these cannot be automatically converted to an arrow function // using a codemod. Therefore, we don't have to warn about string refs again. @@ -138,26 +134,15 @@ function coerceRef( const componentName = getComponentNameFromFiber(returnFiber) || 'Component'; if (!didWarnAboutStringRefs[componentName]) { - if (warnAboutStringRefs) { - console.error( - 'Component "%s" contains the string ref "%s". Support for string refs ' + - 'will be removed in a future major release. We recommend using ' + - 'useRef() or createRef() instead. ' + - 'Learn more about using refs safely here: ' + - 'https://reactjs.org/link/strict-mode-string-ref', - componentName, - mixedRef, - ); - } else { - console.error( - 'A string ref, "%s", has been found within a strict mode tree. ' + - 'String refs are a source of potential bugs and should be avoided. ' + - 'We recommend using useRef() or createRef() instead. ' + - 'Learn more about using refs safely here: ' + - 'https://reactjs.org/link/strict-mode-string-ref', - mixedRef, - ); - } + console.error( + 'Component "%s" contains the string ref "%s". Support for string refs ' + + 'will be removed in a future major release. We recommend using ' + + 'useRef() or createRef() instead. ' + + 'Learn more about using refs safely here: ' + + 'https://reactjs.org/link/strict-mode-string-ref', + componentName, + mixedRef, + ); didWarnAboutStringRefs[componentName] = true; } } diff --git a/packages/react-reconciler/src/__tests__/ReactIncrementalSideEffects-test.js b/packages/react-reconciler/src/__tests__/ReactIncrementalSideEffects-test.js index 6bac75ab30f48..679148e9bd4d6 100644 --- a/packages/react-reconciler/src/__tests__/ReactIncrementalSideEffects-test.js +++ b/packages/react-reconciler/src/__tests__/ReactIncrementalSideEffects-test.js @@ -1310,17 +1310,13 @@ describe('ReactIncrementalSideEffects', () => { ReactNoop.render(); expect(() => { expect(Scheduler).toFlushWithoutYielding(); - }).toErrorDev( - ReactFeatureFlags.warnAboutStringRefs - ? [ - 'Warning: Component "Foo" contains the string ref "bar". ' + - 'Support for string refs will be removed in a future major release. ' + - 'We recommend using useRef() or createRef() instead. ' + - 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + - ' in Foo (at **)', - ] - : [], - ); + }).toErrorDev([ + 'Warning: Component "Foo" contains the string ref "bar". ' + + 'Support for string refs will be removed in a future major release. ' + + 'We recommend using useRef() or createRef() instead. ' + + 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + + ' in Foo (at **)', + ]); expect(fooInstance.refs.bar.test).toEqual('test'); }); }); diff --git a/packages/react/src/__tests__/ReactCoffeeScriptClass-test.coffee b/packages/react/src/__tests__/ReactCoffeeScriptClass-test.coffee index 0fd7e0b1e2222..1603bf7576b6f 100644 --- a/packages/react/src/__tests__/ReactCoffeeScriptClass-test.coffee +++ b/packages/react/src/__tests__/ReactCoffeeScriptClass-test.coffee @@ -545,17 +545,13 @@ describe 'ReactCoffeeScriptClass', -> ref = React.createRef() expect(-> test(React.createElement(Foo, ref: ref), 'DIV', 'foo') - ).toErrorDev( - if ReactFeatureFlags.warnAboutStringRefs - then [ - 'Warning: Component "Foo" contains the string ref "inner". ' + - 'Support for string refs will be removed in a future major release. ' + - 'We recommend using useRef() or createRef() instead. ' + - 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + - ' in Foo (at **)' - ] - else [] - ); + ).toErrorDev([ + 'Warning: Component "Foo" contains the string ref "inner". ' + + 'Support for string refs will be removed in a future major release. ' + + 'We recommend using useRef() or createRef() instead. ' + + 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + + ' in Foo (at **)' + ]); expect(ref.current.refs.inner.getName()).toBe 'foo' it 'supports drilling through to the DOM using findDOMNode', -> diff --git a/packages/react/src/__tests__/ReactES6Class-test.js b/packages/react/src/__tests__/ReactES6Class-test.js index 6c23038205ed7..f3891dffa3eac 100644 --- a/packages/react/src/__tests__/ReactES6Class-test.js +++ b/packages/react/src/__tests__/ReactES6Class-test.js @@ -587,17 +587,13 @@ describe('ReactES6Class', () => { const ref = React.createRef(); expect(() => { test(, 'DIV', 'foo'); - }).toErrorDev( - ReactFeatureFlags.warnAboutStringRefs - ? [ - 'Warning: Component "Foo" contains the string ref "inner". ' + - 'Support for string refs will be removed in a future major release. ' + - 'We recommend using useRef() or createRef() instead. ' + - 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + - ' in Foo (at **)', - ] - : [], - ); + }).toErrorDev([ + 'Warning: Component "Foo" contains the string ref "inner". ' + + 'Support for string refs will be removed in a future major release. ' + + 'We recommend using useRef() or createRef() instead. ' + + 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + + ' in Foo (at **)', + ]); expect(ref.current.refs.inner.getName()).toBe('foo'); }); diff --git a/packages/react/src/__tests__/ReactStrictMode-test.js b/packages/react/src/__tests__/ReactStrictMode-test.js index b41497ae3ab72..e3553e6154464 100644 --- a/packages/react/src/__tests__/ReactStrictMode-test.js +++ b/packages/react/src/__tests__/ReactStrictMode-test.js @@ -926,18 +926,11 @@ describe('string refs', () => { expect(() => { ReactDOM.render(, container); }).toErrorDev( - ReactFeatureFlags.warnAboutStringRefs - ? 'Warning: Component "StrictMode" contains the string ref "somestring". ' + - 'Support for string refs will be removed in a future major release. ' + - 'We recommend using useRef() or createRef() instead. ' + - 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + - ' in OuterComponent (at **)' - : 'Warning: A string ref, "somestring", has been found within a strict mode tree. ' + - 'String refs are a source of potential bugs and should be avoided. ' + - 'We recommend using useRef() or createRef() instead. ' + - 'Learn more about using refs safely here: ' + - 'https://reactjs.org/link/strict-mode-string-ref\n' + - ' in OuterComponent (at **)', + 'Warning: Component "StrictMode" contains the string ref "somestring". ' + + 'Support for string refs will be removed in a future major release. ' + + 'We recommend using useRef() or createRef() instead. ' + + 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + + ' in OuterComponent (at **)', ); // Dedup @@ -973,20 +966,12 @@ describe('string refs', () => { expect(() => { ReactDOM.render(, container); }).toErrorDev( - ReactFeatureFlags.warnAboutStringRefs - ? 'Warning: Component "InnerComponent" contains the string ref "somestring". ' + - 'Support for string refs will be removed in a future major release. ' + - 'We recommend using useRef() or createRef() instead. ' + - 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + - ' in InnerComponent (at **)\n' + - ' in OuterComponent (at **)' - : 'Warning: A string ref, "somestring", has been found within a strict mode tree. ' + - 'String refs are a source of potential bugs and should be avoided. ' + - 'We recommend using useRef() or createRef() instead. ' + - 'Learn more about using refs safely here: ' + - 'https://reactjs.org/link/strict-mode-string-ref\n' + - ' in InnerComponent (at **)\n' + - ' in OuterComponent (at **)', + 'Warning: Component "InnerComponent" contains the string ref "somestring". ' + + 'Support for string refs will be removed in a future major release. ' + + 'We recommend using useRef() or createRef() instead. ' + + 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + + ' in InnerComponent (at **)\n' + + ' in OuterComponent (at **)', ); // Dedup diff --git a/packages/react/src/__tests__/ReactTypeScriptClass-test.ts b/packages/react/src/__tests__/ReactTypeScriptClass-test.ts index 39304e9d6f2af..14111a6f05088 100644 --- a/packages/react/src/__tests__/ReactTypeScriptClass-test.ts +++ b/packages/react/src/__tests__/ReactTypeScriptClass-test.ts @@ -691,17 +691,13 @@ describe('ReactTypeScriptClass', function() { const ref = React.createRef(); expect(() => { test(React.createElement(ClassicRefs, {ref: ref}), 'DIV', 'foo'); - }).toErrorDev( - ReactFeatureFlags.warnAboutStringRefs - ? [ - 'Warning: Component "ClassicRefs" contains the string ref "inner". ' + - 'Support for string refs will be removed in a future major release. ' + - 'We recommend using useRef() or createRef() instead. ' + - 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + - ' in ClassicRefs (at **)', - ] - : [], - ); + }).toErrorDev([ + 'Warning: Component "ClassicRefs" contains the string ref "inner". ' + + 'Support for string refs will be removed in a future major release. ' + + 'We recommend using useRef() or createRef() instead. ' + + 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + + ' in ClassicRefs (at **)', + ]); expect(ref.current.refs.inner.getName()).toBe('foo'); }); diff --git a/packages/shared/ReactFeatureFlags.js b/packages/shared/ReactFeatureFlags.js index 22351cfb64da3..18f38d3aa81e7 100644 --- a/packages/shared/ReactFeatureFlags.js +++ b/packages/shared/ReactFeatureFlags.js @@ -211,8 +211,6 @@ export const disableTextareaChildren = false; // a deprecated pattern we want to get rid of in the future export const warnAboutSpreadingKeyToJSX = true; -export const warnAboutStringRefs = true; - // ----------------------------------------------------------------------------- // Debugging and DevTools // ----------------------------------------------------------------------------- diff --git a/packages/shared/forks/ReactFeatureFlags.native-fb.js b/packages/shared/forks/ReactFeatureFlags.native-fb.js index 0e1a239bcb9d9..056672c914057 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-fb.js +++ b/packages/shared/forks/ReactFeatureFlags.native-fb.js @@ -40,7 +40,6 @@ export const replayFailedUnitOfWorkWithInvokeGuardedCallback = __DEV__; export const enableScopeAPI = false; export const enableCreateEventHandleAPI = false; export const enableSuspenseCallback = false; -export const warnAboutStringRefs = true; export const disableLegacyContext = false; export const disableSchedulerTimeoutBasedOnReactExpirationTime = false; export const enableTrustedTypesIntegration = false; diff --git a/packages/shared/forks/ReactFeatureFlags.native-oss.js b/packages/shared/forks/ReactFeatureFlags.native-oss.js index f1d0ce4ca9d9b..97723bdc9d765 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-oss.js +++ b/packages/shared/forks/ReactFeatureFlags.native-oss.js @@ -30,7 +30,6 @@ export const enableSchedulerDebugging = false; export const enableScopeAPI = false; export const enableCreateEventHandleAPI = false; export const enableSuspenseCallback = false; -export const warnAboutStringRefs = true; export const disableLegacyContext = false; export const disableSchedulerTimeoutBasedOnReactExpirationTime = false; export const enableTrustedTypesIntegration = false; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.js index 2837b4767fb8d..8941aa4b39d60 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.js @@ -30,7 +30,6 @@ export const enableSchedulerDebugging = false; export const enableScopeAPI = false; export const enableCreateEventHandleAPI = false; export const enableSuspenseCallback = false; -export const warnAboutStringRefs = true; export const disableLegacyContext = false; export const disableSchedulerTimeoutBasedOnReactExpirationTime = false; export const enableTrustedTypesIntegration = false; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js index e1f8d28f21325..faa6aa3ebf760 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.native.js @@ -30,7 +30,6 @@ export const enableSchedulerDebugging = false; export const enableScopeAPI = false; export const enableCreateEventHandleAPI = false; export const enableSuspenseCallback = false; -export const warnAboutStringRefs = true; export const disableLegacyContext = false; export const disableSchedulerTimeoutBasedOnReactExpirationTime = false; export const enableTrustedTypesIntegration = false; diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js index 5d9c46b5f5acc..9d97f6cba6a06 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js @@ -30,7 +30,6 @@ export const disableInputAttributeSyncing = false; export const enableScopeAPI = true; export const enableCreateEventHandleAPI = false; export const enableSuspenseCallback = true; -export const warnAboutStringRefs = true; export const disableLegacyContext = false; export const disableSchedulerTimeoutBasedOnReactExpirationTime = false; export const enableTrustedTypesIntegration = false; diff --git a/packages/shared/forks/ReactFeatureFlags.testing.js b/packages/shared/forks/ReactFeatureFlags.testing.js index 73af1b6373c36..bf00a167693ce 100644 --- a/packages/shared/forks/ReactFeatureFlags.testing.js +++ b/packages/shared/forks/ReactFeatureFlags.testing.js @@ -30,7 +30,6 @@ export const enableSchedulerDebugging = false; export const enableScopeAPI = false; export const enableCreateEventHandleAPI = false; export const enableSuspenseCallback = false; -export const warnAboutStringRefs = true; export const disableLegacyContext = false; export const disableSchedulerTimeoutBasedOnReactExpirationTime = false; export const enableTrustedTypesIntegration = false; diff --git a/packages/shared/forks/ReactFeatureFlags.testing.www.js b/packages/shared/forks/ReactFeatureFlags.testing.www.js index 3052a878378dd..727d2b0770825 100644 --- a/packages/shared/forks/ReactFeatureFlags.testing.www.js +++ b/packages/shared/forks/ReactFeatureFlags.testing.www.js @@ -30,7 +30,6 @@ export const enableSchedulerDebugging = false; export const enableScopeAPI = true; export const enableCreateEventHandleAPI = true; export const enableSuspenseCallback = true; -export const warnAboutStringRefs = true; export const disableLegacyContext = __EXPERIMENTAL__; export const disableSchedulerTimeoutBasedOnReactExpirationTime = false; export const enableTrustedTypesIntegration = false; diff --git a/packages/shared/forks/ReactFeatureFlags.www.js b/packages/shared/forks/ReactFeatureFlags.www.js index 60aae8e878024..928429d8bd351 100644 --- a/packages/shared/forks/ReactFeatureFlags.www.js +++ b/packages/shared/forks/ReactFeatureFlags.www.js @@ -66,7 +66,6 @@ export const enableSchedulingProfiler: boolean = // At least this will let us stop shipping implementation to all users. export const enableSchedulerDebugging = true; export const disableLegacyContext = __EXPERIMENTAL__; -export const warnAboutStringRefs = true; export const enableGetInspectorDataForInstanceInProduction = false; export const enableCache = true; From 2f271498423cc1dc95b68f98735e2d317df3107d Mon Sep 17 00:00:00 2001 From: Jan Kassens Date: Tue, 10 Jan 2023 19:47:26 -0500 Subject: [PATCH 3/4] lint fixes --- packages/react-dom/src/__tests__/ReactComponent-test.js | 2 -- .../src/__tests__/ReactDOMServerIntegrationRefs-test.js | 2 -- packages/react-reconciler/src/ReactChildFiber.js | 1 - .../src/__tests__/ReactIncrementalSideEffects-test.js | 2 -- packages/react/src/__tests__/ReactCoffeeScriptClass-test.coffee | 2 -- packages/react/src/__tests__/ReactES6Class-test.js | 2 -- packages/react/src/__tests__/ReactTypeScriptClass-test.ts | 1 - 7 files changed, 12 deletions(-) diff --git a/packages/react-dom/src/__tests__/ReactComponent-test.js b/packages/react-dom/src/__tests__/ReactComponent-test.js index 4ac98e0b5a5ab..49bf374105afa 100644 --- a/packages/react-dom/src/__tests__/ReactComponent-test.js +++ b/packages/react-dom/src/__tests__/ReactComponent-test.js @@ -12,7 +12,6 @@ let React; let ReactDOM; let ReactDOMServer; -let ReactFeatureFlags; let ReactTestUtils; describe('ReactComponent', () => { @@ -22,7 +21,6 @@ describe('ReactComponent', () => { React = require('react'); ReactDOM = require('react-dom'); ReactDOMServer = require('react-dom/server'); - ReactFeatureFlags = require('shared/ReactFeatureFlags'); ReactTestUtils = require('react-dom/test-utils'); }); diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationRefs-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationRefs-test.js index bb73ddfc06d78..9dc12c71f2f66 100644 --- a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationRefs-test.js +++ b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationRefs-test.js @@ -14,7 +14,6 @@ const ReactDOMServerIntegrationUtils = require('./utils/ReactDOMServerIntegratio let React; let ReactDOM; let ReactDOMServer; -let ReactFeatureFlags; let ReactTestUtils; function initModules() { @@ -23,7 +22,6 @@ function initModules() { React = require('react'); ReactDOM = require('react-dom'); ReactDOMServer = require('react-dom/server'); - ReactFeatureFlags = require('shared/ReactFeatureFlags'); ReactTestUtils = require('react-dom/test-utils'); // Make them available to the helpers. diff --git a/packages/react-reconciler/src/ReactChildFiber.js b/packages/react-reconciler/src/ReactChildFiber.js index 593af0d8d944d..71362afb8a540 100644 --- a/packages/react-reconciler/src/ReactChildFiber.js +++ b/packages/react-reconciler/src/ReactChildFiber.js @@ -39,7 +39,6 @@ import { createFiberFromPortal, } from './ReactFiber'; import {isCompatibleFamilyForHotReloading} from './ReactFiberHotReloading'; -import {StrictLegacyMode} from './ReactTypeOfMode'; import {getIsHydrating} from './ReactFiberHydrationContext'; import {pushTreeFork} from './ReactFiberTreeContext'; diff --git a/packages/react-reconciler/src/__tests__/ReactIncrementalSideEffects-test.js b/packages/react-reconciler/src/__tests__/ReactIncrementalSideEffects-test.js index 679148e9bd4d6..1203c9494cc01 100644 --- a/packages/react-reconciler/src/__tests__/ReactIncrementalSideEffects-test.js +++ b/packages/react-reconciler/src/__tests__/ReactIncrementalSideEffects-test.js @@ -11,7 +11,6 @@ 'use strict'; let React; -let ReactFeatureFlags; let ReactNoop; let Scheduler; @@ -20,7 +19,6 @@ describe('ReactIncrementalSideEffects', () => { jest.resetModules(); React = require('react'); - ReactFeatureFlags = require('shared/ReactFeatureFlags'); ReactNoop = require('react-noop-renderer'); Scheduler = require('scheduler'); }); diff --git a/packages/react/src/__tests__/ReactCoffeeScriptClass-test.coffee b/packages/react/src/__tests__/ReactCoffeeScriptClass-test.coffee index 1603bf7576b6f..5bd9b24d52277 100644 --- a/packages/react/src/__tests__/ReactCoffeeScriptClass-test.coffee +++ b/packages/react/src/__tests__/ReactCoffeeScriptClass-test.coffee @@ -9,7 +9,6 @@ PropTypes = null React = null ReactDOM = null ReactDOMClient = null -ReactFeatureFlags = null act = null describe 'ReactCoffeeScriptClass', -> @@ -23,7 +22,6 @@ describe 'ReactCoffeeScriptClass', -> React = require 'react' ReactDOM = require 'react-dom' ReactDOMClient = require 'react-dom/client' - ReactFeatureFlags = require 'shared/ReactFeatureFlags' act = require('jest-react').act PropTypes = require 'prop-types' container = document.createElement 'div' diff --git a/packages/react/src/__tests__/ReactES6Class-test.js b/packages/react/src/__tests__/ReactES6Class-test.js index f3891dffa3eac..6ccf7ce4c6a63 100644 --- a/packages/react/src/__tests__/ReactES6Class-test.js +++ b/packages/react/src/__tests__/ReactES6Class-test.js @@ -13,7 +13,6 @@ let PropTypes; let React; let ReactDOM; let ReactDOMClient; -let ReactFeatureFlags; let act; describe('ReactES6Class', () => { @@ -32,7 +31,6 @@ describe('ReactES6Class', () => { React = require('react'); ReactDOM = require('react-dom'); ReactDOMClient = require('react-dom/client'); - ReactFeatureFlags = require('shared/ReactFeatureFlags'); act = require('jest-react').act; container = document.createElement('div'); root = ReactDOMClient.createRoot(container); diff --git a/packages/react/src/__tests__/ReactTypeScriptClass-test.ts b/packages/react/src/__tests__/ReactTypeScriptClass-test.ts index 14111a6f05088..dfea3cea47b3f 100644 --- a/packages/react/src/__tests__/ReactTypeScriptClass-test.ts +++ b/packages/react/src/__tests__/ReactTypeScriptClass-test.ts @@ -17,7 +17,6 @@ import ReactDOMClient = require('react-dom/client'); import ReactDOMTestUtils = require('react-dom/test-utils'); import PropTypes = require('prop-types'); import internalAct = require('jest-react'); -import ReactFeatureFlags = require('shared/ReactFeatureFlags') // Before Each From 352d5be11693551c32f0b08223eac82e66284bae Mon Sep 17 00:00:00 2001 From: Jan Kassens Date: Tue, 10 Jan 2023 19:50:38 -0500 Subject: [PATCH 4/4] test fix --- packages/react-dom/src/__tests__/ReactComponent-test.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/packages/react-dom/src/__tests__/ReactComponent-test.js b/packages/react-dom/src/__tests__/ReactComponent-test.js index 49bf374105afa..1c95f08862edb 100644 --- a/packages/react-dom/src/__tests__/ReactComponent-test.js +++ b/packages/react-dom/src/__tests__/ReactComponent-test.js @@ -143,6 +143,11 @@ describe('ReactComponent', () => { ' in div (at **)\n' + ' in Wrapper (at **)\n' + ' in Component (at **)', + 'Warning: Component "Component" contains the string ref "outer". ' + + 'Support for string refs will be removed in a future major release. ' + + 'We recommend using useRef() or createRef() instead. ' + + 'Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref\n' + + ' in Component (at **)', ]); });