test(auth): align login tests with disabled submit behavior

This commit is contained in:
Arthur Bassi 2026-06-18 10:06:50 -03:00
parent 9a3b49f6e2
commit b6ac72147e
2 changed files with 24 additions and 12 deletions

View file

@ -44,13 +44,19 @@ test.describe("Login page", () => {
await expect(page.getByRole("button", { name: "Sign In" })).toBeVisible();
});
test("shows client-side validation errors on empty submit", async ({ page }) => {
test("disables submit until email and password are valid", async ({ page }) => {
await page.goto("/login");
await page.getByRole("button", { name: "Sign In" }).click();
const submitButton = page.getByRole("button", { name: "Sign In" });
await expect(page.getByText("Email is required")).toBeVisible();
await expect(page.getByText("Password is required")).toBeVisible();
await expect(submitButton).toBeDisabled();
await page.locator("#login-email").fill("not-an-email");
await page.locator("#login-password").fill("secret123");
await expect(submitButton).toBeDisabled();
await page.locator("#login-email").fill("user@seahavenind.com");
await expect(submitButton).toBeEnabled();
});
test("shows error message for invalid credentials", async ({ page }) => {

View file

@ -52,7 +52,7 @@ describe("LoginPage integration", () => {
vi.mocked(authApi.getSession).mockResolvedValue(null);
});
it("shows validation errors on empty submit", async () => {
it("keeps submit disabled until email and password are valid", async () => {
renderWithProviders(<LoginRoutes />, { route: "/login" });
await waitFor(() => {
@ -61,14 +61,20 @@ describe("LoginPage integration", () => {
const form = document.querySelector("form");
expect(form).not.toBeNull();
await userEvent.click(within(form!).getByRole("button", { name: /sign in/i }));
await waitFor(() => {
expect(screen.getByText("Email is required")).toBeInTheDocument();
});
expect(screen.getByText("Password is required")).toBeInTheDocument();
expect(screen.getByRole("heading", { name: "Welcome back" })).toBeInTheDocument();
expect(authApi.login).not.toHaveBeenCalled();
const submitButton = within(form!).getByRole("button", { name: /sign in/i });
const emailInput = within(form!).getByLabelText("Email");
const passwordInput = within(form!).getByLabelText("Password");
expect(submitButton).toBeDisabled();
await userEvent.type(emailInput, "not-an-email");
await userEvent.type(passwordInput, "secret123");
expect(submitButton).toBeDisabled();
await userEvent.clear(emailInput);
await userEvent.type(emailInput, "user@seahavenind.com");
expect(submitButton).toBeEnabled();
});
it("logs in successfully and navigates to dashboard", async () => {