React - Render a Class Component to the DOM

What is wrong in this code. It is throwing error when I run the test.

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

// Change code below this line
ReactDOM.render(TypesOfFood, document.getElementById('challenge-node'));

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/106.0.0.0 Safari/537.36

Challenge: React - Render a Class Component to the DOM

Link to the challenge:

What error is it giving you? The more you tell us the more we can help. By the way you have misspelled fruits

It showing this in consloe

// running tests
The TypesOfFood component should return a single div element.
The TypesOfFood component should render the Fruits component after the h1 element.
The TypesOfFood component should render the Vegetables component after Fruits.
The TypesOfFood component should render to the DOM within the div with the id challenge-node.

Did you try running the test after fixing the fruit spelling error?

Oh yes it works Thanks

Glad you got it working.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.