From a3c27330d9dd9404266c72eaf4ef4b5a47e823d7 Mon Sep 17 00:00:00 2001 From: Dan Abramov Date: Wed, 14 Feb 2024 15:50:12 +0000 Subject: [PATCH] Remove propTypes checks for legacy context --- .../react-reconciler/src/ReactFiberContext.js | 10 -- .../__tests__/ReactContextValidator-test.js | 154 ------------------ .../ReactJSXElementValidator-test.js | 9 +- 3 files changed, 2 insertions(+), 171 deletions(-) diff --git a/packages/react-reconciler/src/ReactFiberContext.js b/packages/react-reconciler/src/ReactFiberContext.js index ea8fdfd67f7ff..93e9eec922f73 100644 --- a/packages/react-reconciler/src/ReactFiberContext.js +++ b/packages/react-reconciler/src/ReactFiberContext.js @@ -14,7 +14,6 @@ import {isFiberMounted} from './ReactFiberTreeReflection'; import {disableLegacyContext} from 'shared/ReactFeatureFlags'; import {ClassComponent, HostRoot} from './ReactWorkTags'; import getComponentNameFromFiber from 'react-reconciler/src/getComponentNameFromFiber'; -import checkPropTypes from 'shared/checkPropTypes'; import {createCursor, push, pop} from './ReactFiberStack'; @@ -101,11 +100,6 @@ function getMaskedContext( context[key] = unmaskedContext[key]; } - if (__DEV__) { - const name = getComponentNameFromFiber(workInProgress) || 'Unknown'; - checkPropTypes(contextTypes, context, 'context', name); - } - // Cache unmasked context so we can avoid recreating masked context unless necessary. // Context is created before the class component is instantiated so check for instance. if (instance) { @@ -212,10 +206,6 @@ function processChildContext( ); } } - if (__DEV__) { - const name = getComponentNameFromFiber(fiber) || 'Unknown'; - checkPropTypes(childContextTypes, childContext, 'child context', name); - } return {...parentContext, ...childContext}; } diff --git a/packages/react/src/__tests__/ReactContextValidator-test.js b/packages/react/src/__tests__/ReactContextValidator-test.js index c2c97e0c87a9d..f8edacb25a306 100644 --- a/packages/react/src/__tests__/ReactContextValidator-test.js +++ b/packages/react/src/__tests__/ReactContextValidator-test.js @@ -18,7 +18,6 @@ let PropTypes; let React; let ReactDOMClient; -let ReactDOMServer; let ReactTestUtils; let act; @@ -29,7 +28,6 @@ describe('ReactContextValidator', () => { PropTypes = require('prop-types'); React = require('react'); ReactDOMClient = require('react-dom/client'); - ReactDOMServer = require('react-dom/server'); ReactTestUtils = require('react-dom/test-utils'); act = require('internal-test-utils').act; }); @@ -159,136 +157,6 @@ describe('ReactContextValidator', () => { expect(componentDidUpdateContext).toEqual({foo: 'def'}); }); - // @gate !disableLegacyContext || !__DEV__ - it('should check context types', () => { - class Component extends React.Component { - render() { - return
; - } - } - Component.contextTypes = { - foo: PropTypes.string.isRequired, - }; - - expect(() => ReactTestUtils.renderIntoDocument()).toErrorDev( - 'Warning: Failed context type: ' + - 'The context `foo` is marked as required in `Component`, but its value ' + - 'is `undefined`.\n' + - ' in Component (at **)', - ); - - class ComponentInFooStringContext extends React.Component { - getChildContext() { - return { - foo: this.props.fooValue, - }; - } - - render() { - return ; - } - } - ComponentInFooStringContext.childContextTypes = { - foo: PropTypes.string, - }; - - // No additional errors expected - ReactTestUtils.renderIntoDocument( - , - ); - - class ComponentInFooNumberContext extends React.Component { - getChildContext() { - return { - foo: this.props.fooValue, - }; - } - - render() { - return ; - } - } - ComponentInFooNumberContext.childContextTypes = { - foo: PropTypes.number, - }; - - expect(() => - ReactTestUtils.renderIntoDocument( - , - ), - ).toErrorDev( - 'Warning: Failed context type: ' + - 'Invalid context `foo` of type `number` supplied ' + - 'to `Component`, expected `string`.\n' + - ' in Component (at **)\n' + - ' in ComponentInFooNumberContext (at **)', - ); - }); - - // @gate !disableLegacyContext || !__DEV__ - it('should check child context types', () => { - class Component extends React.Component { - getChildContext() { - return this.props.testContext; - } - - render() { - return
; - } - } - Component.childContextTypes = { - foo: PropTypes.string.isRequired, - bar: PropTypes.number, - }; - - expect(() => - ReactTestUtils.renderIntoDocument(), - ).toErrorDev( - 'Warning: Failed child context type: ' + - 'The child context `foo` is marked as required in `Component`, but its ' + - 'value is `undefined`.\n' + - ' in Component (at **)', - ); - - expect(() => - ReactTestUtils.renderIntoDocument(), - ).toErrorDev( - 'Warning: Failed child context type: ' + - 'Invalid child context `foo` of type `number` ' + - 'supplied to `Component`, expected `string`.\n' + - ' in Component (at **)', - ); - - // No additional errors expected - ReactTestUtils.renderIntoDocument( - , - ); - - ReactTestUtils.renderIntoDocument(); - }); - - it('warns of incorrect prop types on context provider', () => { - const TestContext = React.createContext(); - - TestContext.Provider.propTypes = { - value: PropTypes.string.isRequired, - }; - - ReactTestUtils.renderIntoDocument(); - - class Component extends React.Component { - render() { - return ; - } - } - - expect(() => ReactTestUtils.renderIntoDocument()).toErrorDev( - 'Warning: Failed prop type: The prop `value` is marked as required in ' + - '`Context.Provider`, but its value is `undefined`.\n' + - ' in Component (at **)', - ); - }); - // TODO (bvaughn) Remove this test and the associated behavior in the future. // It has only been added in Fiber to match the (unintentional) behavior in Stack. // @gate !disableLegacyContext || !__DEV__ @@ -371,8 +239,6 @@ describe('ReactContextValidator', () => { 'Warning: MiddleMissingContext.childContextTypes is specified but there is no ' + 'getChildContext() method on the instance. You can either define getChildContext() ' + 'on MiddleMissingContext or remove childContextTypes from it.', - 'Warning: Failed context type: The context `bar` is marked as required ' + - 'in `ChildContextConsumer`, but its value is `undefined`.', ]); expect(childContext.bar).toBeUndefined(); expect(childContext.foo).toBe('FOO'); @@ -699,24 +565,4 @@ describe('ReactContextValidator', () => { 'Warning: ComponentB: Function components do not support contextType.', ); }); - - it('should honor a displayName if set on the context type', () => { - const Context = React.createContext(null); - Context.displayName = 'MyContextType'; - function Validator() { - return null; - } - Validator.propTypes = {dontPassToSeeErrorStack: PropTypes.bool.isRequired}; - - expect(() => { - ReactDOMServer.renderToStaticMarkup( - - {() => } - , - ); - }).toErrorDev( - 'Warning: Failed prop type: The prop `dontPassToSeeErrorStack` is marked as required in `Validator`, but its value is `undefined`.\n' + - ' in Validator (at **)', - ); - }); }); diff --git a/packages/react/src/__tests__/ReactJSXElementValidator-test.js b/packages/react/src/__tests__/ReactJSXElementValidator-test.js index b7cdff0ce0aa1..53b200462385b 100644 --- a/packages/react/src/__tests__/ReactJSXElementValidator-test.js +++ b/packages/react/src/__tests__/ReactJSXElementValidator-test.js @@ -312,7 +312,7 @@ describe('ReactJSXElementValidator', () => { }); // @gate !disableLegacyContext || !__DEV__ - it('should warn on invalid context types', () => { + it('should not warn on invalid context types', () => { class NullContextTypeComponent extends React.Component { render() { return {this.props.prop}; @@ -321,12 +321,7 @@ describe('ReactJSXElementValidator', () => { NullContextTypeComponent.contextTypes = { prop: null, }; - expect(() => - ReactTestUtils.renderIntoDocument(), - ).toErrorDev( - 'NullContextTypeComponent: context type `prop` is invalid; it must ' + - 'be a function, usually from the `prop-types` package,', - ); + ReactTestUtils.renderIntoDocument(); }); it('should warn if getDefaultProps is specified on the class', () => {