test: write login page tests

.github/workflows/playwright.yml

@@ -83,5 +83,5 @@ jobs:
         if: always()
         with:
           name: playwright-report
-          path: ./packages/e2e-tests/test-results/
+          path: ./packages/e2e-tests/test-results/**/*
           retention-days: 30

packages/e2e-tests/fixtures/index.js

@@ -8,7 +8,11 @@ const { LoginPage } = require('./login-page');
 
 exports.test = test.extend({
   page: async ({ page }, use) => {
-    await new LoginPage(page).login();
+    const loginPage = new LoginPage(page);
+    await loginPage.login();
+
+    await expect(loginPage.loginButton).not.toBeVisible();
+    await expect(page).toHaveURL('/flows');
 
     await use(page);
   },
@@ -29,6 +33,19 @@ exports.test = test.extend({
   },
 });
 
+exports.publicTest = test.extend({
+  page: async ({ page }, use) => {
+    await use(page);
+  },
+  loginPage: async ({ page }, use) => {
+    const loginPage = new LoginPage(page);
+
+    await loginPage.open();
+
+    await use(loginPage);
+  },
+});
+
 expect.extend({
   toBeClickableLink: async (locator) => {
     await expect(locator).not.toHaveAttribute('aria-disabled', 'true');

packages/e2e-tests/fixtures/login-page.js

@@ -17,13 +17,18 @@ export class LoginPage extends BasePage {
     this.loginButton = this.page.getByTestId('login-button');
   }
 
-  async login() {
+  async open() {
+    return await this.page.goto(this.path);
+  }
+
+  async login(
+    email = process.env.LOGIN_EMAIL,
+    password = process.env.LOGIN_PASSWORD
+  ) {
     await this.page.goto(this.path);
-    await this.emailTextField.fill(process.env.LOGIN_EMAIL);
-    await this.passwordTextField.fill(process.env.LOGIN_PASSWORD);
+    await this.emailTextField.fill(email);
+    await this.passwordTextField.fill(password);
 
     await this.loginButton.click();
-
-    await expect(this.loginButton).not.toBeVisible();
   }
 }

packages/e2e-tests/tests/authentication/login.spec.js

@@ -0,0 +1,22 @@
+// @ts-check
+const { publicTest, test, expect } = require('../../fixtures/index');
+
+publicTest.describe('Login page', () => {
+  publicTest('shows login form', async ({ loginPage }) => {
+    await loginPage.emailTextField.waitFor({ state: 'attached' });
+    await loginPage.passwordTextField.waitFor({ state: 'attached' });
+    await loginPage.loginButton.waitFor({ state: 'attached' });
+  });
+
+  publicTest('lets user login', async ({ loginPage }) => {
+    await loginPage.login();
+
+    await expect(loginPage.page).toHaveURL('/flows');
+  });
+
+  publicTest(`doesn't let un-existing user login`, async ({ loginPage }) => {
+    await loginPage.login('nonexisting@automatisch.io', 'sample');
+
+    await expect(loginPage.page).toHaveURL('/login');
+  });
+});