Omar SobhandClaude Fable 5
200bb56299
A new (marketing) route group with its own LIGHT layout (slate palette +
marketing coral #E95656 + periwinkle cards on near-white), the inverse of
the dark app. The middleware rewrites '/' → /marketing for logged-out
visitors (keyed on the session cookie / Clerk __session); authed users
fall through to the workspace app unchanged.
Built to the measured marketing system with OUR copy and honest claims —
NO SOC 2 / compliance badges: floating white pill nav, the 75px/800/-3px
display hero with a single coral keyword span, dual pill CTAs (coral
primary / white-bordered secondary), trust badges ('free credits',
'no credit card', 'self-hostable & air-gapped'), periwinkle feature
cards, a structural-security section (approval-gated, broker-held creds,
air-gappable — our real differentiators), an interactive FAQ accordion,
CTA band, and footer.
E2E (p7-marketing): renders for logged-out visitors, FAQ accordion works,
asserts NO SOC 2 claim, and an axe pass (coral CTAs sized to clear the
AA large-text threshold). p0-shell updated: logged-out '/' now shows
marketing with a Sign-in link to /login.
Co-Authored-By: Claude Fable 5 <[email protected]>
43 lines
1.5 KiB
TypeScript
43 lines
1.5 KiB
TypeScript
import AxeBuilder from "@axe-core/playwright";
|
|
import { expect, test } from "@playwright/test";
|
|
|
|
// R5: the public marketing landing serves at "/" for logged-out visitors
|
|
// (middleware rewrite → /marketing), with our brand and honest claims.
|
|
|
|
test("the marketing landing renders for logged-out visitors @marketing", async ({
|
|
page,
|
|
context,
|
|
}) => {
|
|
await context.clearCookies();
|
|
await page.goto("/");
|
|
// Hero + nav + our wordmark.
|
|
await expect(
|
|
page.getByRole("heading", { name: /AI coworkers/ }),
|
|
).toBeVisible();
|
|
await expect(
|
|
page.getByRole("link", { name: "Get started for free" }).first(),
|
|
).toBeVisible();
|
|
// FAQ accordion: the first item is open by default; expand another.
|
|
await expect(page.getByText(/A claw is an AI coworker/)).toBeVisible();
|
|
await page.getByRole("button", { name: /run it on my own/i }).click();
|
|
await expect(page.getByText(/air-gapped/i).first()).toBeVisible();
|
|
// No SOC 2 / compliance claims (we don't make them).
|
|
await expect(page.getByText(/SOC 2/i)).toHaveCount(0);
|
|
});
|
|
|
|
test("the marketing landing is accessible @marketing", async ({
|
|
page,
|
|
context,
|
|
}) => {
|
|
await context.clearCookies();
|
|
await page.goto("/");
|
|
await page.evaluate(() =>
|
|
Promise.allSettled(document.getAnimations().map((a) => a.finished)),
|
|
);
|
|
const results = await new AxeBuilder({ page }).analyze();
|
|
const blocking = results.violations.filter(
|
|
(v) => v.impact === "serious" || v.impact === "critical",
|
|
);
|
|
expect(blocking.map((v) => v.id)).toEqual([]);
|
|
});
|