Skip to content

Commit

Permalink
Don't trigger lazy in DEV during element creation (#19871)
Browse files Browse the repository at this point in the history
  • Loading branch information
gaearon authored Sep 21, 2020
1 parent a774502 commit bc6b7b6
Show file tree
Hide file tree
Showing 6 changed files with 43 additions and 9 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -979,13 +979,7 @@ describe('ReactLazy', () => {
},
);

if (__DEV__) {
// Getting the name for the warning cause the loading to start early.
expect(Scheduler).toHaveYielded(['Started loading']);
expect(Scheduler).toFlushAndYield(['Loading...']);
} else {
expect(Scheduler).toFlushAndYield(['Started loading', 'Loading...']);
}
expect(Scheduler).toFlushAndYield(['Started loading', 'Loading...']);
expect(root).not.toMatchRenderedOutput(<div>AB</div>);

await Promise.resolve();
Expand Down
5 changes: 4 additions & 1 deletion packages/react/src/ReactElementValidator.js
Original file line number Diff line number Diff line change
Expand Up @@ -211,7 +211,6 @@ function validatePropTypes(element) {
if (type === null || type === undefined || typeof type === 'string') {
return;
}
const name = getComponentName(type);
let propTypes;
if (typeof type === 'function') {
propTypes = type.propTypes;
Expand All @@ -227,9 +226,13 @@ function validatePropTypes(element) {
return;
}
if (propTypes) {
// Intentionally inside to avoid triggering lazy initializers:
const name = getComponentName(type);
checkPropTypes(propTypes, element.props, 'prop', name, element);
} else if (type.PropTypes !== undefined && !propTypesMisspellWarningShown) {
propTypesMisspellWarningShown = true;
// Intentionally inside to avoid triggering lazy initializers:
const name = getComponentName(type);
console.error(
'Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?',
name || 'Unknown',
Expand Down
14 changes: 14 additions & 0 deletions packages/react/src/__tests__/ReactElementJSX-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -415,4 +415,18 @@ describe('ReactElement.jsx', () => {
// TODO: an explicit expect for no warning?
ReactDOM.render(JSXRuntime.jsx(Parent, {}), container);
});

it('does not call lazy initializers eagerly', () => {
let didCall = false;
const Lazy = React.lazy(() => {
didCall = true;
return {then() {}};
});
if (__DEV__) {
JSXDEVRuntime.jsxDEV(Lazy, {});
} else {
JSXRuntime.jsx(Lazy, {});
}
expect(didCall).toBe(false);
});
});
Original file line number Diff line number Diff line change
Expand Up @@ -532,4 +532,14 @@ describe('ReactElementValidator', () => {
{withoutStack: true},
);
});

it('does not call lazy initializers eagerly', () => {
let didCall = false;
const Lazy = React.lazy(() => {
didCall = true;
return {then() {}};
});
React.createElement(Lazy);
expect(didCall).toBe(false);
});
});
10 changes: 10 additions & 0 deletions packages/react/src/__tests__/ReactJSXElementValidator-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -417,4 +417,14 @@ describe('ReactJSXElementValidator', () => {
withoutStack: true,
});
});

it('does not call lazy initializers eagerly', () => {
let didCall = false;
const Lazy = React.lazy(() => {
didCall = true;
return {then() {}};
});
<Lazy />;
expect(didCall).toBe(false);
});
});
5 changes: 4 additions & 1 deletion packages/react/src/jsx/ReactJSXElementValidator.js
Original file line number Diff line number Diff line change
Expand Up @@ -227,7 +227,6 @@ function validatePropTypes(element) {
if (type === null || type === undefined || typeof type === 'string') {
return;
}
const name = getComponentName(type);
let propTypes;
if (typeof type === 'function') {
propTypes = type.propTypes;
Expand All @@ -243,9 +242,13 @@ function validatePropTypes(element) {
return;
}
if (propTypes) {
// Intentionally inside to avoid triggering lazy initializers:
const name = getComponentName(type);
checkPropTypes(propTypes, element.props, 'prop', name, element);
} else if (type.PropTypes !== undefined && !propTypesMisspellWarningShown) {
propTypesMisspellWarningShown = true;
// Intentionally inside to avoid triggering lazy initializers:
const name = getComponentName(type);
console.error(
'Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?',
name || 'Unknown',
Expand Down

0 comments on commit bc6b7b6

Please sign in to comment.