Skip to content

Conversation

@gaearon
Copy link
Collaborator

@gaearon gaearon commented Aug 2, 2018

It might not be obvious but by rendering a Generator you're asking React to perform a mutation during the render phase. This already doesn't work in development because we do key validation, thus consuming the generator. It led to some confusion: #11864, #12995, #11502, #7536.

Let's warn about this pattern right as we encounter it. The new warning shouldn't be noisy because the pattern is already broken in development (and as you can see in #12995 (comment), it's fragile in production).

I'm not sure how to detect generators in browsers that don't support toStringTag but I figured warning in modern browsers is sufficient.

@sebmarkbage
Copy link
Collaborator

Could be nice to add a test that we still support generators as the iterator of an iterable.

@gaearon
Copy link
Collaborator Author

gaearon commented Aug 2, 2018

We've got some.

function prepareChildrenIterable(childrenArray) {
return {
'@@iterator': function*() {
// eslint-disable-next-line no-for-of-loops/no-for-of-loops
for (const child of childrenArray) {
yield child;
}
},
};
}

@pull-bot
Copy link

pull-bot commented Aug 2, 2018

Details of bundled changes.

Comparing: 46d5afc...5808caa

react-dom

File Filesize Diff Gzip Diff Prev Size Current Size Prev Gzip Current Gzip ENV
react-dom.development.js +0.1% +0.2% 641.77 KB 642.55 KB 150.67 KB 150.91 KB UMD_DEV
react-dom.development.js +0.1% +0.2% 637.91 KB 638.69 KB 149.49 KB 149.74 KB NODE_DEV
ReactDOM-dev.js +0.1% +0.2% 645.01 KB 645.94 KB 147.81 KB 148.06 KB FB_WWW_DEV

react-art

File Filesize Diff Gzip Diff Prev Size Current Size Prev Gzip Current Gzip ENV
react-art.development.js +0.2% +0.2% 434.58 KB 435.36 KB 98.41 KB 98.65 KB UMD_DEV
react-art.development.js +0.2% +0.3% 367.09 KB 367.88 KB 81.34 KB 81.58 KB NODE_DEV
ReactART-dev.js +0.3% +0.3% 357.43 KB 358.35 KB 76.2 KB 76.45 KB FB_WWW_DEV

react-test-renderer

File Filesize Diff Gzip Diff Prev Size Current Size Prev Gzip Current Gzip ENV
react-test-renderer.development.js +0.2% +0.3% 362.99 KB 363.77 KB 79.75 KB 79.99 KB UMD_DEV
react-test-renderer.development.js +0.2% +0.3% 359.12 KB 359.9 KB 78.77 KB 79.01 KB NODE_DEV
ReactTestRenderer-dev.js +0.3% +0.3% 364.09 KB 365.01 KB 77.69 KB 77.94 KB FB_WWW_DEV

react-reconciler

File Filesize Diff Gzip Diff Prev Size Current Size Prev Gzip Current Gzip ENV
react-reconciler.development.js +0.2% +0.3% 348.11 KB 348.89 KB 75.38 KB 75.62 KB NODE_DEV
react-reconciler-persistent.development.js +0.2% +0.3% 346.73 KB 347.51 KB 74.82 KB 75.06 KB NODE_DEV

react-native-renderer

File Filesize Diff Gzip Diff Prev Size Current Size Prev Gzip Current Gzip ENV
ReactNativeRenderer-dev.js +0.2% +0.2% 482.26 KB 483.18 KB 106.55 KB 106.8 KB RN_FB_DEV
ReactNativeRenderer-dev.js +0.2% +0.2% 481.99 KB 482.92 KB 106.49 KB 106.74 KB RN_OSS_DEV
ReactFabric-dev.js +0.2% +0.2% 472.47 KB 473.39 KB 104.11 KB 104.36 KB RN_FB_DEV
ReactFabric-dev.js +0.2% +0.2% 472.5 KB 473.43 KB 104.13 KB 104.38 KB RN_OSS_DEV

Generated by 🚫 dangerJS

@sebmarkbage
Copy link
Collaborator

We should also test one with a modern Symbol.iterator.

) {
warning(
didWarnAboutGenerators,
'Using Generators as children is unsupported and will likely yield ' +
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yield unexpected results

nice pun 😄

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants