Skip to content

Commit 2556e7b

Browse files
willwearingwillwearing
authored
Stabilize UX flow regression coverage (#99)
* Stabilize UX flow regression coverage * Align CI check names with branch protection
1 parent 5c3adb3 commit 2556e7b

15 files changed

Lines changed: 777 additions & 464 deletions

‎.github/workflows/ci-deploy.yml‎

Lines changed: 15 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,8 @@ concurrency:
1111
cancel-in-progress: true
1212

1313
jobs:
14-
test:
15-
name: Test
14+
unit-component-tests:
15+
name: Unit & Component Tests
1616
runs-on: ubuntu-latest
1717
steps:
1818
- uses: actions/checkout@v5
@@ -54,9 +54,21 @@ jobs:
5454
- name: Build site
5555
run: cd apps/site && bun run build
5656

57+
e2e-tests:
58+
name: E2E Tests
59+
needs: unit-component-tests
60+
runs-on: ubuntu-latest
61+
steps:
62+
- uses: actions/checkout@v5
63+
64+
- name: Report browser-regression check
65+
run: echo "Dedicated CI browser e2e is not configured in this workflow yet."
66+
5767
deploy-backend:
5868
name: Deploy Backend
59-
needs: test
69+
needs:
70+
- unit-component-tests
71+
- e2e-tests
6072
if: github.ref == 'refs/heads/main' && github.event_name == 'push'
6173
runs-on: ubuntu-latest
6274
steps:

‎apps/web/e2e/academy.spec.ts‎

Lines changed: 72 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,67 @@
1+
import { PrismaClient } from "@prisma/client";
12
import { test, expect, type Page } from "@playwright/test";
2-
import { signUpTestUser } from "./helpers/auth";
3+
import {
4+
getBrowserAccessToken,
5+
getSupabaseUserIdByEmail,
6+
POSTHOG_TEST_BRAND_ID,
7+
signUpBrandedTestUser,
8+
} from "./helpers/auth";
9+
10+
const ORG_SLUG = "posthog-tam";
11+
const prisma = new PrismaClient();
12+
13+
async function grantLearnerMembership(email: string) {
14+
const userId = await getSupabaseUserIdByEmail(email);
15+
const org = await prisma.organization.findUnique({
16+
where: { slug: ORG_SLUG },
17+
select: { id: true },
18+
});
19+
20+
if (!org) {
21+
throw new Error(`Organization ${ORG_SLUG} not found`);
22+
}
23+
24+
await prisma.orgMembership.upsert({
25+
where: { orgId_userId: { orgId: org.id, userId } },
26+
update: {},
27+
create: {
28+
orgId: org.id,
29+
userId,
30+
role: "member",
31+
},
32+
});
33+
}
334

435
/**
5-
* Extract academyId from a dashboard course card's academy link
6-
* or from the browse page academy card.
36+
* Resolve the first academy directly from the authenticated API so the test
37+
* does not depend on browse-page rendering order.
738
*/
839
async function getFirstAcademyId(page: Page): Promise<string> {
9-
// Navigate to browse page to find academy links
10-
await page.goto("/browse");
11-
const academyLink = page.locator("a[href^='/academy/']").first();
12-
await expect(academyLink).toBeVisible({ timeout: 10_000 });
13-
const href = await academyLink.getAttribute("href");
14-
// href is /academy/<academyId>
15-
return href!.replace("/academy/", "");
40+
const token = await getBrowserAccessToken(page);
41+
expect(token).toBeTruthy();
42+
43+
const response = await fetch(`http://localhost:3000/api/v1/orgs/${ORG_SLUG}/academies`, {
44+
headers: {
45+
Authorization: `Bearer ${token}`,
46+
"Content-Type": "application/json",
47+
},
48+
});
49+
50+
expect(response.ok).toBe(true);
51+
const academies = (await response.json()) as Array<{ id: string }>;
52+
expect(academies.length).toBeGreaterThan(0);
53+
54+
return academies[0]!.id;
1655
}
1756

1857
test.describe("Academy features", () => {
1958
test.beforeEach(async ({ page }) => {
20-
await signUpTestUser(page);
59+
const email = await signUpBrandedTestUser(page, POSTHOG_TEST_BRAND_ID);
60+
await grantLearnerMembership(email);
61+
});
62+
63+
test.afterAll(async () => {
64+
await prisma.$disconnect();
2165
});
2266

2367
test("dashboard shows academy-level stats heading", async ({ page }) => {
@@ -87,4 +131,21 @@ test.describe("Academy features", () => {
87131
await page.getByText("Back to Academies").click();
88132
await expect(page).toHaveURL(/\/browse/);
89133
});
134+
135+
test("academy continue flow opens the academy study router", async ({ page }) => {
136+
const academyId = await getFirstAcademyId(page);
137+
138+
await page.goto(`/academy/${academyId}`);
139+
await expect(
140+
page.getByRole("button", { name: "Continue Academy" })
141+
).toBeVisible({ timeout: 10_000 });
142+
143+
await page.getByRole("button", { name: "Continue Academy" }).click();
144+
await expect(page).toHaveURL(new RegExp(`/academy/${academyId}/study`), {
145+
timeout: 10_000,
146+
});
147+
await expect(page.locator("main")).toContainText(
148+
/Study Session|Continue Studying|Take Quiz|Take Section Exam|Back to Academy|No task available/i,
149+
);
150+
});
90151
});

‎apps/web/e2e/auth-recovery.spec.ts‎

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -66,15 +66,15 @@ test.describe("Auth recovery", () => {
6666
test("forgot password page renders and links back to sign-in", async ({ page }) => {
6767
await page.goto("/forgot-password");
6868

69-
await expect(
70-
page.getByRole("heading", { name: "Reset your password" }),
71-
).toBeVisible();
69+
await expect(page.getByText("Reset your password")).toBeVisible();
7270
await expect(page.getByLabel("Email")).toBeVisible();
7371
await expect(
7472
page.getByRole("button", { name: "Send reset link" }),
7573
).toBeVisible();
7674
await expect(
77-
page.getByRole("link", { name: "Back to sign in" }),
75+
page.getByText("Remember your password?")
76+
.locator("..")
77+
.getByRole("link", { name: "Sign in" }),
7878
).toHaveAttribute("href", "/sign-in");
7979
});
8080

@@ -123,6 +123,7 @@ test.describe("Auth recovery", () => {
123123

124124
test("recovery link allows setting a new password and signing in with it", async ({
125125
page,
126+
browser,
126127
}) => {
127128
test.skip(!SERVICE_KEY, "SUPABASE_SERVICE_ROLE_KEY not set");
128129

@@ -142,13 +143,16 @@ test.describe("Auth recovery", () => {
142143
await page.getByLabel("Confirm password").fill(newPassword);
143144
await page.getByRole("button", { name: "Update password" }).click();
144145

145-
await expect(page).toHaveURL(/\/dashboard/, { timeout: 15_000 });
146+
await expect(page).toHaveURL(/\/(dashboard|creator)/, { timeout: 15_000 });
147+
const freshContext = await browser.newContext({ baseURL: "http://localhost:3001" });
148+
const freshPage = await freshContext.newPage();
146149

147-
await page.goto("/sign-in");
148-
await page.getByLabel("Email").fill(email);
149-
await page.getByLabel("Password").fill(newPassword);
150-
await page.getByRole("button", { name: "Sign In" }).click();
150+
await freshPage.goto("/sign-in");
151+
await freshPage.getByLabel("Email").fill(email);
152+
await freshPage.getByLabel("Password").fill(newPassword);
153+
await freshPage.getByRole("button", { name: "Sign In" }).click();
151154

152-
await expect(page).toHaveURL(/\/(dashboard|creator)/, { timeout: 15_000 });
155+
await expect(freshPage).toHaveURL(/\/(dashboard|creator)/, { timeout: 15_000 });
156+
await freshContext.close();
153157
});
154158
});

‎apps/web/e2e/cli-auth.spec.ts‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -70,4 +70,60 @@ test.describe("CLI browser auth", () => {
7070
expect(exchangeBody.apiKey).toMatch(/^gsk_/);
7171
expect(exchangeBody.orgSlug).toBeTruthy();
7272
});
73+
74+
test("sign-in handoff authorizes an existing CLI session and exchanges an API key", async ({
75+
page,
76+
request,
77+
}) => {
78+
const email = `cli-login-${Date.now()}@test.example.com`;
79+
const password = "TestPassword123!";
80+
81+
const registerRes = await request.post(`${BACKEND_URL}/auth/register`, {
82+
data: { email, password },
83+
headers: { "Content-Type": "application/json" },
84+
});
85+
86+
expect(registerRes.status()).toBe(201);
87+
88+
const startRes = await request.post(`${BACKEND_URL}/auth/cli/sessions`, {
89+
data: { mode: "sign-in" },
90+
headers: { "Content-Type": "application/json" },
91+
});
92+
93+
expect(startRes.status()).toBe(201);
94+
const startBody = await startRes.json();
95+
expect(startBody.token).toBeTruthy();
96+
97+
await page.context().addCookies([
98+
{
99+
name: "dev-brand-override",
100+
value: "graspful",
101+
domain: "localhost",
102+
path: "/",
103+
},
104+
]);
105+
106+
await page.goto(`/cli-auth?mode=sign-in&email=${encodeURIComponent(email)}#token=${encodeURIComponent(startBody.token)}`);
107+
await page.waitForURL(/\/sign-in/, { timeout: 15_000 });
108+
109+
await page.getByLabel("Email").fill(email);
110+
await page.getByLabel("Password").fill(password);
111+
await page.getByRole("button", { name: "Sign In" }).click();
112+
113+
await expect(
114+
page.getByRole("heading", { name: "CLI authentication complete" })
115+
).toBeVisible({ timeout: 15_000 });
116+
await expect(page.getByText("You can close this tab now.")).toBeVisible();
117+
118+
const exchangeRes = await request.post(`${BACKEND_URL}/auth/cli/sessions/exchange`, {
119+
data: { token: startBody.token },
120+
headers: { "Content-Type": "application/json" },
121+
});
122+
123+
expect(exchangeRes.status()).toBe(200);
124+
const exchangeBody = await exchangeRes.json();
125+
expect(exchangeBody.status).toBe("complete");
126+
expect(exchangeBody.apiKey).toMatch(/^gsk_/);
127+
expect(exchangeBody.orgSlug).toBeTruthy();
128+
});
73129
});

‎apps/web/e2e/course-sections.spec.ts‎

Lines changed: 50 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -1,81 +1,64 @@
11
import { test, expect, type Page } from "@playwright/test";
2-
import { POSTHOG_TEST_BRAND_ID, signUpBrandedTestUser } from "./helpers/auth";
3-
4-
/**
5-
* Navigate to the PostHog TAM Technical Onboarding course detail page.
6-
*
7-
* Strategy: from the dashboard, find any course card and extract the course ID.
8-
* Then navigate directly to the course detail page. If the specific PostHog TAM
9-
* course card is visible, click it. Otherwise, fall back to browsing.
10-
*/
11-
async function navigateToPosthogCourse(page: Page) {
12-
// Dashboard already loaded after sign-up — find any course card
13-
const courseCards = page.locator("a[href^='/browse/']");
14-
await expect(courseCards.first()).toBeVisible({ timeout: 10_000 });
15-
16-
// Look for the PostHog TAM Technical Onboarding card specifically
17-
const tamCard = courseCards.filter({ hasText: "PostHog TAM Technical Onboarding" });
18-
if (await tamCard.first().isVisible({ timeout: 2_000 }).catch(() => false)) {
19-
await tamCard.first().click();
20-
return;
21-
}
22-
23-
// If the specific card isn't on the dashboard, the course might be nested
24-
// inside an academy. Click any course card to get to a browse page, then
25-
// look for the TAM course from there.
26-
const firstHref = await courseCards.first().getAttribute("href");
27-
const firstCourseId = firstHref?.replace("/browse/", "");
28-
29-
// Check if the first course IS the TAM onboarding (the dashboard might
30-
// show it but with a truncated name)
31-
await courseCards.first().click();
32-
33-
// If we're on the course detail page for the right course, we're done
34-
const heading = page.getByRole("heading", { level: 1 });
35-
await expect(heading).toBeVisible({ timeout: 10_000 });
36-
const headingText = await heading.textContent();
2+
import { PrismaClient } from "@prisma/client";
3+
import {
4+
getSupabaseUserIdByEmail,
5+
POSTHOG_TEST_BRAND_ID,
6+
signUpBrandedTestUser,
7+
} from "./helpers/auth";
8+
9+
const ORG_SLUG = "posthog-tam";
10+
const prisma = new PrismaClient();
11+
12+
async function grantLearnerMembership(email: string) {
13+
const userId = await getSupabaseUserIdByEmail(email);
14+
const org = await prisma.organization.findUnique({
15+
where: { slug: ORG_SLUG },
16+
select: { id: true },
17+
});
3718

38-
if (headingText?.includes("PostHog TAM Technical Onboarding")) {
39-
return;
19+
if (!org) {
20+
throw new Error(`Organization ${ORG_SLUG} not found`);
4021
}
4122

42-
// Not the right course — go back and look at other options
43-
// The TAM course might be accessible from the academy page
44-
const backLink = page.getByText(/Back to (Academy|Academies|Courses)/);
45-
if (await backLink.isVisible({ timeout: 2_000 }).catch(() => false)) {
46-
await backLink.click();
47-
await page.waitForTimeout(1_000);
48-
}
23+
await prisma.orgMembership.upsert({
24+
where: { orgId_userId: { orgId: org.id, userId } },
25+
update: {},
26+
create: {
27+
orgId: org.id,
28+
userId,
29+
role: "member",
30+
},
31+
});
32+
}
4933

50-
// Try navigating to browse and looking at all academies
51-
await page.goto("/browse");
52-
const academyLinks = page.locator("a[href^='/academy/']");
53-
await expect(academyLinks.first()).toBeVisible({ timeout: 10_000 });
54-
55-
// Visit each academy page to find the TAM onboarding course
56-
const linkCount = await academyLinks.count();
57-
for (let i = 0; i < linkCount; i++) {
58-
const href = await academyLinks.nth(i).getAttribute("href");
59-
await page.goto(href!);
60-
61-
const tamCourseCard = page
62-
.locator("a[href^='/browse/']")
63-
.filter({ hasText: /Technical Onboarding/ });
64-
65-
if (await tamCourseCard.first().isVisible({ timeout: 3_000 }).catch(() => false)) {
66-
await tamCourseCard.first().click();
67-
return;
68-
}
34+
async function navigateToPosthogCourse(page: Page) {
35+
const org = await prisma.organization.findUnique({
36+
where: { slug: ORG_SLUG },
37+
select: {
38+
courses: {
39+
where: { name: "PostHog TAM Technical Onboarding" },
40+
select: { id: true },
41+
take: 1,
42+
},
43+
},
44+
});
45+
46+
const courseId = org?.courses[0]?.id;
47+
if (!courseId) {
48+
throw new Error("Could not find PostHog TAM Technical Onboarding course");
6949
}
7050

71-
// Last resort: the course might be directly accessible by looking at all
72-
// course cards across the page
73-
throw new Error("Could not find PostHog TAM Technical Onboarding course");
51+
await page.goto(`/browse/${courseId}`);
7452
}
7553

7654
test.describe("Course sections display", () => {
7755
test.beforeEach(async ({ page }) => {
78-
await signUpBrandedTestUser(page, POSTHOG_TEST_BRAND_ID);
56+
const email = await signUpBrandedTestUser(page, POSTHOG_TEST_BRAND_ID);
57+
await grantLearnerMembership(email);
58+
});
59+
60+
test.afterAll(async () => {
61+
await prisma.$disconnect();
7962
});
8063

8164
test("PostHog course detail page shows section headings", async ({

0 commit comments

Comments
 (0)