[Fiber] Infinite loop caused by a rendering error #9193
Description
Do you want to request a feature or report a bug?
Bug
What is the current behavior?
When a component returns something other than a valid React element, or null, it throws and does so infinitely. This is render-blocking and freezes the window.
If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem via https://jsfiddle.net or similar (template: https://jsfiddle.net/reactjs/69z2wepo/).
This happened to me when creating a Provider-type component that rendered its children directly. More specifically, when they were undefined. Eg
class Provider extends React.Component {
render() {
return this.props.children // should throw once.
}
}
// Elsewhere
<div>
<Provider>this works correctly</Provider>
// This freaks out
<Provider />
</div>
Is there a [CodePen, Fiddle, etc] of @next somewhere, that I can use to demonstrate this?
What is the expected behavior?
It should throw, but only once and not freeze the browser.
Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?
React 16.0.0-alpha.4
Yes, see http://codepen.io/rthor/pen/bqYBap?editors=0010#0
PS I know it's an alpha version 😄