How do you test keys in react?

I'm trying to test code with keys that relate to another component in the codebase: Code I'm trying to test:

const Recipe = ({ title, image, calories, ingredients, preparation, url }) => {
  return (
    <div>
      <h1>{title}</h1>
      <img src={image} alt="pic of recipe" />
      <ol>
        {ingredients.map((ingredient) => (
          <li>{ingredient.text}</li>
        ))}
      </ol>
      <p>Calories: {calories}</p>
      {/* <p>{preparation}</p> */}
      <a href={url}> Hungry? Go to the recipe</a>
    </div>
  );
};

export default Recipe;

Sample test:

test('it renders a title when passed a recipe as a prop', () => {
        const header = component.find('h1')
        expect(header.props()).children(title)
    })

This one test is preventing the others from running, i'm not sure exactly how to test that the h1 element will render a {title} when there is no information to mock as we are using an API to actually fetch the data so there isn't any sample data in the other component.