feat: initial inquiry test done & refactoring

package.json

@@ -61,6 +61,7 @@
 		"lodash": "^4.17.21",
 		"markdown-draft-js": "^2.4.0",
 		"mini-css-extract-plugin": "^2.7.7",
+		"otpauth": "^9.3.6",
 		"prompts": "^2.4.2",
 		"qrcode": "^1.5.3",
 		"react": "^17.0.2",

playwright.config.ts

@@ -24,6 +24,7 @@ export default defineConfig({
 	workers: process.env.CI ? 1 : undefined,
 	/* Reporter to use. See https://playwright.dev/docs/test-reporters */
 	reporter: 'html',
+	timeout: 70 * 500,
 	/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
 	use: {
 		/* Base URL to use in actions like `await page.goto('/')`. */
@@ -38,17 +39,17 @@ export default defineConfig({
 		{
 			name: 'chromium',
 			use: { ...devices['Desktop Chrome'] }
-		},
+		}
 
-		{
-			name: 'firefox',
-			use: { ...devices['Desktop Firefox'] }
-		},
+		// {
+		// 	name: 'firefox',
+		// 	use: { ...devices['Desktop Firefox'] }
+		// },
 
-		{
-			name: 'webkit',
-			use: { ...devices['Desktop Safari'] }
-		}
+		// {
+		// 	name: 'webkit',
+		// 	use: { ...devices['Desktop Safari'] }
+		// }
 
 		/* Test against mobile viewports. */
 		// {

tests/config.ts

@@ -3,6 +3,3 @@ export const caritasRework = {
 	stage: 'https://beratung-rework-staging.caritas.de/',
 	prod: 'https://beratung.caritas.de/'
 };
-
-// write util functions here in config or in another file?
-// util functions being general checks in all registration pages and so on

tests/helpers/goToPage.ts

@@ -0,0 +1,8 @@
+import { Page } from '@playwright/test';
+import { caritasRework } from '../config';
+
+export async function goToPage(page: Page, path: string) {
+	const env = process.env.TEST_ENV || 'dev';
+	const baseURL = caritasRework[env];
+	await page.goto(`${baseURL}${path}`);
+}

tests/helpers/loginUser.ts

@@ -0,0 +1,40 @@
+import { Page } from '@playwright/test';
+import { goToPage } from '../helpers/goToPage';
+import * as OTPAuth from 'otpauth';
+
+export async function loginUser(
+	page: Page,
+	username: string,
+	password: string
+) {
+	await goToPage(page, 'login');
+	await page.fill('input[id="username"]', username);
+	await page.fill('input[id="passwordInput"]', password);
+
+	let totp = new OTPAuth.TOTP({
+		issuer: 'ACME',
+		label: 'MyTOTP',
+		algorithm: 'SHA1',
+		digits: 6,
+		period: 30,
+		secret: process.env.OTP_SECRET
+	});
+
+	const otpField = page.locator('input[id="otp"]');
+	await otpField;
+
+	// check if OTP input field exists and is visible
+	if (await otpField.isVisible()) {
+		let token = totp.generate();
+
+		if (!token) {
+			throw new Error('2FA code not found in email.');
+		}
+		// enter the 2FA code in the input field
+		await otpField.fill(token);
+	} else {
+		console.log('Skipping 2FA entry.');
+	}
+
+	await page.locator('button.button__item.button__primary').click();
+}

tests/helpers/registerUser.ts

@@ -0,0 +1,48 @@
+import { expect, Page } from '@playwright/test';
+import { goToPage } from '../helpers/goToPage';
+import { generateRandomAlphanumeric } from '../utils';
+
+export async function registerUser(page: Page) {
+	const password = process.env.TEST_PASSWORD;
+
+	// go to the registration page
+	await goToPage(page, 'registration');
+	await expect(page.locator('h1.headline--1')).toBeVisible();
+	await expect(page.locator('h4.headline--4')).toBeVisible();
+
+	// start registration
+	await page.click('a[data-cy="button-register"]');
+	await page.click('div[id="panel-Children, teenagers, adults and family"]');
+	await page.click('label[data-cy="topic-selection-radio-1"]');
+	await page.click('button[data-cy="button-next"]');
+	await page.fill('input[data-cy="input-postal-code"]', '99999');
+	await page.click('button[data-cy="button-next"]');
+
+	// select agency
+	try {
+		await page.getByText('TestAgencyA').click();
+	} catch (error) {
+		await page
+			.locator('input[name="agency-selection-radio-group"]')
+			.first()
+			.click();
+	}
+	await page.click('button[data-cy="button-next"]');
+
+	const randomUsername = `testuser_${generateRandomAlphanumeric(4)}`;
+
+	// fill in the username & password (to-do: replace getByLabel with locator by id when delete func. is done)
+	await page.getByLabel(/(user\s?name|benutzername)/i).fill(randomUsername);
+	await page
+		.getByLabel(/pass\s?(word|wort)/i, { exact: true })
+		.first()
+		.fill(password!);
+	await page
+		.getByLabel(/(passwort\s?wiederholen|repeat\s?password)/i)
+		.fill(password!);
+
+	// finish registration
+	await page.locator('input.PrivateSwitchBase-input').click();
+	await page.click('button[data-cy="button-register"]');
+	await page.locator('button.button__autoClose').click();
+}

tests/initialInquiry/initialInquiry.spec.ts

@@ -0,0 +1,90 @@
+import { expect, test } from '@playwright/test';
+import { registerUser } from '../helpers/registerUser';
+import { loginUser } from '../helpers/loginUser';
+
+test.describe.serial('Run tests in sequence', () => {
+	test('Send initial msg request', async ({ page }) => {
+		await registerUser(page);
+
+		// select counseling language (if available)
+		if (await page.locator('div.enquiryLanguageSelection').isVisible()) {
+			await handleLanguageTabs(page);
+		}
+
+		async function handleLanguageTabs(page: any) {
+			const languageTabs = page.locator(
+				'span.enquiryLanguageSelection__tab'
+			);
+			const count = await languageTabs.count();
+
+			if (count > 1) {
+				await languageTabs.nth(count - 1).click();
+			} else if (count === 1) {
+				await expect(languageTabs.first()).toBeVisible();
+			} else {
+				throw new Error('No counseling language found!');
+			}
+		}
+
+		// assert welcome msg & img
+		await expect(page.locator('div.enquiry__text')).toBeVisible();
+		await expect(
+			page.locator('h3.enquiry__infotextHeadline')
+		).toBeVisible();
+		await expect(page.locator('p.enquiry__facts')).toBeVisible();
+		await expect(page.locator('svg.enquiry__image')).toBeVisible();
+
+		// write message
+		await page.getByRole('combobox').fill('Hello there, I need help!');
+		await page.locator('rect').click();
+		await page.locator('button.button__autoClose').click();
+
+		// assert further steps info
+		await expect(page.locator('div.e2eeActivatedMessage')).toBeVisible();
+		await expect(page.locator('div.furtherSteps')).toBeVisible();
+		await expect(page.locator('ul.furtherSteps__steps')).toBeVisible();
+		await expect(
+			page.locator('p.furtherSteps__infoText').first()
+		).toBeVisible();
+
+		await page
+			.locator(
+				'div.navigation__item__bottom div.navigation__item:last-of-type'
+			)
+			.click();
+	});
+
+	test('Respond initial msg (as a consultant)', async ({ page }) => {
+		const username = process.env.TEST_CONSULTANT;
+		const password = process.env.TEST_PASSWORD;
+
+		await loginUser(page, username!, password!);
+
+		// assert user is logged in and check for initial inquiries
+		await page.waitForSelector('a[href="/profile"]');
+		await expect(page.locator('a[href="/profile"]')).toBeVisible();
+		await expect(
+			page.locator('div[id="local-switch-wrapper"]')
+		).toBeVisible();
+
+		await page.locator('a.navigation__item:first-of-type').click();
+
+		const sessionItems = page.locator('div.sessionsListItem');
+
+		if ((await sessionItems.count()) > 0) {
+			await sessionItems.last().click();
+
+			const acceptRequestButton = page.locator(
+				'div.session__acceptance button.button__primary'
+			);
+			await expect(acceptRequestButton).toBeVisible();
+			await acceptRequestButton.click();
+			await page.waitForSelector('div.overlay');
+			await page.locator(
+				'div.overlay button.button__item.button__primary'
+			);
+		} else {
+			throw new Error('No initial messages found for this consultant!');
+		}
+	});
+});

tests/login/loginAdviceSeeker.spec.ts

@@ -0,0 +1,23 @@
+import { expect, test } from '@playwright/test';
+import { loginUser } from '../helpers/loginUser';
+
+// specific login tests are not test cases but good-to-have tests (in progress)
+test.fixme('Log in as an advice seeker', async ({ page }) => {
+	const username = process.env.TEST_USERNAME;
+	const password = process.env.TEST_PASSWORD;
+
+	await loginUser(page, username!, password!);
+
+	// assert advice seeker is logged in
+	await page.locator('.sessionsList__illustration__image').click();
+
+	// log out & assert home page
+	await page
+		.locator(
+			'div.navigation__item__bottom div.navigation__item:last-of-type'
+		)
+		.click();
+	await page.waitForSelector('h1.headline--1');
+	await expect(page.locator('h1.headline--1')).toBeVisible();
+	await expect(page.locator('h4.headline--4')).toBeVisible();
+});

tests/login/loginConsultant.spec.ts

@@ -0,0 +1,24 @@
+import { expect, test } from '@playwright/test';
+import { loginUser } from '../helpers/loginUser';
+
+// specific login tests are not test cases but good-to-have tests (in progress)
+test.fixme('Log in as a consultant', async ({ page }) => {
+	const username = process.env.TEST_CONSULTANT;
+	const password = process.env.TEST_PASSWORD;
+
+	await loginUser(page, username!, password!);
+
+	// assert consultant is logged in
+	await expect(page.locator('a[href="/profile"]')).toBeVisible();
+	await expect(page.locator('div[id="local-switch-wrapper"]')).toBeVisible();
+
+	// log out & assert home page
+	await page
+		.locator(
+			'div.navigation__item__bottom div.navigation__item:last-of-type'
+		)
+		.click();
+	await page.waitForSelector('h1.headline--1');
+	await expect(page.locator('h1.headline--1')).toBeVisible();
+	await expect(page.locator('h4.headline--4')).toBeVisible();
+});