Creating the shopping cart

To develop a ShoppingCart component, we will start with a simple test that expects an empty container to show on the page. Inside the container, there should be a button for the user to place their order.

To do this, we will start with a test that simply checks that the container and button are present:

it('renders a shopping cart', () => {
  render(<PizzaShopApp />);
  const shoppingCartContainer = screen.getByTestId('shopping-cart');
  const placeOrderButton = within(shoppingCartContainer).
  getByRole('button');
  expect(placeOrderButton).toBeInTheDocument();
})

The Jest test renders the PizzaShopApp component and then locates a shopping cart container by its data-testid. Within this container, it looks for a button element by its role. The test concludes by using the toBeInTheDocument() matcher to verify that this button is present in the rendered output.

...