Omar SobhandClaude Opus 4.8
8d9ea7faaa
The live /sign-in is a Clerk-rendered SignInForm (SSR is just a spinner); the
rendered design is the email-first progressive form. Reworked our /login to
match it visually while keeping our real email+password auth underneath.
- Email step: "Sign up with Slack" (cosmetic), OR, Work Email / Phone Number
tabs, work-email field, "Continue with work email →", "Other SSO Options".
Slack / Phone / SSO are cosmetic placeholders we don't support yet.
- Password step: "Continue" reveals the password field + "Sign in" (our actual
POST to /auth/session). A Back link returns to the email step.
- Headline now mirrors WorkClaw ("Multiply your team's brainpower" / "Sign up
to get early access").
- Right panel is now the role-card roster grid (PawPrint avatars, our own
roles) + "The AI crew for your team" + the claws-at-desk art.
- Updated all eight E2E signIn helpers (and the load assertions) for the new
two-step flow: fill Email → Continue → fill Password → Sign in. Labels
(Email/Password) and the "Sign in" button name are preserved.
- A11y: bumped the inactive tab text to full slate (was 3.41:1).
typecheck/lint/build green · p0-shell (full sign-in) green · p6-a11y (login
clean) green · all six @visual baselines green (login regenerated) · deployed
and verified live.
Co-Authored-By: Claude Opus 4.8 <[email protected]>
70 lines
2.6 KiB
TypeScript
70 lines
2.6 KiB
TypeScript
import { expect, test, type Page } from "@playwright/test";
|
|
|
|
// P5 exit criterion (spec §17): the full admin + billing loop — credit
|
|
// decrement matches token usage, and promo redemption grants credits.
|
|
|
|
const OWNER_EMAIL = "[email protected]";
|
|
const OWNER_PASSWORD = "e2e-password";
|
|
|
|
async function signIn(page: Page) {
|
|
await page.goto("/login");
|
|
await page.getByLabel("Email").fill(OWNER_EMAIL);
|
|
await page.getByRole("button", { name: /Continue with work email/ }).click();
|
|
await page.getByLabel("Password").fill(OWNER_PASSWORD);
|
|
await page.getByRole("button", { name: "Sign in" }).click();
|
|
await expect(page.getByRole("heading", { name: "Clawmates" })).toBeVisible();
|
|
}
|
|
|
|
async function readBalance(page: Page): Promise<number> {
|
|
await page.getByRole("link", { name: "Credits" }).click();
|
|
await expect(page.getByText("Available credits")).toBeVisible();
|
|
const text = await page.getByTestId("credit-balance").innerText();
|
|
return Number(text.replace(/,/g, ""));
|
|
}
|
|
|
|
test("chat usage decrements credits and shows in the 7-day meter", async ({
|
|
page,
|
|
}) => {
|
|
await signIn(page);
|
|
const before = await readBalance(page);
|
|
|
|
await page.getByRole("link", { name: /Scout/ }).click();
|
|
await expect(page).toHaveURL(/\/claws\/.+\/chat\//);
|
|
// Fresh session: older sessions carry scenario markers in history that
|
|
// would steer the scripted provider away from the plain echo.
|
|
const before_url = page.url();
|
|
await page.getByRole("button", { name: "New" }).click();
|
|
await page.waitForURL((url) => url.toString() !== before_url);
|
|
const box = page.getByLabel("Message Scout");
|
|
await box.fill("bill me for this message");
|
|
await box.press("Enter");
|
|
await expect(
|
|
page.getByText("I received: bill me for this message"),
|
|
).toBeVisible();
|
|
|
|
await expect
|
|
.poll(async () => readBalance(page), { timeout: 15000 })
|
|
.toBeLessThan(before);
|
|
await expect(page.getByText(/Usage · last 7 days/i)).toBeVisible();
|
|
await expect(page.getByText(/tokens \(/)).toBeVisible();
|
|
});
|
|
|
|
test("a promo code redeems exactly once", async ({ page }) => {
|
|
await signIn(page);
|
|
const before = await readBalance(page);
|
|
|
|
await page.getByLabel("Promo code").fill("WELCOME500");
|
|
await page.getByRole("button", { name: "Redeem" }).click();
|
|
await expect(page.getByText("Added 500 credits.")).toBeVisible();
|
|
await expect
|
|
.poll(async () => readBalance(page))
|
|
.toBe(before + 500);
|
|
|
|
// Second redemption refuses.
|
|
await page.getByLabel("Promo code").fill("WELCOME500");
|
|
await page.getByRole("button", { name: "Redeem" }).click();
|
|
await expect(
|
|
page.getByText("That code is invalid or already redeemed."),
|
|
).toBeVisible();
|
|
});
|