Render a Class Component to the DOM- 4th test failing

JavaScript
1

Tell us what’s happening:
Can anyone see a mistake in the code? The tests say that the component isn’t rendering in the div, but it does appear to render correctly on the right side viewport.

Your code so far



class TypesOfFood extends React.Component {
  constructor(props) {
    super(props);
  }
  render() {
    return (
      <div>
        <h1>Types of Food:</h1>
        {/* change code below this line */}
<Fruits /> <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 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/front-end-libraries/react/render-a-class-component-to-the-dom

2

The test is being a little too picky. Try putting the components on separate lines.

1 Like