React tutorial freezes and crashes


I’m stuck here:
I attempted to solve it and I guess my input wasn’t correct? It crashed and it does not let me do anything to the page, I can’t even select the text to copy and paste it and my answer is saved.

I’m going to delete cookies but thought I just post this as a bug, sorry if this post is against the rules, feel free to delete it.

Edit: so the problem was that I nested a component in itself:

class TypesOfFood extends React.Component {
  constructor(props) {
  render() {
    return (
        <h1>Types of Food:</h1>
        { /* Change code below this line */ }
        <TypesOfFood />
        { /* Change code above this line */ }

You have an infinite loop there. Your TypeOfFood component is trying to render itself. Which is trying to render itself. Which is trying to render itself. Turtles all the way down.

According to the instructions:

Take the TypesOfFruit component and compose it, or nest it, within the Fruits component. Then take the Fruits component and nest it within the TypesOfFood component.

So, where you have <TypesOfFood /> in your JSX, that should be referring to a component called Fruits. And then that Food component should have the TypesOfFruit component inside its JSX.

Thank you, Kevin! I did realize that I’ve made a mistake but didn’t know why it crashed the app, thank you for the explanation.
Whenever I refreshed my input was never removed so I was stuck until I finally deleted cookies for a fresh start. I also could not press on the reset button either.