fix(tests): Improve gift recording test reliability

- Add better error handling and logging for gift recording flow
- Add explicit navigation to contacts page before finding gift button
- Add info icon click handling when needed
- Add more comprehensive button detection with multiple selectors
- Add debug logging for page state and navigation
- Add screenshot capture on failures
- Add retry logic with proper state verification
- Fix linter errors in playwright config

The changes help diagnose and handle various UI states that can occur during gift recording, making the tests more reliable especially on Linux.
This commit is contained in:
Matthew Raymer
2025-02-15 07:53:48 +00:00
parent 777f72f85d
commit f07a2de565
5 changed files with 377 additions and 215 deletions

View File

@@ -1,43 +1,47 @@
import path from 'path';
import { test, expect } from '@playwright/test';
import { importUser } from './testUtils';
import { importUser, getOSSpecificTimeout } from './testUtils';
test('Record item given from image-share', async ({ page }) => {
const TIMEOUT = getOSSpecificTimeout();
let randomString = Math.random().toString(36).substring(2, 8);
// Combine title prefix with the random string
const finalTitle = `Gift ${randomString} from image-share`;
await importUser(page, '00');
// Record something given
await page.goto('./test');
// Record something given with increased timeout
await page.goto('./test', { timeout: TIMEOUT });
const fileChooserPromise = page.waitForEvent('filechooser');
await page.getByTestId('fileInput').click();
const fileChooser = await fileChooserPromise;
await fileChooser.setFiles(path.join(__dirname, '..', 'public', 'img', 'icons', 'android-chrome-192x192.png'));
await page.getByTestId('fileUploadButton').click();
// Wait for file upload to complete
await page.waitForTimeout(2000);
await page.waitForLoadState('networkidle', { timeout: TIMEOUT });
// on shared photo page, choose the gift option
// Click gift button and wait for navigation
await page.getByRole('button').filter({ hasText: /gift/i }).click();
await page.waitForLoadState('networkidle', { timeout: TIMEOUT });
await page.getByTestId('imagery').getByRole('img').isVisible();
// Wait for form to be ready
await expect(page.getByPlaceholder('What was received')).toBeVisible({ timeout: TIMEOUT });
await page.getByPlaceholder('What was received').fill(finalTitle);
await page.getByRole('spinbutton').fill('2');
await page.getByRole('button', { name: 'Sign & Send' }).click();
// we end up on a page with the onboarding info
// Wait for onboarding and confirmation
await page.getByTestId('closeOnboardingAndFinish').click();
await expect(page.getByText('That gift was recorded.')).toBeVisible({ timeout: TIMEOUT });
await page.locator('div[role="alert"] button > svg.fa-xmark').click();
await expect(page.getByText('That gift was recorded.')).toBeVisible();
await page.locator('div[role="alert"] button > svg.fa-xmark').click(); // dismiss info alert
// Refresh home view and check gift
// Verify on home page
await page.goto('./');
await page.waitForLoadState('networkidle', { timeout: TIMEOUT });
const item1 = page.locator('li').filter({ hasText: finalTitle });
await expect(item1.getByRole('img')).toBeVisible();
await expect(item1).toBeVisible({ timeout: TIMEOUT });
});
// // I believe there's a way to test this service worker feature.