Skip to content

Commit d213cf4

Browse files
kamdubielkamdubiel
committed
Frontend E2E reusability refactor
1 parent e99fb9a commit d213cf4

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

57 files changed

+831
-480
lines changed

‎.gitignore‎

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -30,10 +30,3 @@ next-env.d.ts
3030
# Logs
3131
*storybook.log
3232
pnpm-debug.log*
33-
34-
# Playwright
35-
/test-results/
36-
/playwright-report/
37-
/playwright/.cache/
38-
/reports/
39-
.last-run.json

‎apps/frontend-e2e/.gitignore‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
# Playwright artifacts (keep snapshots committed)
2+
/test-results/
3+
/playwright-report/
4+
/reports/
5+
/playwright/.cache/
6+
.last-run.json
7+
/artifacts/

‎apps/frontend-e2e/.prettierignore‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
# Dependencies
2+
node_modules/
3+
4+
# Cache
5+
.turbo/
6+
7+
# Playwright artifacts
8+
**/test-results/
9+
**/playwright-report/
10+
**/reports/

‎apps/frontend-e2e/.prettierrc.js‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
const baseConfig = require('@infinum/configs/prettier');
2+
3+
/** @type {import('prettier').Config} */
4+
module.exports = {
5+
...baseConfig,
6+
};

‎apps/frontend-e2e/README.md‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
# E2E Testing with Playwright
2+
3+
This package contains end-to-end tests for the frontend application using Playwright.
4+
5+
For setup, commands, artifact locations (playwright-report, reports, test-results), and debugging notes, see the central guide:
6+
7+
[`documentation/E2E Testing.md`](../../documentation/E2E%20Testing.md)

‎apps/frontend-e2e/eslint.config.mjs‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import baseConfig from '@infinum/configs/eslint/base';
2+
import playwrightConfig from '@infinum/configs/eslint/playwright';
3+
import typescriptConfig from '@infinum/configs/eslint/typescript';
4+
5+
export default [
6+
...baseConfig,
7+
...typescriptConfig,
8+
...playwrightConfig,
9+
{
10+
files: ['**/*.ts', '**/*.tsx'],
11+
languageOptions: {
12+
parserOptions: {
13+
project: './tsconfig.json',
14+
tsconfigRootDir: import.meta.dirname,
15+
},
16+
},
17+
},
18+
];

packages/e2e-frontend/home.spec.ts-snapshots/reports-screenshots-chromium-home-en-e2e-frontend-darwin.png renamed to apps/frontend-e2e/home.spec.ts-snapshots/reports-screenshots-chromium-home-en-e2e-frontend-darwin.png

File renamed without changes.

‎apps/frontend-e2e/package.json‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
{
2+
"name": "@infinum/frontend-e2e",
3+
"version": "0.0.0",
4+
"private": true,
5+
"scripts": {
6+
"check-licenses": "node ../../scripts/check-licenses-workspace.js",
7+
"clean": "rm -rf node_modules .turbo .eslintcache",
8+
"e2e": "playwright test --reporter=html",
9+
"e2e:install": "playwright install",
10+
"e2e:report": "playwright show-report",
11+
"lint": "eslint . --cache",
12+
"lint:fix": "eslint . --cache --fix",
13+
"prettier:check": "prettier --check .",
14+
"prettier:fix": "prettier --write ."
15+
},
16+
"devDependencies": {
17+
"@axe-core/playwright": "catalog:",
18+
"@infinum/configs": "workspace:*",
19+
"@infinum/e2e-utils": "workspace:*",
20+
"@playwright/test": "catalog:",
21+
"@types/node": "catalog:",
22+
"axe-core": "catalog:",
23+
"axe-html-reporter": "catalog:",
24+
"eslint": "catalog:",
25+
"prettier": "catalog:",
26+
"typescript": "catalog:"
27+
}
28+
}

packages/e2e-frontend/pages/login.ts renamed to apps/frontend-e2e/pages/login.ts

Lines changed: 9 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
import { Page, Locator } from '@playwright/test';
2+
import { BasePage } from '@infinum/e2e-utils/pages';
23

3-
export class LoginPage {
4-
readonly page: Page;
4+
export class LoginPage extends BasePage {
55
readonly emailInput: Locator;
66
readonly passwordInput: Locator;
77
readonly submitButton: Locator;
88
readonly errorMessage: Locator;
99

1010
constructor(page: Page) {
11-
this.page = page;
11+
super(page);
1212

1313
// Semantic locators
1414
this.emailInput = page.getByLabel('Email');
@@ -18,27 +18,21 @@ export class LoginPage {
1818
}
1919

2020
async goto() {
21-
await this.page.goto('/en/login');
22-
23-
// Wait for page to be fully loaded
24-
await this.page.waitForLoadState('networkidle');
21+
await this.navigateTo('/en/login');
22+
await this.waitForLoad();
2523
}
2624

2725
async login(email: string, password: string) {
2826
// Check if form elements are available
29-
await this.emailInput.waitFor({ state: 'visible', timeout: 10000 });
30-
await this.passwordInput.waitFor({ state: 'visible', timeout: 10000 });
31-
await this.submitButton.waitFor({ state: 'visible', timeout: 10000 });
27+
await this.waitForVisible(this.emailInput);
28+
await this.waitForVisible(this.passwordInput);
29+
await this.waitForVisible(this.submitButton);
3230

3331
await this.emailInput.fill(email);
34-
3532
await this.passwordInput.fill(password);
36-
3733
await this.submitButton.click();
3834

3935
// Wait for navigation to complete
40-
try {
41-
await this.page.waitForLoadState('networkidle', { timeout: 15000 });
42-
} catch (error) {}
36+
await this.waitForNavigation();
4337
}
4438
}

‎apps/frontend-e2e/playwright.config.ts‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
import baseConfig from '@infinum/configs/playwright/base';
2+
import { defineConfig, devices } from '@playwright/test';
3+
4+
export default defineConfig({
5+
...baseConfig,
6+
testDir: './tests',
7+
projects: [
8+
{
9+
name: 'chromium',
10+
use: {
11+
...devices['Desktop Chrome'],
12+
baseURL: process.env.E2E_BASE_URL ?? 'http://localhost:3000',
13+
},
14+
},
15+
],
16+
webServer: process.env.CI
17+
? {
18+
command: 'pnpm --filter @infinum/frontend dev',
19+
port: 3000,
20+
reuseExistingServer: !process.env.CI,
21+
}
22+
: undefined,
23+
});

0 commit comments

Comments
 (0)