From 64c736db8fd4c6128b1a396efec6225359a24a9b Mon Sep 17 00:00:00 2001 From: Milan Gruner Date: Thu, 25 Apr 2024 14:59:24 +0200 Subject: [PATCH 1/5] feat(e2e): add login e2e tests and extract helper methods into separate file --- app/cypress/e2e/login.cy.ts | 33 ------------------- app/e2e/helpers.ts | 28 ++++++++++++++++ app/e2e/login.spec.ts | 66 +++++++++++++++++++++++++++++++++++++ app/e2e/signup.spec.ts | 7 ++-- 4 files changed, 96 insertions(+), 38 deletions(-) delete mode 100644 app/cypress/e2e/login.cy.ts create mode 100644 app/e2e/helpers.ts create mode 100644 app/e2e/login.spec.ts diff --git a/app/cypress/e2e/login.cy.ts b/app/cypress/e2e/login.cy.ts deleted file mode 100644 index b42756217..000000000 --- a/app/cypress/e2e/login.cy.ts +++ /dev/null @@ -1,33 +0,0 @@ -describe("Login page", () => { - it("redirects to dashboard after entering correct data", () => { - const email = "login-test@openearth.org"; - const password = "Test123!"; - cy.signup(email, password); - cy.intercept("GET", "/api/auth/session").as("session"); - - cy.visit("/auth/login"); - cy.contains("Log In"); - cy.get('input[name="email"]').type(email, { log: false }); - cy.get('input[name="password"]').type(password, { log: false }); - cy.get('button[type="submit"]').click(); - - cy.wait("@session"); - - // TODO this doesn't work on the `npm run build` version, but only in Cypress - // cy.url().should("equal", Cypress.config().baseUrl + "/en"); - // cy.contains("Welcome Back,"); - }); - - it("shows errors when entering invalid data", () => { - cy.visit("/auth/login"); - cy.contains("Log In"); - - cy.get('input[name="email"]').type("testopenearthorg"); - cy.get('input[name="password"]').type("pas"); - cy.get('button[type="submit"]').click(); - - cy.url().should("equal", Cypress.config().baseUrl + "/en/auth/login"); - cy.contains("valid email address"); - cy.contains("Minimum length"); - }); -}); diff --git a/app/e2e/helpers.ts b/app/e2e/helpers.ts new file mode 100644 index 000000000..e502dfad1 --- /dev/null +++ b/app/e2e/helpers.ts @@ -0,0 +1,28 @@ +import { expect, type Page, APIRequestContext } from "@playwright/test"; + +export async function expectText(page: Page, text: string) { + await expect(page.getByText(text)).toBeVisible(); +} + +export async function signup( + request: APIRequestContext, + email: string, + password: string = "Test123", + confirmPassword: string = "Test123", + name: string = "Test Account", + inviteCode: string = "123456", + acceptTerms: boolean = true, +) { + const result = await request.post("/api/v0/auth/signup", { + data: { + email, + password, + confirmPassword, + name, + inviteCode, + acceptTerms, + }, + }); + expect(result.ok()).toBeTruthy(); + return await result.json(); +} diff --git a/app/e2e/login.spec.ts b/app/e2e/login.spec.ts new file mode 100644 index 000000000..aa057d970 --- /dev/null +++ b/app/e2e/login.spec.ts @@ -0,0 +1,66 @@ +import { test, expect, APIRequestContext } from "@playwright/test"; +import { expectText } from "./helpers"; + +async function signup( + request: APIRequestContext, + email: string, + password: string = "Test123", + confirmPassword: string = "Test123", + name: string = "Test Account", + inviteCode: string = "123456", + acceptTerms: boolean = true, +) { + const result = await request.post("/api/v0/auth/signup", { + data: { + email, + password, + confirmPassword, + name, + inviteCode, + acceptTerms, + }, + }); + expect(result.ok()).toBeTruthy(); + return await result.json(); +} + +test.beforeEach(async ({ page }) => { + await page.goto("/en/auth/login"); +}); + +test.describe("Login page", () => { + test("redirects to dashboard after entering correct data", async ({ + page, + request, + }) => { + const email = "login-test@openearth.org"; + const password = "Test123!"; + await signup(request, email, password); + // await page.route("/api/auth/session", (route) => { + // route.fulfill({ body: JSON.stringify({ ok: true }) }); + // }); + + await expectText(page, "Log In"); + await page.locator('input[name="email"]').fill(email); + await page.locator('input[name="password"]').fill(password); + await page.locator('button[type="submit"]').click(); + + // TODO how to ensure that session route was called? + await page.waitForResponse("/api/auth/session"); + + await expect(page).toHaveURL("/en/"); + await expectText(page, "Welcome Back,"); + }); + + test("shows errors when entering invalid data", async ({ page }) => { + await expectText(page, "Log In"); + + await page.locator('input[name="email"]').fill("testopenearthorg"); + await page.locator('input[name="password"]').fill("pas"); + await page.locator('button[type="submit"]').click(); + + await expect(page).toHaveURL("/en/auth/login"); + await expectText(page, "valid email address"); + await expectText(page, "Minimum length"); + }); +}); diff --git a/app/e2e/signup.spec.ts b/app/e2e/signup.spec.ts index ab90d70bb..c147cdb29 100644 --- a/app/e2e/signup.spec.ts +++ b/app/e2e/signup.spec.ts @@ -1,9 +1,6 @@ -import { test, expect, type Page } from "@playwright/test"; +import { test, expect } from "@playwright/test"; import { randomUUID } from "node:crypto"; - -async function expectText(page: Page, text: string) { - await expect(page.getByText(text)).toBeVisible(); -} +import { expectText } from "./helpers"; test.beforeEach(async ({ page }) => { await page.goto("/en/auth/signup"); From a593e6fff4a69f4615813fd81f69c6cccc9a07c4 Mon Sep 17 00:00:00 2001 From: Milan Gruner Date: Thu, 25 Apr 2024 14:59:47 +0200 Subject: [PATCH 2/5] fix(script): wrong database details in start-db.sh --- app/scripts/start-db.sh | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/app/scripts/start-db.sh b/app/scripts/start-db.sh index b06bdeda2..d55813ec6 100755 --- a/app/scripts/start-db.sh +++ b/app/scripts/start-db.sh @@ -1,8 +1,8 @@ #!/bin/bash -DB_USER="${POSTGRES_USER:=postgres}" -DB_PASSWORD="${POSTGRES_PASSWORD:=citycatalyst}" -DB_NAME="${POSTGRES_DB:=development}" +DB_USER="${POSTGRES_USER:=citycatalyst}" +DB_PASSWORD="${POSTGRES_PASSWORD:=development}" +DB_NAME="${POSTGRES_DB:=citycatalyst}" DB_PORT="${POSTGRES_PORT:=5432}" DB_HOST="${POSTGRES_HOST:=localhost}" From 4d85a7c5f2a9d7bf851b4d37037e739d07902100 Mon Sep 17 00:00:00 2001 From: Milan Gruner Date: Thu, 25 Apr 2024 15:00:03 +0200 Subject: [PATCH 3/5] feat(docs): add reference to start-db.sh to README.md --- app/README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/app/README.md b/app/README.md index b72d1d6a7..30a2eabc8 100644 --- a/app/README.md +++ b/app/README.md @@ -23,6 +23,7 @@ npm install ### Database You'll need to run a [PostgreSQL](https://www.postgresql.org/) database, locally or remotely. +For a quick setup, run `scripts/start-db.sh`, which will launch a PostgreSQL docker image with the right configuration. You'll need access to the `psql`, `createuser`, and `createdb` commands. From 719b81bf1ed96a6e5234811ba74f076c00b7cba8 Mon Sep 17 00:00:00 2001 From: Milan Gruner Date: Thu, 25 Apr 2024 15:59:26 +0200 Subject: [PATCH 4/5] fix(e2e): remaining errors in login e2e tests --- app/e2e/login.spec.ts | 21 +++++++++++---------- 1 file changed, 11 insertions(+), 10 deletions(-) diff --git a/app/e2e/login.spec.ts b/app/e2e/login.spec.ts index aa057d970..72aa0f024 100644 --- a/app/e2e/login.spec.ts +++ b/app/e2e/login.spec.ts @@ -1,16 +1,17 @@ import { test, expect, APIRequestContext } from "@playwright/test"; import { expectText } from "./helpers"; +import { randomUUID } from "node:crypto"; async function signup( request: APIRequestContext, email: string, - password: string = "Test123", - confirmPassword: string = "Test123", + password: string = "Test123!", + confirmPassword: string = "Test123!", name: string = "Test Account", inviteCode: string = "123456", acceptTerms: boolean = true, ) { - const result = await request.post("/api/v0/auth/signup", { + const result = await request.post("/api/v0/auth/register", { data: { email, password, @@ -20,6 +21,7 @@ async function signup( acceptTerms, }, }); + console.log("Signup res", await result.text()); expect(result.ok()).toBeTruthy(); return await result.json(); } @@ -29,18 +31,18 @@ test.beforeEach(async ({ page }) => { }); test.describe("Login page", () => { - test("redirects to dashboard after entering correct data", async ({ + test("redirects to onboarding after entering correct data", async ({ page, request, }) => { - const email = "login-test@openearth.org"; + const email = `login-test+${randomUUID()}@openearth.org`; const password = "Test123!"; - await signup(request, email, password); + await signup(request, email, password, password); // await page.route("/api/auth/session", (route) => { // route.fulfill({ body: JSON.stringify({ ok: true }) }); // }); - await expectText(page, "Log In"); + await expectText(page, "Log In to City Catalyst"); await page.locator('input[name="email"]').fill(email); await page.locator('input[name="password"]').fill(password); await page.locator('button[type="submit"]').click(); @@ -48,12 +50,11 @@ test.describe("Login page", () => { // TODO how to ensure that session route was called? await page.waitForResponse("/api/auth/session"); - await expect(page).toHaveURL("/en/"); - await expectText(page, "Welcome Back,"); + await expect(page).toHaveURL("/en/onboarding"); }); test("shows errors when entering invalid data", async ({ page }) => { - await expectText(page, "Log In"); + await expectText(page, "Log In to City Catalyst"); await page.locator('input[name="email"]').fill("testopenearthorg"); await page.locator('input[name="password"]').fill("pas"); From 3945c3c52fc75bafa7ab5965ffbd509d18ffe521 Mon Sep 17 00:00:00 2001 From: Milan Gruner Date: Thu, 25 Apr 2024 16:02:08 +0200 Subject: [PATCH 5/5] fix(docs): clarify start-sh.sh section in README.md --- app/README.md | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/app/README.md b/app/README.md index 30a2eabc8..50f2f23c0 100644 --- a/app/README.md +++ b/app/README.md @@ -22,8 +22,9 @@ npm install ### Database +For a quick setup, run `scripts/start-db.sh`, which will launch a PostgreSQL Docker image with the right configuration. Otherwise continue below ⬇️ + You'll need to run a [PostgreSQL](https://www.postgresql.org/) database, locally or remotely. -For a quick setup, run `scripts/start-db.sh`, which will launch a PostgreSQL docker image with the right configuration. You'll need access to the `psql`, `createuser`, and `createdb` commands.