clawmates/frontend/tests/e2e/p2-approval.spec.ts

import { expect, test, type Page } from "@playwright/test";

// P2 BLOCKING exit criterion (spec §15/§17): a sensitive call is
// intercepted → previewed → queued → blocks → executes ONLY on approval →
// is audited. Runs against the real backend with the scripted provider.

const OWNER_EMAIL = "[email protected]";
const OWNER_PASSWORD = "e2e-password";
const GATED_PROMPT = "email the CEO [[scenario:gated-email]]";

async function signIn(page: Page) {
  await page.goto("/login");
  await page.getByLabel("Email").fill(OWNER_EMAIL);
  await page.getByLabel("Password").fill(OWNER_PASSWORD);
  await page.getByRole("button", { name: "Sign in" }).click();
  await expect(page.getByRole("heading", { name: "TeamClaw" })).toBeVisible();
}

async function openFreshScoutSession(page: Page) {
  await page.getByRole("link", { name: /Scout/ }).click();
  await expect(page).toHaveURL(/\/claws\/.+\/chat\//);
  // Wait for the navigation to the NEW session: the previous (possibly
  // empty) session shows the same welcome heading, so the URL is the only
  // reliable signal that the fresh session is mounted.
  const before = page.url();
  await page.getByRole("button", { name: "New" }).click();
  await page.waitForURL((url) => url.toString() !== before);
  await expect(
    page.getByRole("heading", { name: /Hi, I'm Scout/ }),
  ).toBeVisible();
}

async function triggerGatedEmail(page: Page) {
  const box = page.getByLabel("Message Scout");
  await box.fill(GATED_PROMPT);
  await box.press("Enter");
  // Intercepted + previewed: the approval card shows the EXACT payload.
  const card = page.getByRole("region", { name: "Review and approve" });
  await expect(card).toBeVisible();
  await expect(card.getByText(/wants to:/)).toContainText(
    "Send email to [email protected]",
  );
  await expect(card).toContainText("Revenue is up 14% quarter over quarter.");
  return card;
}

test("gated email blocks, previews, and executes only after approval", async ({
  page,
}) => {
  await signIn(page);
  await openFreshScoutSession(page);
  const card = await triggerGatedEmail(page);

  // Blocked: the composer is disabled while the run is suspended.
  await expect(page.getByRole("button", { name: "Send" })).toBeDisabled();

  await card.getByRole("button", { name: "Approve" }).click();

  // The continuation streams the approved execution.
  await expect(page.getByText(/The email step is finished/)).toBeVisible();
  const trace = page.getByRole("button", { name: /1 step/ });
  await trace.click();
  await expect(page.getByText(/✓ email\.send/)).toBeVisible();
  await expect(page.getByText(/"queued": ?true/)).toBeVisible();

  // The transcript and trace replay identically after reload (journal).
  await page.reload();
  await expect(page.getByText(/The email step is finished/)).toBeVisible();
  await page.getByRole("button", { name: /1 step/ }).click();
  await expect(page.getByText(/✓ email\.send/)).toBeVisible();
});

test("rejection executes nothing and the agent continues in-band", async ({
  page,
}) => {
  await signIn(page);
  await openFreshScoutSession(page);
  const card = await triggerGatedEmail(page);

  await card.getByRole("button", { name: "Reject" }).click();

  // The run completes; the step trace records the refusal, not an execution.
  await expect(page.getByText(/The email step is finished/)).toBeVisible();
  await page.getByRole("button", { name: /1 step/ }).click();
  await expect(page.getByText(/✗ email\.send/)).toBeVisible();
  await expect(page.getByText(/rejected/)).toBeVisible();
});

test("the approvals queue lists pending actions and decides them", async ({
  page,
}) => {
  await signIn(page);
  await openFreshScoutSession(page);
  await triggerGatedEmail(page);

  // Queued: the global approvals page shows the same exact preview.
  // Earlier sessions may have left pending approvals; decide them all.
  await page.getByRole("link", { name: "Approvals" }).click();
  await expect(page.getByText(/awaits? your review/)).toBeVisible();
  const cards = page.getByRole("region", { name: "Review and approve" });
  await expect(cards.first()).toContainText("Send email to [email protected]");

  const total = await cards.count();
  for (let remaining = total; remaining > 0; remaining--) {
    await cards.first().getByRole("button", { name: "Approve" }).click();
    // Wait for the refresh to apply before touching the next card.
    await expect(cards).toHaveCount(remaining - 1);
  }
  await expect(page.getByText(/All clear/)).toBeVisible();
});