Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Cannot log after tests are done. Did you forget to wait for something async in your test?

Porque essa mensagem aparece quando eu descomento o it() comentado no código abaixo? esse é o conteudo do App.test.js.

import React from "react";
import { render, screen, fireEvent } from "@testing-library/react";
import App, { calcularNovoSaldo } from "./App";

describe("Componente principal", () => {
  describe("Quando eu abro o app do banco", () => {
    it("Ele contem o nome do banco", () => {
      render(<App />);
      expect(screen.getByText("ByteBank")).toBeInTheDocument();
    });
    it("Ele contem o SALDO", () => {
      render(<App />);
      expect(screen.getByText("Saldo:")).toBeInTheDocument();
    });
    // it("Ele contem o Botão de realizar transações", () => {
    //   render(<App />);
    //   expect(screen.getByText("Realizar operação")).toBeInTheDocument();
    // });
  });

  describe("Quando eu realizo uma transação", () => {
    it("Se ela for um saque o valor vai diminuir", () => {
      const valores = {
        transacao: "saque",
        valor: 250,
      };
      expect(calcularNovoSaldo(valores, 150)).toBe(-100);
    });

    it("Se ela for um saque, a transação deve ser realizada", () => {
      const { getByText, getByLabelText, getByTestId } = render(<App />);
      const saldo = getByText("R$ 1000");
      const transacao = getByLabelText("Saque");
      const valor = getByTestId("valor");
      const botaoTransacao = getByText("Realizar operação");
      expect(saldo.textContent).toBe("R$ 1000");
      fireEvent.click(transacao, { target: { value: "saque" } });
      fireEvent.change(valor, { target: { value: "10" } });
      fireEvent.click(botaoTransacao);
      expect(saldo.textContent).toBe("R$ 990");
    });

    it("Se ela for um deposito o valor vai aumentar", () => {
      const valores = {
        transacao: "deposito",
        valor: 50,
      };
      expect(calcularNovoSaldo(valores, 50)).toBe(100);
    });
  });
});
1 resposta
solução!

Olá, Uder! Tudo certo?

A mensagem sobre act é um aviso comum relacionado à forma que o componente se comporta, geralmente é relacionado a algum componente que lida com operações assíncronas, como o App.

É difícil ao certo determinar o que causa esse erro nesse cenário específico, mas uma solução que alguns alunos encontraram para esse alerta é rodar o seguinte:

npm install @testing-library/react@12

Então, basicamente, o projeto utiliza essa biblioteca para os testes, mas em uma versão anterior à 12. Esse comando adiciona a versão 12 no projeto, que em alguns casos parou de disparar esse aviso.

Também tive esses alertas aqui, o complicado é que em alguns momentos apareciam, em outros não, o que deixa tudo meio imprevisível. Por isso, acho que a solução acima é o melhor caminho.

Espero que ajude!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software