React testing library can't find element after click

Question

I enter password and username wrongly on the application and I get an alert. But when I try to test this I can't find the element after click action. I tried to use waitfor to wait for the dom to rerender ( does it do this? I understood so). I used fireEvent before and it didn't work so I went with userEvent library but this way also didn't work. What am I doing wrong? Do you have any suggestions? I don't understand, and I am a beginner.

  test("form alerts wrong credentials if user enters wrong credentials", async () => {
    const { username, password, loginBtn } = setup();

    await act(async () => {
      userEvent.type(username, "wrong credentials");
    });
    await act(async () => {
      userEvent.type(password, "1234");
    });

    await act(async () => {
      userEvent.click(loginBtn);
    });

    await waitFor(() => {
      const alert = screen.queryByTestId("errorMsg");
      expect(alert).toBeInTheDocument();
    });
  });
});