Refactor e2e tests for improved reliability and consistency

- Updated `auth-guard.spec.ts` to configure localStorage before navigation using `context.addInitScript`.
- Enhanced test stability with explicit `waitForLoadState` calls after page reloads.
- Refactored `admin-dashboard.spec.ts` for more descriptive test names aligning with chart updates. Adjusted lazy-loading behavior in the analytics section.
- Reworked `homepage.spec.ts` tests to improve headline and badge visibility checks. Added scroll-triggered animation handling for stats section.
- Enhanced MSW handler in `auth.ts` with mock data for user growth and registration activity charts. Added organization and user status distribution data.
This commit is contained in:
Felipe Cardoso
2025-11-24 20:55:04 +01:00
parent 6b970765ba
commit 570848cc2d
4 changed files with 110 additions and 55 deletions

View File

@@ -114,13 +114,19 @@ test.describe('Admin Dashboard - Analytics Charts', () => {
});
test('should display user growth chart', async ({ page }) => {
await expect(page.getByText('User Growth')).toBeVisible();
// Scroll to charts section and wait for it to load
const chartsHeading = page.getByRole('heading', { name: 'Analytics Overview' });
await chartsHeading.scrollIntoViewIfNeeded();
await page.waitForTimeout(500); // Wait for any lazy-loaded components
const userGrowthHeading = page.getByText('User Growth');
await expect(userGrowthHeading).toBeVisible({ timeout: 10000 });
await expect(page.getByText('Total and active users over the last 30 days')).toBeVisible();
});
test('should display session activity chart', async ({ page }) => {
await expect(page.getByText('Session Activity')).toBeVisible();
await expect(page.getByText('Active and new sessions over the last 14 days')).toBeVisible();
test('should display registration activity chart', async ({ page }) => {
await expect(page.getByText('User Registration Activity')).toBeVisible();
await expect(page.getByText('New user registrations over the last 14 days')).toBeVisible();
});
test('should display organization distribution chart', async ({ page }) => {
@@ -134,16 +140,21 @@ test.describe('Admin Dashboard - Analytics Charts', () => {
});
test('should display all four charts in grid layout', async ({ page }) => {
// Scroll to charts section and wait for lazy-loaded components
const chartsHeading = page.getByRole('heading', { name: 'Analytics Overview' });
await chartsHeading.scrollIntoViewIfNeeded();
await page.waitForTimeout(500);
// All charts should be visible
const userGrowthChart = page.getByText('User Growth');
const sessionActivityChart = page.getByText('Session Activity');
const registrationActivityChart = page.getByText('User Registration Activity');
const orgDistributionChart = page.getByText('Organization Distribution');
const userStatusChart = page.getByText('User Status Distribution');
await expect(userGrowthChart).toBeVisible();
await expect(sessionActivityChart).toBeVisible();
await expect(orgDistributionChart).toBeVisible();
await expect(userStatusChart).toBeVisible();
await expect(userGrowthChart).toBeVisible({ timeout: 10000 });
await expect(registrationActivityChart).toBeVisible({ timeout: 10000 });
await expect(orgDistributionChart).toBeVisible({ timeout: 10000 });
await expect(userStatusChart).toBeVisible({ timeout: 10000 });
});
});