Add failing test

frontend/tests/components/authenticatedDrawer.ts

@@ -0,0 +1,19 @@
+import {type Locator, type Page} from '@playwright/test';
+import {BaseComponent} from './baseComponent';
+import {LoginPage} from '../pages/loginPage';
+
+export class AuthenticatedDrawer extends BaseComponent {
+
+  get logoutLink(): Locator {
+    return this.componentLocator.getByRole('link', { name: 'Log out' });
+  }
+
+  constructor(page: Page) {
+    super(page, page.locator(`.drawer .drawer-side:has-text("Log out")`));
+  }
+
+  async logout(): Promise<LoginPage> {
+    await this.logoutLink.click();
+    return new LoginPage(this.page).waitFor();
+  }
+}

frontend/tests/logout.test.ts

@@ -0,0 +1,12 @@
+import {AdminDashboardPage} from './pages/adminDashboardPage';
+import {loginAs} from './utils/authHelpers';
+import {test} from './fixtures';
+
+test('Back button after logout redirects back to login page', async ({page}) => {
+  await loginAs(page.request, 'admin');
+  const adminPage = await new AdminDashboardPage(page).goto();
+  const drawer = await adminPage.openDrawer();
+  const loginPage = await drawer.logout();
+  await page.goBack();
+  await loginPage.waitFor();
+});

frontend/tests/pages/authenticatedBasePage.ts

@@ -1,21 +1,32 @@
-import type { Locator, Page } from '@playwright/test';
-import { BasePage } from './basePage';
-import { EmailVerificationAlert } from '../components/emailVerificationAlert';
+import type {Locator, Page} from '@playwright/test';
+
+import {AuthenticatedDrawer} from '../components/authenticatedDrawer';
+import {BasePage} from './basePage';
+import {EmailVerificationAlert} from '../components/emailVerificationAlert';
 
 export class AuthenticatedBasePage extends BasePage {
   readonly emailVerificationAlert: EmailVerificationAlert;
 
+  private drawerToggle: Locator;
+
   constructor(page: Page, locator: Locator | Locator[], url?: string) {
+    const drawerToggle = page.locator('label .i-mdi-account-circle');
     if (Array.isArray(locator)) {
-      locator = [page.locator('label .i-mdi-account-circle'), ...locator];
+      locator = [drawerToggle, ...locator];
     } else {
-      locator = [page.locator('label .i-mdi-account-circle'), locator];
+      locator = [drawerToggle, locator];
     }
     super(page, locator, url);
+    this.drawerToggle = drawerToggle;
     this.emailVerificationAlert = new EmailVerificationAlert(page);
   }
 
   clickHome(): Promise<void> {
     return this.page.locator('.breadcrumbs').getByRole('link', {name: 'Home'}).click();
   }
+
+  async openDrawer(): Promise<AuthenticatedDrawer> {
+    await this.drawerToggle.click();
+    return new AuthenticatedDrawer(this.page).waitFor();
+  }
 }