From 051e16301c755f9d69632b4b342532410d957ccf Mon Sep 17 00:00:00 2001
From: phoebus-84 <ennio@dyne.org>
Date: Fri, 18 Oct 2024 15:32:00 +0200
Subject: [PATCH] tests: refactor wallet page

---
 tests/fixtures/WalletPage.ts | 53 ++++++++++++++++++++++++++++++++++++
 tests/register.spec.ts       |  4 +--
 tests/wallet.spec.ts         | 27 ++++++++----------
 3 files changed, 67 insertions(+), 17 deletions(-)
 create mode 100644 tests/fixtures/WalletPage.ts

diff --git a/tests/fixtures/WalletPage.ts b/tests/fixtures/WalletPage.ts
new file mode 100644
index 00000000..8520abb4
--- /dev/null
+++ b/tests/fixtures/WalletPage.ts
@@ -0,0 +1,53 @@
+// WalletPage.ts
+import { type Page, type Locator, expect } from '@playwright/test';
+
+export class WalletPage {
+	private readonly page: Page;
+	private readonly walletHeading: Locator;
+	private readonly credentialsHeading: Locator;
+	private readonly credentialsDescription: Locator;
+	private readonly emptyStateHeading: Locator;
+	private readonly emptyStateDescription: Locator;
+	private readonly getCredentialsButton: Locator;
+	private readonly credentialCard: Locator;
+	private readonly credentialLink: Locator;
+
+	constructor(page: Page) {
+		this.page = page;
+		this.walletHeading = page.getByText('WALLET').first();
+		this.credentialsHeading = page.getByText('My credentials').first();
+		this.credentialsDescription = page.locator('d-text p');
+		this.emptyStateHeading = page.locator(
+			'd-heading:has-text("There is no Credential in your wallet")'
+		);
+		this.emptyStateDescription = page.locator('d-text:has-text("Get your first credential")');
+		this.getCredentialsButton = page.locator('d-button:has-text("GET CREDENTIALS")');
+		this.credentialCard = page.locator('d-credential-card');
+		this.credentialLink = page.locator('button[class*="relative"]').first();
+	}
+
+	async verifyWalletPage() {
+		await expect(this.page).toHaveURL('/en/wallet');
+		await expect(this.walletHeading).toBeVisible();
+	}
+
+	async verifyCredentialsHeadingAndDescription() {
+		await expect(this.credentialsHeading).toBeVisible();
+		await expect(this.credentialsDescription).toContainText('Explore and manage your credentials');
+	}
+
+	async verifyEmptyState() {
+		await expect(this.emptyStateHeading).toBeVisible();
+		await expect(this.emptyStateDescription).toBeVisible();
+		await expect(this.getCredentialsButton).toBeVisible();
+	}
+
+	async verifyCredentialsVisible() {
+		await expect(this.credentialCard.first()).toBeVisible();
+	}
+
+	async clickFirstCredential() {
+		await this.credentialLink.click();
+		await expect(this.page).toHaveURL(/\/credential-detail$/);
+	}
+}
diff --git a/tests/register.spec.ts b/tests/register.spec.ts
index bc1623f7..3b991ee3 100644
--- a/tests/register.spec.ts
+++ b/tests/register.spec.ts
@@ -72,9 +72,9 @@ test.describe('Security Questions Page', () => {
 		await securityQuestionsPage.fillQuestionTwo('Buddy');
 		await securityQuestionsPage.fillQuestionThree('New York');
 		await securityQuestionsPage.clickNext();
-		await page.waitForTimeout(10000);
+		await page.waitForTimeout(5000);
 
-		// await securityQuestionsPage.expectKeyringGenerated();
+		await securityQuestionsPage.expectKeyringGenerated();
 		await securityQuestionsPage.verifyKeyringAndDID();
 	});
 });
diff --git a/tests/wallet.spec.ts b/tests/wallet.spec.ts
index 78095230..e9870984 100644
--- a/tests/wallet.spec.ts
+++ b/tests/wallet.spec.ts
@@ -1,26 +1,24 @@
-import { expect, test } from '@playwright/test';
+import { test } from '@playwright/test';
 import { addCredentialsToLocalStorage, login, tabBarClick } from './utils';
+import { WalletPage } from './fixtures/WalletPage';
 
 test.describe('Wallet Page', () => {
 	test('should load wallet page after login', async ({ page }) => {
 		await login(page);
-		await expect(page).toHaveURL('/en/wallet');
-		await expect(page.getByText('WALLET').first()).toBeVisible();
+		const walletPage = new WalletPage(page);
+		await walletPage.verifyWalletPage();
 	});
 
 	test('should display heading and description', async ({ page }) => {
 		await login(page);
-		await expect(page.getByText('My credentials').first()).toBeVisible();
-		await expect(page.locator('d-text p')).toContainText('Explore and manage your credentials');
+		const walletPage = new WalletPage(page);
+		await walletPage.verifyCredentialsHeadingAndDescription();
 	});
 
 	test('should show empty state when no credentials', async ({ page }) => {
 		await login(page);
-		await expect(
-			page.locator('d-heading:has-text("There is no Credential in your wallet")')
-		).toBeVisible();
-		await expect(page.locator('d-text:has-text("Get your first credential")')).toBeVisible();
-		await expect(page.locator('d-button:has-text("GET CREDENTIALS")')).toBeVisible();
+		const walletPage = new WalletPage(page);
+		await walletPage.verifyEmptyState();
 	});
 
 	test('should list credentials if available', async ({ page }) => {
@@ -28,8 +26,8 @@ test.describe('Wallet Page', () => {
 		await addCredentialsToLocalStorage(page);
 		await tabBarClick('Home', page);
 		await tabBarClick('Wallet', page);
-		const credentialLocator = page.locator('d-credential-card');
-		await expect(credentialLocator.first()).toBeVisible();
+		const walletPage = new WalletPage(page);
+		await walletPage.verifyCredentialsVisible();
 	});
 
 	test('should navigate to credential detail on click', async ({ page }) => {
@@ -37,8 +35,7 @@ test.describe('Wallet Page', () => {
 		await addCredentialsToLocalStorage(page);
 		await tabBarClick('Home', page);
 		await tabBarClick('Wallet', page);
-		const credentialLink = page.locator('button[class*="relative"]').first();
-		await credentialLink.click();
-		await expect(page).toHaveURL(/\/credential-detail$/);
+		const walletPage = new WalletPage(page);
+		await walletPage.clickFirstCredential();
 	});
 });