I'm facing a bug I think

I’m in this part :

React: Use React to Render Nested Components

here’s my code

const TypesOfFruit = () => {
  return (
    <div>
       <h2>Good ELEMENT</h2>
       <ul>
         <li>LIST 1</li>
         <li>LIST 2</li>
       </ul>
    </div>
  );
};

const Fruits = () => {
  return (<TypesOfFruit />);
};

class TypesOfFood extends React.Component {
  constructor(props) {
    super(props);
  }

  render() {
    return (
    <div>
      <div></div>
      <Fruits />
    </div>
    );
  }
};

there’s only 2 points accepted from 4
I’m sure my code is fine and all 4 points should be accepted :slight_smile:

Passed:

The TypesOfFood component should return a single div element.

The TypesOfFood component should return the Fruits component.

Not Passed:

The Fruits component should return the TypesOfFruit component.

The TypesOfFruit component should return the h2 and ul elements.

Please provide a direct hyperlink to the challenge going forward. Also, please blur your code so that it doesn’t spoil it for anyone else first hitting the page (surround code block with ), if you have a complete working (or mostly working) solution.

The tests can be strict. The challenge is asking you to add code in the indicated areas, not to
change any existing code. Do that and the tests may be happy then.