@testing-library/react-native#wait TypeScript Examples

The following examples show how to use @testing-library/react-native#wait. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: RootStackNavigator.test.tsx    From DoobooIAP with MIT License 6 votes vote down vote up
describe('[Stack] navigator', () => {
  beforeEach(() => {
    props = createTestProps();
    component = createTestElement(<StackNavigator {...props} />);
  });

  it('should renders without crashing', async () => {
    const { container } = render(component);
    await act(() => wait());
    expect(container).toBeTruthy();
    expect(container).toMatchSnapshot();
  });
});
Example #2
Source File: App.spec.tsx    From rocketseat-gostack-11-desafios with MIT License 5 votes vote down vote up
describe('Dashboard', () => {
  it('should be able to list products', async () => {
    apiMock.onGet('products').reply(200, [
      {
        id: '1234',
        title: 'Cadeira Rivatti',
        image_url:
          'https://http2.mlstatic.com/cadeira-rivatti-branca-pes-madeira-confortavel-bonita-D_NQ_NP_981901-MLB20422264882_092015-F.jpg',
        price: 400,
      },
      {
        id: '123456',
        title: 'Poltrona de madeira',
        image_url:
          'https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcRod5Tf0R0LkCjClrgAJU0tM713nyqHTP2lFbXU1o5zheYpwgfonTTde8swBNlahgij4hGeOgn7hQ&usqp=CAc',
        price: 600,
      },
    ]);

    const { getByText, getByTestId } = render(<Dashboard />);

    await wait(() => expect(getByText('Cadeira Rivatti')).toBeTruthy(), {
      timeout: 200,
    });

    expect(getByText('Cadeira Rivatti')).toBeTruthy();
    expect(getByTestId('add-to-cart-1234')).toBeTruthy();

    expect(getByText('Poltrona de madeira')).toBeTruthy();
    expect(getByTestId('add-to-cart-123456')).toBeTruthy();
  });

  it('should be able to add item to cart', async () => {
    const useCartMocked = mocked(useCart);

    const addToCart = jest.fn();

    useCartMocked.mockReturnValue({
      addToCart,
      products: [],
      increment: jest.fn(),
      decrement: jest.fn(),
    });

    const products = [
      {
        id: '1234',
        title: 'Cadeira Rivatti',
        image_url:
          'https://http2.mlstatic.com/cadeira-rivatti-branca-pes-madeira-confortavel-bonita-D_NQ_NP_981901-MLB20422264882_092015-F.jpg',
        price: 400,
      },
      {
        id: '123456',
        title: 'Poltrona de madeira',
        image_url:
          'https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcRod5Tf0R0LkCjClrgAJU0tM713nyqHTP2lFbXU1o5zheYpwgfonTTde8swBNlahgij4hGeOgn7hQ&usqp=CAc',
        price: 600,
      },
    ];

    apiMock.onGet('products').reply(200, products);

    const { getByText, getByTestId } = render(<Dashboard />);

    await wait(() => expect(getByText('Cadeira Rivatti')).toBeTruthy(), {
      timeout: 200,
    });

    act(() => {
      fireEvent.press(getByTestId('add-to-cart-1234'));
    });

    expect(addToCart).toHaveBeenCalledWith(products[0]);
  });
});
Example #3
Source File: Favorites.spec.tsx    From rocketseat-gostack-11-desafios with MIT License 5 votes vote down vote up
describe('Favorites', () => {
  it('should be able to list the favorite food plates', async () => {
    const items = [
      {
        id: 1,
        name: 'Ao molho',
        description:
          'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
        price: 19.9,
        category: 1,
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food1.png',
        thumbnail_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/ao_molho.png',
        extras: [
          {
            id: 1,
            name: 'Bacon',
            value: 1.5,
          },
          {
            id: 2,
            name: 'Frango',
            value: 2,
          },
        ],
      },
      {
        id: 2,
        name: 'Veggie',
        description:
          'Macarrão com pimentão, ervilha e ervas finas colhidas no himalaia.',
        price: '21.90',
        category: 2,
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food2.png',
        thumbnail_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/veggie.png',
        extras: [
          {
            id: 3,
            name: 'Bacon',
            value: 1.5,
          },
        ],
      },
    ];

    apiMock.onGet('/favorites').reply(200, items);

    const { getByText } = render(<Favorites />);

    await wait(() => expect(getByText('Ao molho')).toBeTruthy(), {
      timeout: 200,
    });

    expect(getByText('Ao molho')).toBeTruthy();
    expect(
      getByText(
        'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
      ),
    ).toBeTruthy();
    expect(getByText('Veggie')).toBeTruthy();
    expect(
      getByText(
        'Macarrão com pimentão, ervilha e ervas finas colhidas no himalaia.',
      ),
    ).toBeTruthy();
  });
});
Example #4
Source File: Orders.spec.tsx    From rocketseat-gostack-11-desafios with MIT License 5 votes vote down vote up
describe('Orders', () => {
  it('should be able to list the orders', async () => {
    const items = [
      {
        id: 1,
        name: 'Ao molho',
        description:
          'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
        price: 19.9,
        category: 1,
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food1.png',
        thumbnail_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/ao_molho.png',
        extras: [
          {
            id: 1,
            name: 'Bacon',
            value: 1.5,
          },
          {
            id: 2,
            name: 'Frango',
            value: 2,
          },
        ],
      },
      {
        id: 2,
        name: 'Veggie',
        description:
          'Macarrão com pimentão, ervilha e ervas finas colhidas no himalaia.',
        price: '21.90',
        category: 2,
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food2.png',
        thumbnail_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/veggie.png',
        extras: [
          {
            id: 3,
            name: 'Bacon',
            value: 1.5,
          },
        ],
      },
    ];

    apiMock.onGet('/orders').reply(200, items);

    const { getByText } = render(<Orders />);

    await wait(() => expect(getByText('Ao molho')).toBeTruthy(), {
      timeout: 200,
    });

    expect(getByText('Ao molho')).toBeTruthy();
    expect(
      getByText(
        'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
      ),
    ).toBeTruthy();
    expect(getByText('Veggie')).toBeTruthy();
    expect(
      getByText(
        'Macarrão com pimentão, ervilha e ervas finas colhidas no himalaia.',
      ),
    ).toBeTruthy();
  });
});
Example #5
Source File: cart.spec.tsx    From rocketseat-gostack-11-desafios with MIT License 4 votes vote down vote up
describe('Cart Context', () => {
  afterEach(() => {
    mockedAsyncStorage.setItem.mockClear();
    mockedAsyncStorage.getItem.mockClear();

    cleanup();
  });

  it('should be able to add products to the cart', async () => {
    const { getByText, getByTestId } = render(
      <CartProvider>
        <TestComponent />
      </CartProvider>,
    );

    act(() => {
      fireEvent.press(getByTestId('add-to-cart'));
    });

    expect(getByText('Test product')).toBeTruthy();
    expect(getByText('1')).toBeTruthy();
  });

  it('should be able to increment quantity', async () => {
    const { getByText, getByTestId } = render(
      <CartProvider>
        <TestComponent />
      </CartProvider>,
    );

    act(() => {
      fireEvent.press(getByTestId('add-to-cart'));
    });

    act(() => {
      fireEvent.press(getByTestId('increment'));
    });

    expect(getByText('2')).toBeTruthy();
  });

  it('should be able to decrement quantity', async () => {
    const { getByText, getByTestId } = render(
      <CartProvider>
        <TestComponent />
      </CartProvider>,
    );

    act(() => {
      fireEvent.press(getByTestId('add-to-cart'));
    });

    act(() => {
      fireEvent.press(getByTestId('increment'));
    });

    act(() => {
      fireEvent.press(getByTestId('decrement'));
    });

    expect(getByText('1')).toBeTruthy();
  });

  it('should load products from AsyncStorage', async () => {
    mockedAsyncStorage.getItem.mockReturnValue(
      new Promise(resolve =>
        resolve(
          JSON.stringify([
            {
              id: '1234',
              title: 'Test product',
              image_url: 'test',
              price: 1000,
              quantity: 0,
            },
          ]),
        ),
      ),
    );

    const { getByText } = render(
      <CartProvider>
        <TestComponent />
      </CartProvider>,
    );

    await wait(() => expect(getByText('Test product')).toBeTruthy());

    expect(getByText('Test product')).toBeTruthy();
  });

  it('should store products in AsyncStorage while adding, incrementing and decrementing', async () => {
    const { getByTestId } = render(
      <CartProvider>
        <TestComponent />
      </CartProvider>,
    );

    await act(async () => {
      fireEvent.press(getByTestId('add-to-cart'));
      fireEvent.press(getByTestId('increment'));
      fireEvent.press(getByTestId('decrement'));
    });

    expect(mockedAsyncStorage.setItem).toHaveBeenCalledTimes(3);
  });
});
Example #6
Source File: Dashboard.spec.tsx    From rocketseat-gostack-11-desafios with MIT License 4 votes vote down vote up
describe('Dashboard', () => {
  it('should be able to list the food plates', async () => {
    const items = [
      {
        id: 1,
        name: 'Ao molho',
        description:
          'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
        price: 19.9,
        category: 1,
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food1.png',
        thumbnail_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/ao_molho.png',
        extras: [
          {
            id: 1,
            name: 'Bacon',
            value: 1.5,
          },
          {
            id: 2,
            name: 'Frango',
            value: 2,
          },
        ],
      },
      {
        id: 2,
        name: 'Veggie',
        description:
          'Macarrão com pimentão, ervilha e ervas finas colhidas no himalaia.',
        price: '21.90',
        category: 2,
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food2.png',
        thumbnail_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/veggie.png',
        extras: [
          {
            id: 3,
            name: 'Bacon',
            value: 1.5,
          },
        ],
      },
    ];

    apiMock.onGet('/categories').reply(200, [
      {
        id: 1,
        title: 'Massas',
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/massas.png',
      },
    ]);

    apiMock.onGet('/foods').reply(config => {
      if (config.params.name_like === '') {
        return [200, items];
      }

      return [200, items];
    });

    apiMock.onGet('/foods?name_like=').reply(200, items);

    const { getByText } = render(<Dashboard />);

    await wait(() => expect(getByText('Ao molho')).toBeTruthy(), {
      timeout: 200,
    });

    expect(getByText('Ao molho')).toBeTruthy();
    expect(
      getByText(
        'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
      ),
    ).toBeTruthy();
    expect(getByText('Veggie')).toBeTruthy();
    expect(
      getByText(
        'Macarrão com pimentão, ervilha e ervas finas colhidas no himalaia.',
      ),
    ).toBeTruthy();
  });

  it('should be able to list the food plates filtered by category', async () => {
    const items = [
      {
        id: 1,
        name: 'Ao molho',
        description:
          'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
        price: 19.9,
        category: 1,
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food1.png',
        thumbnail_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/ao_molho.png',
        extras: [
          {
            id: 1,
            name: 'Bacon',
            value: 1.5,
          },
          {
            id: 2,
            name: 'Frango',
            value: 2,
          },
        ],
      },
      {
        id: 2,
        name: 'Veggie',
        description:
          'Macarrão com pimentão, ervilha e ervas finas colhidas no himalaia.',
        price: '21.90',
        category: 2,
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food2.png',
        thumbnail_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/veggie.png',
        extras: [
          {
            id: 3,
            name: 'Bacon',
            value: 1.5,
          },
        ],
      },
    ];

    const categoryOneItems = [
      {
        id: 1,
        name: 'Ao molho',
        description:
          'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
        price: 19.9,
        category: 1,
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food1.png',
        thumbnail_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/ao_molho.png',
        extras: [
          {
            id: 1,
            name: 'Bacon',
            value: 1.5,
          },
          {
            id: 2,
            name: 'Frango',
            value: 2,
          },
        ],
      },
    ];

    const categoryTwoItems = [
      {
        id: 2,
        name: 'Veggie',
        description:
          'Macarrão com pimentão, ervilha e ervas finas colhidas no himalaia.',
        price: '21.90',
        category: 2,
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food2.png',
        thumbnail_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/veggie.png',
        extras: [
          {
            id: 3,
            name: 'Bacon',
            value: 1.5,
          },
        ],
      },
    ];

    const categories = [
      {
        id: 1,
        title: 'Massas',
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/massas.png',
      },
      {
        id: 2,
        title: 'Pizzas',
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/pizzas.png',
      },
    ];

    apiMock.onGet('/foods').reply(config => {
      switch (config.params.category_like) {
        case 1:
          return [200, categoryOneItems];

        case 2:
          return [200, categoryTwoItems];

        default:
          return [200, items];
      }
    });

    apiMock.onGet('/foods?category_like=1').reply(200, categoryOneItems);
    apiMock.onGet('/foods?category_like=2').reply(200, categoryTwoItems);

    apiMock.onGet('/categories').reply(200, categories);

    const { getByText, queryByText, getByTestId } = render(<Dashboard />);

    await wait(() => expect(getByText('Massas')).toBeTruthy(), {
      timeout: 200,
    });

    expect(getByText('Massas')).toBeTruthy();
    expect(getByText('Pizzas')).toBeTruthy();

    expect(getByText('Ao molho')).toBeTruthy();
    expect(getByText('Veggie')).toBeTruthy();

    await act(async () => {
      fireEvent.press(getByTestId('category-1'));
    });

    expect(getByText('Ao molho')).toBeTruthy();

    expect(queryByText('Veggie')).toBeFalsy();

    await act(async () => {
      fireEvent.press(getByTestId('category-2'));
    });

    expect(queryByText('Ao molho')).toBeFalsy();
    expect(getByText('Veggie')).toBeTruthy();

    await act(async () => {
      fireEvent.press(getByTestId('category-2'));
    });

    expect(getByText('Ao molho')).toBeTruthy();
    expect(getByText('Veggie')).toBeTruthy();
  });

  it('should be able to list the food plates filtered by name search', async () => {
    const items = [
      {
        id: 1,
        name: 'Ao molho',
        description:
          'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
        price: 19.9,
        category: 1,
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food1.png',
        thumbnail_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/ao_molho.png',
        extras: [
          {
            id: 1,
            name: 'Bacon',
            value: 1.5,
          },
          {
            id: 2,
            name: 'Frango',
            value: 2,
          },
        ],
      },
      {
        id: 2,
        name: 'Veggie',
        description:
          'Macarrão com pimentão, ervilha e ervas finas colhidas no himalaia.',
        price: '21.90',
        category: 2,
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food2.png',
        thumbnail_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/veggie.png',
        extras: [
          {
            id: 3,
            name: 'Bacon',
            value: 1.5,
          },
        ],
      },
    ];

    const aoMolhoSearchResult = [
      {
        id: 1,
        name: 'Ao molho',
        description:
          'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
        price: 19.9,
        category: 1,
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food1.png',
        thumbnail_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/ao_molho.png',
        extras: [
          {
            id: 1,
            name: 'Bacon',
            value: 1.5,
          },
          {
            id: 2,
            name: 'Frango',
            value: 2,
          },
        ],
      },
    ];

    const veggieSearchResult = [
      {
        id: 2,
        name: 'Veggie',
        description:
          'Macarrão com pimentão, ervilha e ervas finas colhidas no himalaia.',
        price: '21.90',
        category: 2,
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food2.png',
        thumbnail_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/veggie.png',
        extras: [
          {
            id: 3,
            name: 'Bacon',
            value: 1.5,
          },
        ],
      },
    ];

    const categories = [
      {
        id: 1,
        title: 'Massas',
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/massas.png',
      },
      {
        id: 2,
        title: 'Pizzas',
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/pizzas.png',
      },
    ];

    apiMock.onGet('/foods').reply(config => {
      switch (config.params.name_like) {
        case 'Ao molho':
          return [200, aoMolhoSearchResult];

        case 'Veggie':
          return [200, veggieSearchResult];

        default:
          return [200, items];
      }
    });

    apiMock.onGet('/foods?name_like=Ao+molho').reply(200, aoMolhoSearchResult);

    apiMock.onGet('/foods?name_like=Veggie').reply(200, veggieSearchResult);

    apiMock.onGet('/categories').reply(200, categories);

    const { getByText, queryByText, getByTestId, debug } = render(
      <Dashboard />,
    );

    await wait(() => expect(getByText('Massas')).toBeTruthy(), {
      timeout: 200,
    });

    expect(getByText('Massas')).toBeTruthy();
    expect(getByText('Pizzas')).toBeTruthy();

    expect(getByText('Ao molho')).toBeTruthy();
    expect(getByText('Veggie')).toBeTruthy();

    const inputSearch = getByTestId('search-input');

    await act(async () => {
      fireEvent.changeText(inputSearch, 'Ao molho');
    });

    expect(getByText('Ao molho')).toBeTruthy();

    expect(queryByText('Veggie')).toBeFalsy();

    await act(async () => {
      fireEvent.changeText(inputSearch, 'Veggie');
    });

    expect(queryByText('Ao molho')).toBeFalsy();

    expect(getByText('Veggie')).toBeTruthy();

    await act(async () => {
      fireEvent.changeText(inputSearch, '');
    });

    expect(getByText('Ao molho')).toBeTruthy();

    expect(queryByText('Veggie')).toBeTruthy();
  });

  it('should be able to navigate to the food details page', async () => {
    const items = [
      {
        id: 1,
        name: 'Ao molho',
        description:
          'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
        price: 19.9,
        category: 1,
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food1.png',
        thumbnail_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/ao_molho.png',
        extras: [
          {
            id: 1,
            name: 'Bacon',
            value: 1.5,
          },
          {
            id: 2,
            name: 'Frango',
            value: 2,
          },
        ],
      },
      {
        id: 2,
        name: 'Veggie',
        description:
          'Macarrão com pimentão, ervilha e ervas finas colhidas no himalaia.',
        price: '21.90',
        category: 2,
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food2.png',
        thumbnail_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/veggie.png',
        extras: [
          {
            id: 3,
            name: 'Bacon',
            value: 1.5,
          },
        ],
      },
    ];

    apiMock.onGet('/categories').reply(200, [
      {
        id: 1,
        title: 'Massas',
        image_url:
          'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/massas.png',
      },
    ]);

    apiMock.onGet('/foods').reply(config => {
      if (config.params.name_like === '') {
        return [200, items];
      }

      return [200, items];
    });

    apiMock.onGet('/foods?name_like=').reply(200, items);

    const { getByText, getByTestId } = render(<Dashboard />);

    await wait(() => expect(getByText('Ao molho')).toBeTruthy(), {
      timeout: 200,
    });

    await act(async () => {
      fireEvent.press(getByTestId('food-1'));
    });

    expect(getByTestId('food-1')).toBeTruthy();

    expect(mockedNavigate).toHaveBeenCalledTimes(1);

    expect(mockedNavigate).toHaveBeenCalledWith('FoodDetails', {
      id: 1,
    });
  });
});
Example #7
Source File: FoodDetails.spec.tsx    From rocketseat-gostack-11-desafios with MIT License 4 votes vote down vote up
describe('Orders', () => {
  it('should be able to list the food', async () => {
    const item = {
      id: 1,
      name: 'Ao molho',
      description:
        'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
      price: 19.9,
      category: 1,
      image_url:
        'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food1.png',
      thumbnail_url:
        'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/ao_molho.png',
      extras: [
        {
          id: 1,
          name: 'Bacon',
          value: 1.5,
        },
        {
          id: 2,
          name: 'Frango',
          value: 2,
        },
      ],
    };

    apiMock.onGet('/foods/1').reply(200, item);

    const { getByText, getByTestId } = render(<FoodDetails />);

    await wait(() => expect(getByText('Ao molho')).toBeTruthy(), {
      timeout: 200,
    });

    expect(getByText('Ao molho')).toBeTruthy();
    expect(
      getByText(
        'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
      ),
    ).toBeTruthy();

    expect(getByText('Bacon')).toBeTruthy();
    expect(getByText('Frango')).toBeTruthy();

    expect(getByTestId('food-quantity')).toHaveTextContent('1');

    expect(getByTestId('cart-total')).toHaveTextContent('R$ 19,90');
  });

  it('should be able to increment food quantity', async () => {
    const item = {
      id: 1,
      name: 'Ao molho',
      description:
        'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
      price: 19.9,
      category: 1,
      image_url:
        'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food1.png',
      thumbnail_url:
        'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/ao_molho.png',
      extras: [
        {
          id: 1,
          name: 'Bacon',
          value: 1.5,
        },
        {
          id: 2,
          name: 'Frango',
          value: 2,
        },
      ],
    };

    apiMock.onGet('/foods/1').reply(200, item);

    const { getByText, getByTestId } = render(<FoodDetails />);

    await wait(() => expect(getByText('Ao molho')).toBeTruthy(), {
      timeout: 200,
    });

    expect(getByText('Ao molho')).toBeTruthy();
    expect(
      getByText(
        'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
      ),
    ).toBeTruthy();

    expect(getByText('Bacon')).toBeTruthy();
    expect(getByText('Frango')).toBeTruthy();

    expect(getByTestId('food-quantity')).toHaveTextContent('1');

    await act(async () => {
      fireEvent.press(getByTestId('increment-food'));
    });

    expect(getByTestId('food-quantity')).toHaveTextContent('2');

    expect(getByTestId('cart-total')).toHaveTextContent('R$ 39,80');
  });

  it('should be able to decrement food quantity', async () => {
    const item = {
      id: 1,
      name: 'Ao molho',
      description:
        'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
      price: 19.9,
      category: 1,
      image_url:
        'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food1.png',
      thumbnail_url:
        'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/ao_molho.png',
      extras: [
        {
          id: 1,
          name: 'Bacon',
          value: 1.5,
        },
        {
          id: 2,
          name: 'Frango',
          value: 2,
        },
      ],
    };

    apiMock.onGet('/foods/1').reply(200, item);

    const { getByText, getByTestId } = render(<FoodDetails />);

    await wait(() => expect(getByText('Ao molho')).toBeTruthy(), {
      timeout: 200,
    });

    expect(getByText('Ao molho')).toBeTruthy();
    expect(
      getByText(
        'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
      ),
    ).toBeTruthy();

    expect(getByText('Bacon')).toBeTruthy();
    expect(getByText('Frango')).toBeTruthy();

    expect(getByTestId('food-quantity')).toHaveTextContent('1');

    await act(async () => {
      fireEvent.press(getByTestId('increment-food'));
    });

    expect(getByTestId('food-quantity')).toHaveTextContent('2');

    await act(async () => {
      fireEvent.press(getByTestId('increment-food'));
    });

    expect(getByTestId('food-quantity')).toHaveTextContent('3');

    await act(async () => {
      fireEvent.press(getByTestId('decrement-food'));
    });

    expect(getByTestId('food-quantity')).toHaveTextContent('2');

    await act(async () => {
      fireEvent.press(getByTestId('decrement-food'));
    });

    expect(getByTestId('food-quantity')).toHaveTextContent('1');

    expect(getByTestId('cart-total')).toHaveTextContent('R$ 19,90');
  });

  it('should not be able to decrement food quantity below than 1', async () => {
    const item = {
      id: 1,
      name: 'Ao molho',
      description:
        'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
      price: 19.9,
      category: 1,
      image_url:
        'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food1.png',
      thumbnail_url:
        'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/ao_molho.png',
      extras: [
        {
          id: 1,
          name: 'Bacon',
          value: 1.5,
        },
        {
          id: 2,
          name: 'Frango',
          value: 2,
        },
      ],
    };

    apiMock.onGet('/foods/1').reply(200, item);

    const { getByText, getByTestId } = render(<FoodDetails />);

    await wait(() => expect(getByText('Ao molho')).toBeTruthy(), {
      timeout: 200,
    });

    expect(getByText('Ao molho')).toBeTruthy();
    expect(
      getByText(
        'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
      ),
    ).toBeTruthy();

    expect(getByText('Bacon')).toBeTruthy();
    expect(getByText('Frango')).toBeTruthy();

    expect(getByTestId('food-quantity')).toHaveTextContent('1');

    await act(async () => {
      fireEvent.press(getByTestId('increment-food'));
    });

    expect(getByTestId('food-quantity')).toHaveTextContent('2');

    await act(async () => {
      fireEvent.press(getByTestId('decrement-food'));
    });

    expect(getByTestId('food-quantity')).toHaveTextContent('1');

    await act(async () => {
      fireEvent.press(getByTestId('decrement-food'));
    });

    expect(getByTestId('food-quantity')).toHaveTextContent('1');
  });

  it('should be able to increment an extra item quantity', async () => {
    const item = {
      id: 1,
      name: 'Ao molho',
      description:
        'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
      price: 19.9,
      category: 1,
      image_url:
        'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food1.png',
      thumbnail_url:
        'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/ao_molho.png',
      extras: [
        {
          id: 1,
          name: 'Bacon',
          value: 1.5,
        },
        {
          id: 2,
          name: 'Frango',
          value: 2,
        },
      ],
    };

    apiMock.onGet('/foods/1').reply(200, item);

    const { getByText, getByTestId } = render(<FoodDetails />);

    await wait(() => expect(getByText('Ao molho')).toBeTruthy(), {
      timeout: 200,
    });

    expect(getByText('Ao molho')).toBeTruthy();
    expect(
      getByText(
        'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
      ),
    ).toBeTruthy();

    expect(getByText('Bacon')).toBeTruthy();
    expect(getByText('Frango')).toBeTruthy();

    expect(getByTestId('extra-quantity-1')).toHaveTextContent('0');

    await act(async () => {
      fireEvent.press(getByTestId('increment-extra-1'));
    });

    expect(getByTestId('extra-quantity-1')).toHaveTextContent('1');

    await act(async () => {
      fireEvent.press(getByTestId('increment-extra-1'));
    });

    expect(getByTestId('extra-quantity-1')).toHaveTextContent('2');

    expect(getByTestId('cart-total')).toHaveTextContent('R$ 22,90');
  });

  it('should be able to decrement an extra item quantity', async () => {
    const item = {
      id: 1,
      name: 'Ao molho',
      description:
        'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
      price: 19.9,
      category: 1,
      image_url:
        'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-food/food1.png',
      thumbnail_url:
        'https://storage.googleapis.com/golden-wind/bootcamp-gostack/desafio-gorestaurant-mobile/ao_molho.png',
      extras: [
        {
          id: 1,
          name: 'Bacon',
          value: 1.5,
        },
      ],
    };

    apiMock.onGet('/foods/1').reply(200, item);

    const { getByText, getByTestId } = render(<FoodDetails />);

    await wait(() => expect(getByText('Ao molho')).toBeTruthy(), {
      timeout: 200,
    });

    expect(getByText('Ao molho')).toBeTruthy();
    expect(
      getByText(
        'Macarrão ao molho branco, fughi e cheiro verde das montanhas.',
      ),
    ).toBeTruthy();

    expect(getByText('Bacon')).toBeTruthy();

    expect(getByTestId('extra-quantity-1')).toHaveTextContent('0');

    await act(async () => {
      fireEvent.press(getByTestId('increment-extra-1'));
    });

    expect(getByTestId('extra-quantity-1')).toHaveTextContent('1');

    await act(async () => {
      fireEvent.press(getByTestId('increment-extra-1'));
    });

    expect(getByTestId('extra-quantity-1')).toHaveTextContent('2');

    await act(async () => {
      fireEvent.press(getByTestId('decrement-extra-1'));
    });

    expect(getByTestId('extra-quantity-1')).toHaveTextContent('1');

    expect(getByTestId('cart-total')).toHaveTextContent('R$ 21,40');
  });
});