1207 lines
49 KiB
TypeScript
1207 lines
49 KiB
TypeScript
|
import { test, expect } from '@playwright/test';
|
||
|
|
import { login } from './helpers/auth';
|
||
|
|
import { epic, feature, severity, description, tag } from './helpers/allure';
|
||
|
|
import { navigateToManagement, navigateToTerminals } from './helpers/navigation';
|
||
|
|
import * as fs from 'fs';
|
||
|
|
|
||
|
|
test.describe('Management Tests', () => {
|
||
|
|
test.setTimeout(120000);
|
||
|
|
test.beforeEach(async ({ page }) => {
|
||
|
|
epic('Management');
|
||
|
|
await login(page);
|
||
|
|
await navigateToManagement(page);
|
||
|
|
await page.waitForTimeout(2000);
|
||
|
|
});
|
||
|
|
|
||
|
|
test('should add a new cashier user', async ({ page }) => {
|
||
|
|
test.setTimeout(120000);
|
||
|
|
feature('Management Operations');
|
||
|
|
tag('functional');
|
||
|
|
severity('critical');
|
||
|
|
description('Add a new cashier user by filling the form, selecting branch, role, and an unassociated terminal ID');
|
||
|
|
|
||
|
|
const timestamp = Date.now();
|
||
|
|
const fullName = `Test Cashier ${timestamp}`;
|
||
|
|
const username = `cashier${timestamp}`;
|
||
|
|
const password = 'Mav@1234';
|
||
|
|
|
||
|
|
// First, go to terminals page to find an unassociated terminal ID
|
||
|
|
let freeTerminalId = '';
|
||
|
|
|
||
|
|
await test.step('Find unassociated terminal from Terminals page', async () => {
|
||
|
|
// Navigate to terminals page to find a free terminal
|
||
|
|
await navigateToTerminals(page);
|
||
|
|
await page.waitForTimeout(5000);
|
||
|
|
|
||
|
|
const tableVisible = await page.locator('table tbody tr').first().isVisible({ timeout: 15000 }).catch(() => false);
|
||
|
|
if (!tableVisible) {
|
||
|
|
console.log('Terminal table not loaded, skipping terminal lookup');
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
const headers = await page.locator('table thead th').allTextContents();
|
||
|
|
console.log('Terminal table headers:', headers);
|
||
|
|
|
||
|
|
// Find Cashier column index and Terminal Id column index
|
||
|
|
const cashierColIdx = headers.findIndex(h => h.toLowerCase().includes('cashier') && !h.toLowerCase().includes('id') && !h.toLowerCase().includes('username'));
|
||
|
|
const terminalIdColIdx = headers.findIndex(h => h.toLowerCase().includes('terminal id'));
|
||
|
|
console.log(`Cashier col: ${cashierColIdx}, Terminal Id col: ${terminalIdColIdx}`);
|
||
|
|
|
||
|
|
// Search through pages for a terminal with no cashier
|
||
|
|
for (let pageNum = 1; pageNum <= 3 && !freeTerminalId; pageNum++) {
|
||
|
|
if (pageNum > 1) {
|
||
|
|
const pageBtn = page.locator(`button:has-text("${pageNum}")`).first();
|
||
|
|
const vis = await pageBtn.isVisible().catch(() => false);
|
||
|
|
if (vis) {
|
||
|
|
await pageBtn.click();
|
||
|
|
await page.waitForTimeout(2000);
|
||
|
|
} else break;
|
||
|
|
}
|
||
|
|
|
||
|
|
const rows = page.locator('table tbody tr');
|
||
|
|
const rowCount = await rows.count();
|
||
|
|
console.log(`Page ${pageNum}: ${rowCount} rows`);
|
||
|
|
|
||
|
|
for (let i = 0; i < rowCount; i++) {
|
||
|
|
const cells = rows.nth(i).locator('td');
|
||
|
|
const cashierText = (await cells.nth(cashierColIdx >= 0 ? cashierColIdx : 3).textContent({ timeout: 2000 }).catch(() => ''))?.trim() || '';
|
||
|
|
const termIdText = (await cells.nth(terminalIdColIdx >= 0 ? terminalIdColIdx : 7).textContent({ timeout: 2000 }).catch(() => ''))?.trim() || '';
|
||
|
|
|
||
|
|
console.log(`Row ${i}: cashier="${cashierText}" terminalId="${termIdText}"`);
|
||
|
|
|
||
|
|
// Unassociated = cashier cell is empty or "Unassigned"
|
||
|
|
if ((!cashierText || cashierText === 'Unassigned' || cashierText === '-') && termIdText && termIdText !== '-' && /^\d{8,}$/.test(termIdText)) {
|
||
|
|
freeTerminalId = termIdText;
|
||
|
|
console.log(`✓ Found free terminal ID (8+ digits): ${freeTerminalId}`);
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
if (!freeTerminalId) {
|
||
|
|
console.log('⚠ No unassociated terminal found — run "remove cashier" test first');
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Navigate back to Management', async () => {
|
||
|
|
await navigateToManagement(page);
|
||
|
|
await page.waitForTimeout(3000);
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Click Add User button', async () => {
|
||
|
|
await page.waitForSelector('table tbody tr', { timeout: 10000 }).catch(() => {});
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
|
||
|
|
const addUserBtn = page.locator('button:has-text("Add User")').first();
|
||
|
|
await addUserBtn.waitFor({ state: 'visible', timeout: 10000 });
|
||
|
|
await addUserBtn.click();
|
||
|
|
await page.waitForTimeout(2000);
|
||
|
|
console.log('✓ Add User modal opened');
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Fill Full Name', async () => {
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
const fullNameInput = page.locator('#fullName').first();
|
||
|
|
await fullNameInput.waitFor({ state: 'visible', timeout: 10000 });
|
||
|
|
await fullNameInput.fill(fullName);
|
||
|
|
console.log('✓ Full name filled:', fullName);
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Fill Username', async () => {
|
||
|
|
const usernameInput = page.locator('#username').first();
|
||
|
|
await usernameInput.fill(username);
|
||
|
|
console.log('✓ Username filled:', username);
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Fill Password', async () => {
|
||
|
|
const passwordInput = page.locator('#password').first();
|
||
|
|
await passwordInput.fill(password);
|
||
|
|
console.log('✓ Password filled');
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Fill Confirm Password', async () => {
|
||
|
|
const confirmInput = page.locator('#confirmPassword').first();
|
||
|
|
await confirmInput.fill(password);
|
||
|
|
console.log('✓ Confirm password filled');
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Select Branch from dropdown', async () => {
|
||
|
|
const branchSelect = page.locator('.ant-select').filter({ hasText: /Select a branch/i }).first();
|
||
|
|
const isVisible = await branchSelect.isVisible().catch(() => false);
|
||
|
|
if (isVisible) {
|
||
|
|
await branchSelect.click();
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
console.log('✓ Branch dropdown opened');
|
||
|
|
|
||
|
|
const options = page.locator('.ant-select-item-option');
|
||
|
|
const optionCount = await options.count();
|
||
|
|
console.log(`Found ${optionCount} branch options`);
|
||
|
|
|
||
|
|
for (let i = 0; i < optionCount; i++) {
|
||
|
|
const optionText = (await options.nth(i).textContent())?.trim();
|
||
|
|
if (optionText && optionText !== '-' && optionText.length > 1) {
|
||
|
|
await options.nth(i).click();
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
console.log('✓ Branch selected:', optionText);
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
console.log('Branch dropdown not found');
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Select Role: CASHIER', async () => {
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
|
||
|
|
const roleSelect = page.locator('.ant-select:has(.anticon-solution)').first();
|
||
|
|
const roleSelectSelector = roleSelect.locator('.ant-select-selector');
|
||
|
|
await roleSelectSelector.click();
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
console.log('✓ Role dropdown clicked');
|
||
|
|
|
||
|
|
const cashierOption = page.locator('.ant-select-item-option-content', { hasText: 'Cashier' }).first();
|
||
|
|
await cashierOption.waitFor({ state: 'visible', timeout: 5000 });
|
||
|
|
await cashierOption.click();
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
console.log('✓ CASHIER role selected');
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Select unassociated Terminal ID', async () => {
|
||
|
|
await page.waitForTimeout(2000);
|
||
|
|
|
||
|
|
const terminalLabel = page.locator('label[for="terminalId"]');
|
||
|
|
const terminalLabelVisible = await terminalLabel.isVisible({ timeout: 5000 }).catch(() => false);
|
||
|
|
console.log('Terminal label visible:', terminalLabelVisible);
|
||
|
|
|
||
|
|
if (terminalLabelVisible) {
|
||
|
|
const terminalSelect = page.locator('.ant-select:has(.anticon-mobile)').first();
|
||
|
|
const terminalSelector = terminalSelect.locator('.ant-select-selector');
|
||
|
|
await terminalSelector.click();
|
||
|
|
await page.waitForTimeout(1500);
|
||
|
|
console.log('✓ Terminal dropdown opened');
|
||
|
|
|
||
|
|
await page.waitForSelector('.ant-select-dropdown:not(.ant-select-dropdown-hidden) .ant-select-item-option', { timeout: 5000 }).catch(() => {});
|
||
|
|
const dropdownOptions = page.locator('.ant-select-dropdown:not(.ant-select-dropdown-hidden) .ant-select-item-option');
|
||
|
|
const count = await dropdownOptions.count();
|
||
|
|
console.log(`Visible terminal options: ${count}`);
|
||
|
|
|
||
|
|
if (count > 0 && freeTerminalId) {
|
||
|
|
// Try to find the specific free terminal we identified
|
||
|
|
let selected = false;
|
||
|
|
for (let i = 0; i < count; i++) {
|
||
|
|
const optText = (await dropdownOptions.nth(i).textContent())?.trim();
|
||
|
|
console.log(`Option ${i}: "${optText}"`);
|
||
|
|
if (optText?.includes(freeTerminalId)) {
|
||
|
|
await dropdownOptions.nth(i).click({ force: true });
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
console.log('✓ Terminal selected (matched free ID):', optText);
|
||
|
|
selected = true;
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
if (!selected) {
|
||
|
|
// Pick first option with 8+ digit ID
|
||
|
|
for (let i = 0; i < count; i++) {
|
||
|
|
const optText = (await dropdownOptions.nth(i).textContent())?.trim();
|
||
|
|
const idMatch = optText?.match(/Id:\s*(\d+)/i);
|
||
|
|
if (idMatch && idMatch[1].length >= 8) {
|
||
|
|
await dropdownOptions.nth(i).click({ force: true });
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
console.log('✓ Terminal selected (8+ digit fallback):', optText);
|
||
|
|
selected = true;
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
if (!selected) {
|
||
|
|
console.log('⚠ No terminal with 8+ digit ID found in dropdown');
|
||
|
|
}
|
||
|
|
} else if (count > 0) {
|
||
|
|
// No freeTerminalId from lookup — pick first with 8+ digit ID
|
||
|
|
let selected = false;
|
||
|
|
for (let i = 0; i < count; i++) {
|
||
|
|
const optText = (await dropdownOptions.nth(i).textContent())?.trim();
|
||
|
|
console.log(`Option ${i}: "${optText}"`);
|
||
|
|
const idMatch = optText?.match(/Id:\s*(\d+)/i);
|
||
|
|
if (idMatch && idMatch[1].length >= 8) {
|
||
|
|
await dropdownOptions.nth(i).click({ force: true });
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
console.log('✓ Terminal selected (8+ digit):', optText);
|
||
|
|
selected = true;
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
if (!selected) {
|
||
|
|
console.log('⚠ No terminal with 8+ digit ID found');
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
console.log('No terminal options — run terminals test first to free up a terminal');
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
console.log('Terminal label not visible — CASHIER role may not have been selected');
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Submit the form', async () => {
|
||
|
|
// The submit button in the modal footer has text "Add User" with UserAddOutlined icon
|
||
|
|
const submitBtn = page.locator('[role="dialog"] button:has-text("Add User"), .ant-modal button:has-text("Add User")').last();
|
||
|
|
const isVisible = await submitBtn.isVisible().catch(() => false);
|
||
|
|
|
||
|
|
if (isVisible) {
|
||
|
|
console.log('Clicking Add User submit button...');
|
||
|
|
await submitBtn.click();
|
||
|
|
await page.waitForTimeout(3000);
|
||
|
|
console.log('✓ Form submitted');
|
||
|
|
} else {
|
||
|
|
console.log('Submit button not found');
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Verify new cashier appears in table', async () => {
|
||
|
|
// Wait for modal to close and reload page
|
||
|
|
await page.waitForTimeout(3000);
|
||
|
|
await navigateToManagement(page);
|
||
|
|
await page.waitForTimeout(3000);
|
||
|
|
|
||
|
|
// Check full page body for the username
|
||
|
|
const bodyText = await page.locator('body').textContent().catch(() => '');
|
||
|
|
let userFound = bodyText?.includes(username) || false;
|
||
|
|
|
||
|
|
if (!userFound) {
|
||
|
|
// Try checking through a couple pages
|
||
|
|
for (let p = 0; p < 3 && !userFound; p++) {
|
||
|
|
const nextBtn = page.locator('.ant-pagination-next:not(.ant-pagination-disabled)').first();
|
||
|
|
const nextVis = await nextBtn.isVisible().catch(() => false);
|
||
|
|
if (nextVis) {
|
||
|
|
await nextBtn.click();
|
||
|
|
await page.waitForTimeout(1500);
|
||
|
|
const text = await page.locator('body').textContent().catch(() => '');
|
||
|
|
if (text?.includes(username)) {
|
||
|
|
userFound = true;
|
||
|
|
}
|
||
|
|
} else break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
console.log(`User "${username}" found:`, userFound);
|
||
|
|
expect(userFound).toBeTruthy();
|
||
|
|
});
|
||
|
|
|
||
|
|
console.log('✓ Add cashier test completed');
|
||
|
|
});
|
||
|
|
|
||
|
|
test('should add a new finance user', async ({ page }) => {
|
||
|
|
test.setTimeout(120000);
|
||
|
|
feature('Management Operations');
|
||
|
|
tag('functional');
|
||
|
|
severity('critical');
|
||
|
|
description('Add a new finance user by filling the form, selecting branch and Finance role, then verify in table');
|
||
|
|
|
||
|
|
const timestamp = Date.now();
|
||
|
|
const fullName = `Test Finance ${timestamp}`;
|
||
|
|
const username = `finance${timestamp}`;
|
||
|
|
const email = `finance${timestamp}@test.com`;
|
||
|
|
const password = 'Mav@1234';
|
||
|
|
|
||
|
|
await test.step('Click Add User button', async () => {
|
||
|
|
await page.waitForSelector('table tbody tr', { timeout: 20000 }).catch(() => {});
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
|
||
|
|
// Find the Add User button - it has the user-add icon and "Add User" text
|
||
|
|
const addUserBtn = page.locator('button').filter({ hasText: 'Add User' }).first();
|
||
|
|
await addUserBtn.waitFor({ state: 'visible', timeout: 20000 });
|
||
|
|
await addUserBtn.click({ force: true });
|
||
|
|
await page.waitForTimeout(2000);
|
||
|
|
console.log('✓ Add User modal opened');
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Fill Full Name', async () => {
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
const fullNameInput = page.locator('#fullName').first();
|
||
|
|
await fullNameInput.waitFor({ state: 'visible', timeout: 10000 });
|
||
|
|
await fullNameInput.fill(fullName);
|
||
|
|
console.log('✓ Full name filled:', fullName);
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Fill Username', async () => {
|
||
|
|
const usernameInput = page.locator('#username').first();
|
||
|
|
await usernameInput.fill(email);
|
||
|
|
console.log('✓ Username (email) filled:', email);
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Fill Password', async () => {
|
||
|
|
const passwordInput = page.locator('#password').first();
|
||
|
|
await passwordInput.fill(password);
|
||
|
|
console.log('✓ Password filled');
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Fill Confirm Password', async () => {
|
||
|
|
const confirmInput = page.locator('#confirmPassword').first();
|
||
|
|
await confirmInput.fill(password);
|
||
|
|
console.log('✓ Confirm password filled');
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Select Branch from dropdown', async () => {
|
||
|
|
const branchSelect = page.locator('.ant-select').filter({ hasText: /Select a branch/i }).first();
|
||
|
|
const isVisible = await branchSelect.isVisible().catch(() => false);
|
||
|
|
if (isVisible) {
|
||
|
|
await branchSelect.click();
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
console.log('✓ Branch dropdown opened');
|
||
|
|
|
||
|
|
const options = page.locator('.ant-select-item-option');
|
||
|
|
const optionCount = await options.count();
|
||
|
|
for (let i = 0; i < optionCount; i++) {
|
||
|
|
const optionText = (await options.nth(i).textContent())?.trim();
|
||
|
|
if (optionText && optionText !== '-' && optionText.length > 1) {
|
||
|
|
await options.nth(i).click();
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
console.log('✓ Branch selected:', optionText);
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Select Role: FINANCE', async () => {
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
|
||
|
|
const roleSelect = page.locator('.ant-select:has(.anticon-solution)').first();
|
||
|
|
const roleSelectSelector = roleSelect.locator('.ant-select-selector');
|
||
|
|
await roleSelectSelector.click();
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
console.log('✓ Role dropdown clicked');
|
||
|
|
|
||
|
|
const financeOption = page.locator('.ant-select-item-option-content', { hasText: 'Finance' }).first();
|
||
|
|
await financeOption.waitFor({ state: 'visible', timeout: 5000 });
|
||
|
|
await financeOption.click();
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
console.log('✓ FINANCE role selected');
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Submit the form', async () => {
|
||
|
|
const submitBtn = page.locator('.ant-modal button:has-text("Add User")').last();
|
||
|
|
const isVisible = await submitBtn.isVisible().catch(() => false);
|
||
|
|
if (isVisible) {
|
||
|
|
await submitBtn.click();
|
||
|
|
await page.waitForTimeout(3000);
|
||
|
|
console.log('✓ Form submitted');
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Verify new finance user appears in table', async () => {
|
||
|
|
// Wait for modal to fully close before interacting with the page
|
||
|
|
await page.waitForSelector('.ant-modal', { state: 'hidden', timeout: 15000 }).catch(() => {});
|
||
|
|
await page.waitForTimeout(2000);
|
||
|
|
|
||
|
|
// Click the Finance button - find all buttons with "Finance" text and filter out the one that also has "Cashier"
|
||
|
|
const allButtons = page.locator('button').filter({ hasText: 'Finance' });
|
||
|
|
const count = await allButtons.count();
|
||
|
|
console.log('Buttons with "Finance" text:', count);
|
||
|
|
|
||
|
|
let financeBtn = null;
|
||
|
|
for (let i = 0; i < count; i++) {
|
||
|
|
const text = await allButtons.nth(i).textContent();
|
||
|
|
console.log(`Button ${i} text: "${text}"`);
|
||
|
|
if (text?.includes('Finance') && !text?.includes('Cashier')) {
|
||
|
|
financeBtn = allButtons.nth(i);
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
if (!financeBtn) {
|
||
|
|
// Fallback: just use the last button with Finance text (should be Finance button)
|
||
|
|
financeBtn = allButtons.last();
|
||
|
|
}
|
||
|
|
|
||
|
|
const visible = await financeBtn.isVisible({ timeout: 5000 }).catch(() => false);
|
||
|
|
console.log('Finance button visible:', visible);
|
||
|
|
if (visible) {
|
||
|
|
// Use force: true to bypass modal overlay that's intercepting clicks
|
||
|
|
await financeBtn.click({ force: true });
|
||
|
|
console.log('✓ Finance button clicked');
|
||
|
|
|
||
|
|
// Wait for the table to reload with Finance users
|
||
|
|
await page.waitForTimeout(3000);
|
||
|
|
|
||
|
|
// Check if Finance filter is active by looking for active button state
|
||
|
|
const financeBtnAfterClick = page.locator('button').filter({ hasText: 'Finance' }).first();
|
||
|
|
const btnClass = await financeBtnAfterClick.getAttribute('class');
|
||
|
|
console.log('Finance button class after click:', btnClass);
|
||
|
|
|
||
|
|
await page.waitForSelector('table tbody tr', { timeout: 10000 }).catch(() => {});
|
||
|
|
}
|
||
|
|
|
||
|
|
// Search across all pages for the new user
|
||
|
|
let userFound = false;
|
||
|
|
for (let p = 0; p < 10 && !userFound; p++) {
|
||
|
|
const allText = await page.locator('table').first().textContent().catch(() => '');
|
||
|
|
if (p === 0) console.log('Table content (first 400 chars):', allText?.substring(0, 400));
|
||
|
|
if (allText?.includes(fullName)) {
|
||
|
|
userFound = true;
|
||
|
|
console.log('✓ User found in Finance table');
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
const nextBtn = page.locator('.ant-pagination-next:not(.ant-pagination-disabled)').first();
|
||
|
|
const hasNext = await nextBtn.isVisible().catch(() => false);
|
||
|
|
if (!hasNext) break;
|
||
|
|
|
||
|
|
// Use force: true to bypass any modal overlays
|
||
|
|
await nextBtn.click({ force: true });
|
||
|
|
await page.waitForTimeout(1500);
|
||
|
|
}
|
||
|
|
|
||
|
|
console.log(`Looking for: "${fullName}"`);
|
||
|
|
console.log('User found:', userFound);
|
||
|
|
expect(userFound).toBeTruthy();
|
||
|
|
});
|
||
|
|
|
||
|
|
console.log('✓ Add finance user test completed');
|
||
|
|
});
|
||
|
|
|
||
|
|
test('should add a new terminal manager user', async ({ page }) => {
|
||
|
|
test.setTimeout(120000);
|
||
|
|
feature('Management Operations');
|
||
|
|
tag('functional');
|
||
|
|
severity('critical');
|
||
|
|
description('Add a new terminal manager user by filling the form, selecting branch and Terminal Manager role, then verify in table');
|
||
|
|
|
||
|
|
const timestamp = Date.now();
|
||
|
|
const fullName = `Test Terminal Manager ${timestamp}`;
|
||
|
|
const email = `tmanager${timestamp}@test.com`;
|
||
|
|
const password = 'Mav@1234';
|
||
|
|
|
||
|
|
await test.step('Click Add User button', async () => {
|
||
|
|
await page.waitForSelector('table tbody tr', { timeout: 10000 }).catch(() => {});
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
|
||
|
|
const addUserBtn = page.locator('button').filter({ hasText: 'Add User' }).first();
|
||
|
|
await addUserBtn.waitFor({ state: 'visible', timeout: 10000 });
|
||
|
|
await addUserBtn.click({ force: true });
|
||
|
|
await page.waitForTimeout(2000);
|
||
|
|
console.log('✓ Add User modal opened');
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Fill Full Name', async () => {
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
const fullNameInput = page.locator('#fullName').first();
|
||
|
|
await fullNameInput.waitFor({ state: 'visible', timeout: 10000 });
|
||
|
|
await fullNameInput.fill(fullName);
|
||
|
|
console.log('✓ Full name filled:', fullName);
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Fill Username', async () => {
|
||
|
|
const usernameInput = page.locator('#username').first();
|
||
|
|
await usernameInput.fill(email);
|
||
|
|
console.log('✓ Username (email) filled:', email);
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Fill Password', async () => {
|
||
|
|
const passwordInput = page.locator('#password').first();
|
||
|
|
await passwordInput.fill(password);
|
||
|
|
console.log('✓ Password filled');
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Fill Confirm Password', async () => {
|
||
|
|
const confirmInput = page.locator('#confirmPassword').first();
|
||
|
|
await confirmInput.fill(password);
|
||
|
|
console.log('✓ Confirm password filled');
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Select Role: TERMINAL MANAGER', async () => {
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
|
||
|
|
const roleSelect = page.locator('.ant-select:has(.anticon-solution)').first();
|
||
|
|
const roleSelectSelector = roleSelect.locator('.ant-select-selector');
|
||
|
|
await roleSelectSelector.click();
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
console.log('✓ Role dropdown clicked');
|
||
|
|
|
||
|
|
const terminalManagerOption = page.locator('.ant-select-item-option-content', { hasText: 'Terminal Manager' }).first();
|
||
|
|
await terminalManagerOption.waitFor({ state: 'visible', timeout: 5000 });
|
||
|
|
await terminalManagerOption.click();
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
console.log('✓ TERMINAL MANAGER role selected');
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Select Branch from dropdown', async () => {
|
||
|
|
const branchSelect = page.locator('.ant-select').filter({ hasText: /Select a branch/i }).first();
|
||
|
|
const isVisible = await branchSelect.isVisible().catch(() => false);
|
||
|
|
if (isVisible) {
|
||
|
|
await branchSelect.click();
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
console.log('✓ Branch dropdown opened');
|
||
|
|
|
||
|
|
const options = page.locator('.ant-select-item-option');
|
||
|
|
const optionCount = await options.count();
|
||
|
|
for (let i = 0; i < optionCount; i++) {
|
||
|
|
const optionText = (await options.nth(i).textContent())?.trim();
|
||
|
|
if (optionText && optionText !== '-' && optionText.length > 1) {
|
||
|
|
await options.nth(i).click();
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
console.log('✓ Branch selected:', optionText);
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
console.log('Branch dropdown not shown for this role');
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Submit the form', async () => {
|
||
|
|
const submitBtn = page.locator('.ant-modal button:has-text("Add User")').last();
|
||
|
|
const isVisible = await submitBtn.isVisible().catch(() => false);
|
||
|
|
if (isVisible) {
|
||
|
|
await submitBtn.click();
|
||
|
|
await page.waitForTimeout(3000);
|
||
|
|
console.log('✓ Form submitted');
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Verify new terminal manager user appears in table', async () => {
|
||
|
|
await page.waitForSelector('.ant-modal', { state: 'hidden', timeout: 15000 }).catch(() => {});
|
||
|
|
await page.waitForTimeout(2000);
|
||
|
|
|
||
|
|
// Switch to the Terminal Managers tab (distinct from Cashiers/Finance)
|
||
|
|
const allButtons = page.locator('button').filter({ hasText: 'Terminal Managers' });
|
||
|
|
const count = await allButtons.count();
|
||
|
|
console.log('Buttons with "Terminal Managers" text:', count);
|
||
|
|
expect(count, 'A "Terminal Managers" tab button should exist').toBeGreaterThan(0);
|
||
|
|
|
||
|
|
const terminalManagersBtn = allButtons.first();
|
||
|
|
await terminalManagersBtn.click({ force: true });
|
||
|
|
console.log('✓ Terminal Managers tab clicked');
|
||
|
|
await page.waitForTimeout(3000);
|
||
|
|
await page.waitForSelector('table tbody tr', { timeout: 10000 }).catch(() => {});
|
||
|
|
|
||
|
|
// Search across all pages for the new user
|
||
|
|
let userFound = false;
|
||
|
|
for (let p = 0; p < 10 && !userFound; p++) {
|
||
|
|
const allText = await page.locator('table').first().textContent().catch(() => '');
|
||
|
|
if (p === 0) console.log('Table content (first 400 chars):', allText?.substring(0, 400));
|
||
|
|
if (allText?.includes(fullName)) {
|
||
|
|
userFound = true;
|
||
|
|
console.log('✓ User found in Terminal Managers table');
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
const nextBtn = page.locator('.ant-pagination-next:not(.ant-pagination-disabled)').first();
|
||
|
|
const hasNext = await nextBtn.isVisible().catch(() => false);
|
||
|
|
if (!hasNext) break;
|
||
|
|
|
||
|
|
await nextBtn.click({ force: true });
|
||
|
|
await page.waitForTimeout(1500);
|
||
|
|
}
|
||
|
|
|
||
|
|
console.log(`Looking for: "${fullName}"`);
|
||
|
|
console.log('User found:', userFound);
|
||
|
|
expect(userFound, 'Newly created terminal manager should appear in the Terminal Managers table').toBeTruthy();
|
||
|
|
});
|
||
|
|
|
||
|
|
console.log('✓ Add terminal manager user test completed');
|
||
|
|
});
|
||
|
|
|
||
|
|
test('should switch to Branches tab', async ({ page }) => {
|
||
|
|
feature('Management Operations');
|
||
|
|
tag('functional');
|
||
|
|
severity('normal');
|
||
|
|
description('Verify switching between Users and Branches tabs works correctly and Branches table displays data');
|
||
|
|
|
||
|
|
await test.step('Click Branches tab', async () => {
|
||
|
|
const branchesTab = page.locator('[role="tab"]:has-text("Branches")').first();
|
||
|
|
await branchesTab.waitFor({ state: 'visible', timeout: 20000 });
|
||
|
|
await branchesTab.click();
|
||
|
|
await page.waitForTimeout(2000);
|
||
|
|
console.log('✓ Clicked Branches tab');
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Verify Branches table is displayed', async () => {
|
||
|
|
await page.waitForSelector('table tbody tr', { timeout: 10000 }).catch(() => {});
|
||
|
|
const headers = await page.locator('table thead th').allTextContents();
|
||
|
|
console.log('Branches table headers:', headers.join(' | '));
|
||
|
|
|
||
|
|
const hasId = headers.some(h => h.toLowerCase().includes('id'));
|
||
|
|
const hasBranchName = headers.some(h => h.toLowerCase().includes('branch name'));
|
||
|
|
const hasAddress = headers.some(h => h.toLowerCase().includes('address'));
|
||
|
|
console.log(`Has ID: ${hasId}, Has Branch name: ${hasBranchName}, Has Address: ${hasAddress}`);
|
||
|
|
expect(hasId || hasBranchName).toBeTruthy();
|
||
|
|
|
||
|
|
const rows = await page.locator('table tbody tr').count();
|
||
|
|
console.log('Branch rows:', rows);
|
||
|
|
expect(rows).toBeGreaterThan(0);
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Verify Add Branch button is visible', async () => {
|
||
|
|
const addBranchBtn = page.locator('button:has-text("Add Branch")').first();
|
||
|
|
const isVisible = await addBranchBtn.isVisible().catch(() => false);
|
||
|
|
console.log('Add Branch button visible:', isVisible);
|
||
|
|
expect(isVisible).toBeTruthy();
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Switch back to Users tab', async () => {
|
||
|
|
const usersTab = page.locator('[role="tab"]:has-text("Users")').first();
|
||
|
|
await usersTab.click();
|
||
|
|
await page.waitForTimeout(2000);
|
||
|
|
console.log('✓ Switched back to Users tab');
|
||
|
|
|
||
|
|
const rows = await page.locator('table tbody tr').count();
|
||
|
|
console.log('Users rows after switching back:', rows);
|
||
|
|
expect(rows).toBeGreaterThan(0);
|
||
|
|
});
|
||
|
|
|
||
|
|
console.log('✓ Tab switching verified');
|
||
|
|
});
|
||
|
|
|
||
|
|
test('should add a new branch', async ({ page }) => {
|
||
|
|
test.setTimeout(120000);
|
||
|
|
feature('Management Operations');
|
||
|
|
tag('functional');
|
||
|
|
severity('critical');
|
||
|
|
description('Add a new branch by filling branch name and address, then verify it appears in the Branches table');
|
||
|
|
|
||
|
|
const timestamp = Date.now();
|
||
|
|
const branchName = `Test Branch ${timestamp}`;
|
||
|
|
const branchAddress = `Test Address ${timestamp}`;
|
||
|
|
|
||
|
|
await test.step('Switch to Branches tab', async () => {
|
||
|
|
const branchesTab = page.locator('[role="tab"]:has-text("Branches")').first();
|
||
|
|
await branchesTab.waitFor({ state: 'visible', timeout: 20000 });
|
||
|
|
await branchesTab.click();
|
||
|
|
await page.waitForTimeout(2000);
|
||
|
|
console.log('✓ Switched to Branches tab');
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Click Add Branch button', async () => {
|
||
|
|
const addBranchBtn = page.locator('button:has-text("Add Branch")').first();
|
||
|
|
await addBranchBtn.waitFor({ state: 'visible', timeout: 10000 });
|
||
|
|
await addBranchBtn.click();
|
||
|
|
await page.waitForTimeout(2000);
|
||
|
|
console.log('✓ Add Branch modal opened');
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Fill Branch Name', async () => {
|
||
|
|
// The modal has labels: "Branch", "Branch address", "Region", "City"
|
||
|
|
const nameInput = page.locator('#branchName').first();
|
||
|
|
const visible = await nameInput.isVisible({ timeout: 5000 }).catch(() => false);
|
||
|
|
if (visible) {
|
||
|
|
await nameInput.fill(branchName);
|
||
|
|
} else {
|
||
|
|
// Try by placeholder as fallback
|
||
|
|
const byPlaceholder = page.locator('#branchName');
|
||
|
|
await byPlaceholder.fill(branchName);
|
||
|
|
}
|
||
|
|
console.log('✓ Branch name filled:', branchName);
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Fill Branch Address', async () => {
|
||
|
|
const addressInput = page.locator('#username');
|
||
|
|
await addressInput.fill(branchAddress);
|
||
|
|
console.log('✓ Branch address filled:', branchAddress);
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Select Region', async () => {
|
||
|
|
// Wait a moment for all fields to render
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
|
||
|
|
// Click on the region select div to open dropdown
|
||
|
|
const regionSelect = page.locator('.ant-select').filter({ hasText: 'Select a region' }).first();
|
||
|
|
await regionSelect.click();
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
console.log('✓ Region dropdown opened');
|
||
|
|
|
||
|
|
// Type "Asir" to search/filter the region
|
||
|
|
await page.keyboard.type('Asir');
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
console.log('✓ Typed "Asir"');
|
||
|
|
|
||
|
|
// Click on the visible option
|
||
|
|
const regionOption = page.locator('.ant-select-item-option-content', { hasText: 'Asir' }).first();
|
||
|
|
await regionOption.click();
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
console.log('✓ Region "Asir" selected');
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Select City', async () => {
|
||
|
|
// Wait for region selection to complete
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
|
||
|
|
// Click on the city select div to open dropdown
|
||
|
|
const citySelect = page.locator('.ant-select').filter({ hasText: 'Select a city' }).first();
|
||
|
|
await citySelect.click();
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
console.log('✓ City dropdown opened');
|
||
|
|
|
||
|
|
// Type first letter to select first city option or type a specific city name
|
||
|
|
// Get first city option that appears
|
||
|
|
const firstCityOption = page.locator('.ant-select-item-option-content').first();
|
||
|
|
const cityName = await firstCityOption.textContent();
|
||
|
|
console.log('Selecting city:', cityName?.trim());
|
||
|
|
|
||
|
|
// Type the city name or just press Enter for first option
|
||
|
|
await page.keyboard.press('Enter');
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
console.log('✓ City selected:', cityName?.trim());
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Add District', async () => {
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
|
||
|
|
// Click "Add new district" button to reveal the input
|
||
|
|
const addNewDistrictBtn = page.locator('button:has-text("Add new district")').first();
|
||
|
|
const btnVisible = await addNewDistrictBtn.isVisible({ timeout: 5000 }).catch(() => false);
|
||
|
|
if (btnVisible) {
|
||
|
|
await addNewDistrictBtn.click();
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
console.log('✓ Clicked Add new district');
|
||
|
|
|
||
|
|
// Fill the district name in the text input that appears
|
||
|
|
const districtInput = page.locator('input.ant-input[type="text"]:not([role="combobox"])').last();
|
||
|
|
await districtInput.waitFor({ state: 'visible', timeout: 5000 });
|
||
|
|
const districtName = `District ${Date.now()}`;
|
||
|
|
await districtInput.fill(districtName);
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
console.log('✓ District name filled:', districtName);
|
||
|
|
|
||
|
|
// Click "Add" button (primary button with plus icon)
|
||
|
|
const addBtn = page.locator('button.ant-btn-primary:has-text("Add")').first();
|
||
|
|
await addBtn.click();
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
console.log('✓ District added');
|
||
|
|
} else {
|
||
|
|
// Fallback: just select from existing district dropdown (rc_select_7)
|
||
|
|
const districtSelect = page.locator('#rc_select_7');
|
||
|
|
await districtSelect.click();
|
||
|
|
await page.waitForTimeout(800);
|
||
|
|
|
||
|
|
const option = page.locator('[role="option"]').first();
|
||
|
|
await option.waitFor({ state: 'visible', timeout: 5000 });
|
||
|
|
const optText = await option.textContent();
|
||
|
|
await option.click();
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
console.log('✓ District selected:', optText?.trim());
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Submit the form', async () => {
|
||
|
|
// Click the "Add Branch" button with plus-square icon
|
||
|
|
const submitBtn = page.locator('button:has(.anticon-plus-square):has-text("Add Branch")').first();
|
||
|
|
const isVisible = await submitBtn.isVisible({ timeout: 5000 }).catch(() => false);
|
||
|
|
if (isVisible) {
|
||
|
|
await submitBtn.click();
|
||
|
|
await page.waitForTimeout(3000);
|
||
|
|
console.log('✓ Form submitted');
|
||
|
|
} else {
|
||
|
|
// Fallback
|
||
|
|
const fallback = page.locator('button:has-text("Add branch")').last();
|
||
|
|
await fallback.click();
|
||
|
|
await page.waitForTimeout(3000);
|
||
|
|
console.log('✓ Form submitted (fallback)');
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Verify new branch appears in table', async () => {
|
||
|
|
// Wait for modal to close
|
||
|
|
await page.waitForTimeout(5000);
|
||
|
|
|
||
|
|
// Check the page body for the branch name
|
||
|
|
const bodyText = await page.locator('body').textContent().catch(() => '');
|
||
|
|
console.log(`Looking for: "${branchName}"`);
|
||
|
|
const branchFound = bodyText?.includes(branchName) || false;
|
||
|
|
console.log('Branch found on page:', branchFound);
|
||
|
|
expect(branchFound).toBeTruthy();
|
||
|
|
});
|
||
|
|
|
||
|
|
console.log('✓ Add branch test completed');
|
||
|
|
});
|
||
|
|
|
||
|
|
test('should download report from Users tab and verify content', async ({ page }) => {
|
||
|
|
test.setTimeout(120000);
|
||
|
|
feature('Management Operations');
|
||
|
|
tag('functional');
|
||
|
|
severity('critical');
|
||
|
|
description('Download CSV report from Users tab and cross-check content against the table on the portal');
|
||
|
|
|
||
|
|
const tableRows: string[][] = [];
|
||
|
|
let tableHeaders: string[] = [];
|
||
|
|
|
||
|
|
await test.step('Collect ALL table data from portal (all pages)', async () => {
|
||
|
|
await page.waitForSelector('table tbody tr', { timeout: 10000 });
|
||
|
|
tableHeaders = await page.locator('table thead th').allTextContents();
|
||
|
|
console.log('Table headers:', tableHeaders.join(' | '));
|
||
|
|
|
||
|
|
// Use only the first visible table
|
||
|
|
const table = page.locator('table').first();
|
||
|
|
|
||
|
|
// This table only grows (every "add user" test run creates a real,
|
||
|
|
// permanent record), so an unbounded loop eventually times out the
|
||
|
|
// whole test - cap it like the refunds export test does.
|
||
|
|
const maxPages = 20;
|
||
|
|
let pageNum = 1;
|
||
|
|
while (true) {
|
||
|
|
const rows = table.locator('tbody tr:not(.ant-table-placeholder)');
|
||
|
|
const rowCount = await rows.count();
|
||
|
|
|
||
|
|
for (let i = 0; i < rowCount; i++) {
|
||
|
|
const cells = await rows.nth(i).locator('td').allTextContents();
|
||
|
|
const rowData = cells.map(c => c.trim());
|
||
|
|
// Skip rows where all cells are empty
|
||
|
|
const hasContent = rowData.some(c => c.length > 0 && !c.match(/^No data$/i));
|
||
|
|
if (hasContent) {
|
||
|
|
tableRows.push(rowData);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
if (pageNum >= maxPages) {
|
||
|
|
console.log(`⚠ Reached safety cap of ${maxPages} pages - stopping early, table may have more rows`);
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
|
||
|
|
const nextBtn = page.locator('.ant-pagination-next:not(.ant-pagination-disabled)').first();
|
||
|
|
const hasNext = await nextBtn.isVisible().catch(() => false);
|
||
|
|
if (hasNext) {
|
||
|
|
await nextBtn.click();
|
||
|
|
await page.waitForTimeout(1500);
|
||
|
|
pageNum++;
|
||
|
|
} else {
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
console.log(`Total rows collected across ${pageNum} pages: ${tableRows.length}`);
|
||
|
|
console.log('First row:', tableRows[0]?.join(' | '));
|
||
|
|
expect(tableRows.length).toBeGreaterThan(0);
|
||
|
|
});
|
||
|
|
|
||
|
|
let csvContent = '';
|
||
|
|
|
||
|
|
await test.step('Download CSV report', async () => {
|
||
|
|
const downloadBtn = page.locator('button:has-text("Download Report")').first();
|
||
|
|
await downloadBtn.click();
|
||
|
|
await page.waitForTimeout(2000);
|
||
|
|
|
||
|
|
const csvOption = page.locator('text=CSV').first();
|
||
|
|
await csvOption.click();
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
|
||
|
|
const downloadPromise = page.waitForEvent('download', { timeout: 15000 });
|
||
|
|
const dlBtn = page.locator('.ant-modal-wrap button span:text-is("Download")').first();
|
||
|
|
await dlBtn.click();
|
||
|
|
|
||
|
|
const download = await downloadPromise;
|
||
|
|
expect(download).toBeTruthy();
|
||
|
|
console.log('✓ Downloaded:', download.suggestedFilename());
|
||
|
|
|
||
|
|
const filePath = await download.path();
|
||
|
|
if (filePath) {
|
||
|
|
csvContent = fs.readFileSync(filePath, 'utf-8');
|
||
|
|
console.log('CSV lines:', csvContent.split('\n').length);
|
||
|
|
console.log('CSV first 300 chars:', csvContent.substring(0, 300));
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Cross-check table data against CSV', async () => {
|
||
|
|
expect(csvContent).toBeTruthy();
|
||
|
|
const csvLines = csvContent.split('\n').filter((l: string) => l.trim());
|
||
|
|
const csvDataLines = csvLines.length - 1; // minus header
|
||
|
|
console.log('CSV header:', csvLines[0]);
|
||
|
|
console.log(`Portal total rows: ${tableRows.length}`);
|
||
|
|
console.log(`CSV data rows: ${csvDataLines}`);
|
||
|
|
|
||
|
|
let matchCount = 0;
|
||
|
|
const unmatched: string[] = [];
|
||
|
|
for (const row of tableRows) {
|
||
|
|
const keyValue = row[1] || row[0];
|
||
|
|
if (keyValue && csvContent.includes(keyValue)) {
|
||
|
|
matchCount++;
|
||
|
|
} else {
|
||
|
|
unmatched.push(keyValue);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
console.log(`Matched ${matchCount}/${tableRows.length} portal rows found in CSV`);
|
||
|
|
if (unmatched.length > 0) console.log('Unmatched:', unmatched.join(', '));
|
||
|
|
expect(matchCount).toBeGreaterThan(0);
|
||
|
|
});
|
||
|
|
|
||
|
|
console.log('✓ Users download + cross-check completed');
|
||
|
|
});
|
||
|
|
|
||
|
|
test('should download finance report and verify content', async ({ page }) => {
|
||
|
|
test.setTimeout(120000);
|
||
|
|
feature('Management Operations');
|
||
|
|
tag('functional');
|
||
|
|
severity('critical');
|
||
|
|
description('Download Finance CSV report and cross-check content against the finance table on the portal');
|
||
|
|
|
||
|
|
const tableRows: string[][] = [];
|
||
|
|
|
||
|
|
await test.step('Switch to Finance view and collect ALL data', async () => {
|
||
|
|
await page.waitForSelector('table tbody tr', { timeout: 20000 }).catch(() => {});
|
||
|
|
|
||
|
|
const financeBtn = page.locator('button span:text-is("Finance")').first();
|
||
|
|
await financeBtn.waitFor({ state: 'visible', timeout: 20000 });
|
||
|
|
await financeBtn.click({ force: true });
|
||
|
|
await page.waitForTimeout(3000);
|
||
|
|
|
||
|
|
await page.waitForSelector('table tbody tr', { timeout: 10000 });
|
||
|
|
const headers = await page.locator('table thead th').allTextContents();
|
||
|
|
console.log('Finance table headers:', headers.join(' | '));
|
||
|
|
|
||
|
|
const table = page.locator('table').first();
|
||
|
|
|
||
|
|
let pageNum = 1;
|
||
|
|
while (true) {
|
||
|
|
const rows = table.locator('tbody tr:not(.ant-table-placeholder)');
|
||
|
|
const rowCount = await rows.count();
|
||
|
|
|
||
|
|
for (let i = 0; i < rowCount; i++) {
|
||
|
|
const cells = await rows.nth(i).locator('td').allTextContents();
|
||
|
|
const rowData = cells.map(c => c.trim());
|
||
|
|
const hasContent = rowData.some(c => c.length > 0 && !c.match(/^No data$/i));
|
||
|
|
if (hasContent) {
|
||
|
|
tableRows.push(rowData);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
const nextBtn = page.locator('.ant-pagination-next:not(.ant-pagination-disabled)').first();
|
||
|
|
const hasNext = await nextBtn.isVisible().catch(() => false);
|
||
|
|
if (hasNext) {
|
||
|
|
await nextBtn.click();
|
||
|
|
await page.waitForTimeout(1500);
|
||
|
|
pageNum++;
|
||
|
|
} else {
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
console.log(`Total finance rows collected across ${pageNum} pages: ${tableRows.length}`);
|
||
|
|
expect(tableRows.length).toBeGreaterThan(0);
|
||
|
|
});
|
||
|
|
|
||
|
|
let csvContent = '';
|
||
|
|
|
||
|
|
await test.step('Download Finance CSV report', async () => {
|
||
|
|
const cashiersBtn = page.locator('button span:text-is("Cashiers")').first();
|
||
|
|
const cashiersVisible = await cashiersBtn.isVisible().catch(() => false);
|
||
|
|
if (cashiersVisible) {
|
||
|
|
await cashiersBtn.click();
|
||
|
|
await page.waitForTimeout(1000);
|
||
|
|
}
|
||
|
|
|
||
|
|
const downloadBtn = page.locator('button:has-text("Download Report")').first();
|
||
|
|
await downloadBtn.click();
|
||
|
|
await page.waitForTimeout(2000);
|
||
|
|
|
||
|
|
const financeToggle = page.locator('.ant-modal-wrap button span:text-is("Finance")').first();
|
||
|
|
await financeToggle.click();
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
|
||
|
|
const csvOption = page.locator('text=CSV').first();
|
||
|
|
await csvOption.click();
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
|
||
|
|
const downloadPromise = page.waitForEvent('download', { timeout: 15000 });
|
||
|
|
const dlBtn = page.locator('.ant-modal-wrap button span:text-is("Download")').first();
|
||
|
|
await dlBtn.click();
|
||
|
|
|
||
|
|
const download = await downloadPromise;
|
||
|
|
expect(download).toBeTruthy();
|
||
|
|
console.log('✓ Downloaded:', download.suggestedFilename());
|
||
|
|
|
||
|
|
const filePath = await download.path();
|
||
|
|
if (filePath) {
|
||
|
|
csvContent = fs.readFileSync(filePath, 'utf-8');
|
||
|
|
console.log('CSV lines:', csvContent.split('\n').length);
|
||
|
|
console.log('CSV first 300 chars:', csvContent.substring(0, 300));
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Cross-check finance data against CSV', async () => {
|
||
|
|
expect(csvContent).toBeTruthy();
|
||
|
|
const csvLines = csvContent.split('\n').filter((l: string) => l.trim());
|
||
|
|
const csvDataLines = csvLines.length - 1;
|
||
|
|
console.log('CSV header:', csvLines[0]);
|
||
|
|
console.log(`Portal total rows: ${tableRows.length}`);
|
||
|
|
console.log(`CSV data rows: ${csvDataLines}`);
|
||
|
|
|
||
|
|
let matchCount = 0;
|
||
|
|
const unmatched: string[] = [];
|
||
|
|
for (const row of tableRows) {
|
||
|
|
const keyValue = row[1] || row[0];
|
||
|
|
if (keyValue && csvContent.includes(keyValue)) {
|
||
|
|
matchCount++;
|
||
|
|
} else {
|
||
|
|
unmatched.push(keyValue);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
console.log(`Matched ${matchCount}/${tableRows.length} finance rows found in CSV`);
|
||
|
|
if (unmatched.length > 0) console.log('Unmatched:', unmatched.join(', '));
|
||
|
|
expect(matchCount).toBeGreaterThan(0);
|
||
|
|
});
|
||
|
|
|
||
|
|
console.log('✓ Finance download + cross-check completed');
|
||
|
|
});
|
||
|
|
|
||
|
|
test('should download report from Branches tab and verify content', async ({ page }) => {
|
||
|
|
test.setTimeout(120000);
|
||
|
|
feature('Management Operations');
|
||
|
|
tag('functional');
|
||
|
|
severity('critical');
|
||
|
|
description('Download CSV report from Branches tab and cross-check content against the table on the portal');
|
||
|
|
|
||
|
|
const tableRows: string[][] = [];
|
||
|
|
|
||
|
|
await test.step('Switch to Branches and collect ALL data', async () => {
|
||
|
|
const branchesTab = page.locator('[role="tab"]:has-text("Branches")').first();
|
||
|
|
await branchesTab.click();
|
||
|
|
await page.waitForTimeout(3000);
|
||
|
|
|
||
|
|
// Get the visible table (Branches tab table, not the hidden Users table)
|
||
|
|
const tables = page.locator('table');
|
||
|
|
const tableCount = await tables.count();
|
||
|
|
console.log(`Tables in DOM: ${tableCount}`);
|
||
|
|
|
||
|
|
// Find the table that has branch-related headers
|
||
|
|
let branchTable = tables.first();
|
||
|
|
for (let t = 0; t < tableCount; t++) {
|
||
|
|
const hdrs = await tables.nth(t).locator('thead th').allTextContents();
|
||
|
|
const hdrText = hdrs.join(' ');
|
||
|
|
if (hdrText.includes('Branch') && hdrText.includes('Address')) {
|
||
|
|
branchTable = tables.nth(t);
|
||
|
|
console.log(`Using table ${t} with headers: ${hdrs.join(' | ')}`);
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
let pageNum = 1;
|
||
|
|
while (true) {
|
||
|
|
const rows = branchTable.locator('tbody tr:not(.ant-table-placeholder)');
|
||
|
|
const rowCount = await rows.count();
|
||
|
|
|
||
|
|
for (let i = 0; i < rowCount; i++) {
|
||
|
|
const cells = await rows.nth(i).locator('td').allTextContents();
|
||
|
|
const rowData = cells.map(c => c.trim());
|
||
|
|
const hasContent = rowData.some(c => c.length > 0 && !c.match(/^No data$/i));
|
||
|
|
if (hasContent) {
|
||
|
|
tableRows.push(rowData);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
const nextBtn = page.locator('.ant-pagination-next:not(.ant-pagination-disabled)').first();
|
||
|
|
const hasNext = await nextBtn.isVisible().catch(() => false);
|
||
|
|
if (hasNext) {
|
||
|
|
await nextBtn.click();
|
||
|
|
await page.waitForTimeout(1500);
|
||
|
|
pageNum++;
|
||
|
|
} else {
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
console.log(`Total branch rows collected across ${pageNum} pages: ${tableRows.length}`);
|
||
|
|
if (tableRows.length > 0) console.log('First row:', tableRows[0]?.join(' | '));
|
||
|
|
expect(tableRows.length).toBeGreaterThan(0);
|
||
|
|
});
|
||
|
|
|
||
|
|
let csvContent = '';
|
||
|
|
|
||
|
|
await test.step('Download Branches CSV report', async () => {
|
||
|
|
const downloadBtn = page.locator('button:has-text("Download Report")').first();
|
||
|
|
await downloadBtn.click();
|
||
|
|
await page.waitForTimeout(2000);
|
||
|
|
|
||
|
|
const csvOption = page.locator('text=CSV').first();
|
||
|
|
await csvOption.click();
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
|
||
|
|
const downloadPromise = page.waitForEvent('download', { timeout: 15000 });
|
||
|
|
const dlBtn = page.locator('.ant-modal-wrap button span:text-is("Download")').first();
|
||
|
|
await dlBtn.click();
|
||
|
|
|
||
|
|
const download = await downloadPromise;
|
||
|
|
expect(download).toBeTruthy();
|
||
|
|
console.log('✓ Downloaded:', download.suggestedFilename());
|
||
|
|
|
||
|
|
const filePath = await download.path();
|
||
|
|
if (filePath) {
|
||
|
|
csvContent = fs.readFileSync(filePath, 'utf-8');
|
||
|
|
console.log('CSV lines:', csvContent.split('\n').length);
|
||
|
|
console.log('CSV first 300 chars:', csvContent.substring(0, 300));
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Cross-check branches data against CSV', async () => {
|
||
|
|
expect(csvContent).toBeTruthy();
|
||
|
|
const csvLines = csvContent.split('\n').filter((l: string) => l.trim());
|
||
|
|
const csvDataLines = csvLines.length - 1;
|
||
|
|
console.log('CSV header:', csvLines[0]);
|
||
|
|
console.log(`Portal total rows: ${tableRows.length}`);
|
||
|
|
console.log(`CSV data rows: ${csvDataLines}`);
|
||
|
|
|
||
|
|
let matchCount = 0;
|
||
|
|
const unmatched: string[] = [];
|
||
|
|
for (const row of tableRows) {
|
||
|
|
const keyValue = row[1] || row[0];
|
||
|
|
if (keyValue && csvContent.includes(keyValue)) {
|
||
|
|
matchCount++;
|
||
|
|
} else {
|
||
|
|
unmatched.push(keyValue);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
console.log(`Matched ${matchCount}/${tableRows.length} branch rows found in CSV`);
|
||
|
|
if (unmatched.length > 0) console.log('Unmatched:', unmatched.join(', '));
|
||
|
|
expect(matchCount).toBeGreaterThan(0);
|
||
|
|
});
|
||
|
|
|
||
|
|
console.log('✓ Branches download + cross-check completed');
|
||
|
|
});
|
||
|
|
|
||
|
|
test('should paginate through cashier list', async ({ page }) => {
|
||
|
|
feature('Management Operations');
|
||
|
|
tag('functional');
|
||
|
|
severity('normal');
|
||
|
|
description('Test pagination controls navigate to page 2 and load a genuinely different set of cashiers');
|
||
|
|
|
||
|
|
const table = page.locator('table').first();
|
||
|
|
await table.locator('tbody tr:not([aria-hidden="true"])').first().waitFor({ state: 'visible', timeout: 25000 });
|
||
|
|
const headers = await table.locator('thead th').allTextContents();
|
||
|
|
const idIdx = headers.findIndex((h) => h.trim().toLowerCase() === 'cashier id');
|
||
|
|
expect(idIdx, 'A Cashier ID column should exist').toBeGreaterThanOrEqual(0);
|
||
|
|
|
||
|
|
let firstPageId = '';
|
||
|
|
|
||
|
|
await test.step('Capture first row ID on page 1', async () => {
|
||
|
|
const cells = await table.locator('tbody tr:not([aria-hidden="true"])').first().locator('td').allTextContents();
|
||
|
|
firstPageId = (cells[idIdx] || '').trim();
|
||
|
|
expect(firstPageId, 'Page 1 first row should have a valid ID').toMatch(/^\d+$/);
|
||
|
|
console.log('First page first row ID:', firstPageId);
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Navigate to page 2', async () => {
|
||
|
|
// Ant Design renders page numbers as <li class="ant-pagination-item-N">,
|
||
|
|
// not <button> elements - a `button:has-text("2")` selector matches
|
||
|
|
// nothing here even though the pagination (606 pages in this dataset)
|
||
|
|
// is very much real.
|
||
|
|
const page2Item = page.locator('.ant-pagination-item').filter({ hasText: /^2$/ }).first();
|
||
|
|
await expect(page2Item, 'A page 2 pagination item should exist').toBeVisible({ timeout: 10000 });
|
||
|
|
await page2Item.click();
|
||
|
|
console.log('✓ Navigated to page 2');
|
||
|
|
});
|
||
|
|
|
||
|
|
await test.step('Verify page 2 loaded a different first row', async () => {
|
||
|
|
let secondPageId = '';
|
||
|
|
for (let attempt = 0; attempt < 20; attempt++) {
|
||
|
|
const cells = await table.locator('tbody tr:not([aria-hidden="true"])').first().locator('td').allTextContents().catch(() => [] as string[]);
|
||
|
|
secondPageId = (cells[idIdx] || '').trim();
|
||
|
|
if (secondPageId && secondPageId !== firstPageId) break;
|
||
|
|
await page.waitForTimeout(400);
|
||
|
|
}
|
||
|
|
console.log('Page 2 first row ID:', secondPageId);
|
||
|
|
|
||
|
|
expect(secondPageId, 'Page 2 first row should have a valid ID').toMatch(/^\d+$/);
|
||
|
|
expect(secondPageId, 'Page 2 should show a different first row than page 1').not.toBe(firstPageId);
|
||
|
|
});
|
||
|
|
|
||
|
|
console.log('✓ Pagination test completed');
|
||
|
|
});
|
||
|
|
});
|