@ -38,101 +38,108 @@
* /
import { test , expect , Page } from '@playwright/test' ;
import { importUser } from './testUtils' ;
import { importUser , getOSSpecificTimeout } from './testUtils' ;
// Add timeout constants
const ALERT_TIMEOUT = 5000 ;
const NETWORK_TIMEOUT = 10000 ;
// Update timeout constants for Linux
const BASE_TIMEOUT = getOSSpecificTimeout ( ) ;
const ALERT_TIMEOUT = BASE_TIMEOUT / 6 ;
const NETWORK_TIMEOUT = BASE_TIMEOUT / 3 ;
const ANIMATION_TIMEOUT = 1000 ;
test ( 'Add contact, record gift, confirm gift' , async ( { page } ) = > {
try {
// Generate test data with error checking
const randomString = await generateRandomString ( 16 ) ;
const randomNonZeroNumber = Math . floor ( Math . random ( ) * 99 ) + 1 ;
if ( randomNonZeroNumber <= 0 ) throw new Error ( 'Failed to generate valid number' ) ;
const finalTitle = ` Gift ${ randomString } ` ;
const contactName = 'Contact #000 renamed' ;
const userName = 'User #000' ;
// Add test configuration to increase timeout
test . describe ( 'Contact Management' , ( ) = > {
// Increase timeout for all tests in this group
test . setTimeout ( BASE_TIMEOUT * 2 ) ;
// Import user with error handling
test ( 'Add contact, record gift, confirm gift' , async ( { page } ) = > {
try {
await importUser ( page , '01' ) ;
} catch ( e ) {
throw new Error ( ` Failed to import user: ${ e instanceof Error ? e.message : String ( e ) } ` ) ;
// Generate test data with error checking
const randomString = await generateRandomString ( 16 ) ;
const randomNonZeroNumber = Math . floor ( Math . random ( ) * 99 ) + 1 ;
if ( randomNonZeroNumber <= 0 ) throw new Error ( 'Failed to generate valid number' ) ;
const finalTitle = ` Gift ${ randomString } ` ;
const contactName = 'Contact #000 renamed' ;
const userName = 'User #000' ;
// Import user with error handling
try {
await importUser ( page , '01' ) ;
} catch ( e ) {
throw new Error ( ` Failed to import user: ${ e instanceof Error ? e.message : String ( e ) } ` ) ;
}
// Add new contact with verification
await page . goto ( './contacts' ) ;
await page . getByPlaceholder ( 'URL or DID, Name, Public Key' ) . fill ( ` did:ethr:0x0000694B58C2cC69658993A90D3840C560f2F51F, ${ userName } ` ) ;
await page . locator ( 'button > svg.fa-plus' ) . click ( ) ;
// Handle the registration alert properly
await handleRegistrationAlert ( page ) ;
// Add a small delay to ensure UI is stable
await page . waitForTimeout ( 500 ) ;
// Verify contact was added and is clickable
const contactElement = page . locator ( 'li.border-b' ) ;
await expect ( contactElement ) . toContainText ( userName , { timeout : ANIMATION_TIMEOUT } ) ;
// Ensure no alerts are present before clicking
await expect ( page . locator ( 'div[role="alert"]' ) ) . toBeHidden ( ) ;
// Click the info icon with force option if needed
await page . locator ( ` li[data-testid="contactListItem"] h2:has-text(" ${ userName } ") + span svg.fa-circle-info ` ) . click ( { force : true } ) ;
// Wait for navigation to contact details page
await expect ( page . getByRole ( 'heading' , { name : 'Identifier Details' } ) ) . toBeVisible ( { timeout : NETWORK_TIMEOUT } ) ;
// Click edit button and wait for navigation
await page . locator ( 'h2 svg.fa-pen' ) . click ( ) ;
// Debug: Log all headings on the page
const headings = await page . locator ( 'h1, h2, h3, h4, h5, h6' ) . allInnerTexts ( ) ;
console . log ( 'Available headings:' , headings ) ;
// Then look for the actual heading we expect to see
await expect ( page . getByRole ( 'heading' , { name : 'Contact Methods' } ) ) . toBeVisible ( { timeout : NETWORK_TIMEOUT } ) ;
// Now look for the input field
const nameInput = page . getByTestId ( 'contactName' ) . locator ( 'input' ) ;
await expect ( nameInput ) . toBeVisible ( { timeout : NETWORK_TIMEOUT } ) ;
await expect ( nameInput ) . toHaveValue ( userName ) ;
// Perform rename with verification
await nameInput . fill ( contactName ) ;
await page . getByRole ( 'button' , { name : 'Save' } ) . click ( ) ;
// Wait for save to complete and verify new name
await expect ( page . locator ( 'h2' , { hasText : contactName } ) ) . toBeVisible ( { timeout : NETWORK_TIMEOUT } ) ;
// Record gift with error handling
try {
await recordGift ( page , contactName , finalTitle , randomNonZeroNumber ) ;
} catch ( e ) {
throw new Error ( ` Failed to record gift: ${ e instanceof Error ? e.message : String ( e ) } ` ) ;
}
// Switch users with verification
try {
await switchToUser00 ( page ) ;
} catch ( e ) {
throw new Error ( ` Failed to switch users: ${ e instanceof Error ? e.message : String ( e ) } ` ) ;
}
// Confirm gift with error handling
await confirmGift ( page , finalTitle ) ;
} catch ( error ) {
// Add more context to the error
if ( error instanceof Error && error . message . includes ( 'Edit Contact' ) ) {
console . error ( 'Failed to find Edit page heading. Available elements:' , await page . locator ( '*' ) . allInnerTexts ( ) ) ;
}
throw error ;
}
// Add new contact with verification
await page . goto ( './contacts' ) ;
await page . getByPlaceholder ( 'URL or DID, Name, Public Key' ) . fill ( ` did:ethr:0x0000694B58C2cC69658993A90D3840C560f2F51F, ${ userName } ` ) ;
await page . locator ( 'button > svg.fa-plus' ) . click ( ) ;
// Handle the registration alert properly
await handleRegistrationAlert ( page ) ;
// Add a small delay to ensure UI is stable
await page . waitForTimeout ( 500 ) ;
// Verify contact was added and is clickable
const contactElement = page . locator ( 'li.border-b' ) ;
await expect ( contactElement ) . toContainText ( userName , { timeout : ANIMATION_TIMEOUT } ) ;
// Ensure no alerts are present before clicking
await expect ( page . locator ( 'div[role="alert"]' ) ) . toBeHidden ( ) ;
// Click the info icon with force option if needed
await page . locator ( ` li[data-testid="contactListItem"] h2:has-text(" ${ userName } ") + span svg.fa-circle-info ` ) . click ( { force : true } ) ;
// Wait for navigation to contact details page
await expect ( page . getByRole ( 'heading' , { name : 'Identifier Details' } ) ) . toBeVisible ( { timeout : NETWORK_TIMEOUT } ) ;
// Click edit button and wait for navigation
await page . locator ( 'h2 svg.fa-pen' ) . click ( ) ;
// Debug: Log all headings on the page
const headings = await page . locator ( 'h1, h2, h3, h4, h5, h6' ) . allInnerTexts ( ) ;
console . log ( 'Available headings:' , headings ) ;
// Then look for the actual heading we expect to see
await expect ( page . getByRole ( 'heading' , { name : 'Contact Methods' } ) ) . toBeVisible ( { timeout : NETWORK_TIMEOUT } ) ;
// Now look for the input field
const nameInput = page . getByTestId ( 'contactName' ) . locator ( 'input' ) ;
await expect ( nameInput ) . toBeVisible ( { timeout : NETWORK_TIMEOUT } ) ;
await expect ( nameInput ) . toHaveValue ( userName ) ;
// Perform rename with verification
await nameInput . fill ( contactName ) ;
await page . getByRole ( 'button' , { name : 'Save' } ) . click ( ) ;
// Wait for save to complete and verify new name
await expect ( page . locator ( 'h2' , { hasText : contactName } ) ) . toBeVisible ( { timeout : NETWORK_TIMEOUT } ) ;
// Record gift with error handling
try {
await recordGift ( page , contactName , finalTitle , randomNonZeroNumber ) ;
} catch ( e ) {
throw new Error ( ` Failed to record gift: ${ e instanceof Error ? e.message : String ( e ) } ` ) ;
}
// Switch users with verification
try {
await switchToUser00 ( page ) ;
} catch ( e ) {
throw new Error ( ` Failed to switch users: ${ e instanceof Error ? e.message : String ( e ) } ` ) ;
}
// Confirm gift with error handling
await confirmGift ( page , finalTitle ) ;
} catch ( error ) {
// Add more context to the error
if ( error instanceof Error && error . message . includes ( 'Edit Contact' ) ) {
console . error ( 'Failed to find Edit page heading. Available elements:' , await page . locator ( '*' ) . allInnerTexts ( ) ) ;
}
throw error ;
}
} ) ;
} ) ;
// Helper functions
@ -158,22 +165,138 @@ async function dismissAlertWithRetry(page: Page, maxRetries = 3) {
}
async function recordGift ( page : Page , contactName : string , title : string , amount : number ) {
// First navigate to home
await page . goto ( './' ) ;
await page . getByTestId ( 'closeOnboardingAndFinish' ) . click ( ) ;
// Click on the contact name and wait for navigation
await page . getByRole ( 'heading' , { name : contactName } ) . click ( ) ;
await expect ( page . getByPlaceholder ( 'What was given' ) ) . toBeVisible ( { timeout : NETWORK_TIMEOUT } ) ;
// Fill in gift details
await page . getByPlaceholder ( 'What was given' ) . fill ( title ) ;
await page . getByRole ( 'spinbutton' ) . fill ( amount . toString ( ) ) ;
await page . getByRole ( 'button' , { name : 'Sign & Send' } ) . click ( ) ;
// Wait for confirmation
await expect ( page . getByText ( 'That gift was recorded.' ) ) . toBeVisible ( { timeout : NETWORK_TIMEOUT } ) ;
await page . locator ( 'div[role="alert"] button > svg.fa-xmark' ) . click ( ) ; // dismiss info alert
const TIMEOUT = getOSSpecificTimeout ( ) ;
let retryCount = 3 ;
while ( retryCount > 0 ) {
try {
console . log ( ` Gift recording attempt ${ 4 - retryCount } /3 ` ) ;
// First navigate to home and ensure it's loaded
await page . goto ( './' , { timeout : TIMEOUT } ) ;
await Promise . all ( [
page . waitForLoadState ( 'networkidle' , { timeout : TIMEOUT } ) ,
page . waitForLoadState ( 'domcontentloaded' , { timeout : TIMEOUT } )
] ) ;
// Handle onboarding first
const onboardingButton = page . getByTestId ( 'closeOnboardingAndFinish' ) ;
if ( await onboardingButton . isVisible ( ) ) {
console . log ( 'Closing onboarding dialog...' ) ;
await onboardingButton . click ( ) ;
await expect ( onboardingButton ) . toBeHidden ( ) ;
await page . waitForTimeout ( 1000 ) ;
}
// Navigate to contact's details page
await page . goto ( './contacts' , { timeout : TIMEOUT } ) ;
await page . waitForLoadState ( 'networkidle' , { timeout : TIMEOUT } ) ;
// Debug current state
console . log ( 'Current URL before clicking contact:' , await page . url ( ) ) ;
console . log ( 'Looking for contact:' , contactName ) ;
// Find and click contact name
const contactHeading = page . getByRole ( 'heading' , { name : contactName } ) . first ( ) ;
await expect ( contactHeading ) . toBeVisible ( { timeout : TIMEOUT } ) ;
await contactHeading . click ( ) ;
// Wait for navigation
await page . waitForLoadState ( 'networkidle' , { timeout : TIMEOUT } ) ;
console . log ( 'Current URL after clicking contact:' , await page . url ( ) ) ;
// Look for gift recording UI elements
const giftButton = page . locator ( [
'button:has-text("Record Gift")' ,
'button:has-text("Give")' ,
'[data-testid="recordGiftButton"]' ,
'a:has-text("Record Gift")' ,
'a:has-text("Give")'
] . join ( ',' ) ) ;
// Debug UI state
const allButtons = await page . locator ( 'button, a' ) . allInnerTexts ( ) ;
console . log ( 'Available buttons:' , allButtons ) ;
// Check if we need to click info first
const infoIcon = page . locator ( 'svg.fa-circle-info' ) . first ( ) ;
if ( await infoIcon . isVisible ( ) ) {
console . log ( 'Found info icon, clicking it first' ) ;
await infoIcon . click ( ) ;
await page . waitForLoadState ( 'networkidle' , { timeout : TIMEOUT } ) ;
}
// Now look for gift button again
if ( await giftButton . count ( ) === 0 ) {
console . log ( 'Gift button not found, taking screenshot' ) ;
await page . screenshot ( { path : 'test-results/missing-gift-button.png' , fullPage : true } ) ;
console . log ( 'Page content:' , await page . content ( ) ) ;
throw new Error ( 'Gift button not found on page' ) ;
}
await expect ( giftButton ) . toBeVisible ( { timeout : TIMEOUT } ) ;
await expect ( giftButton ) . toBeEnabled ( { timeout : TIMEOUT } ) ;
await giftButton . click ( ) ;
// Wait for navigation and form
await Promise . all ( [
page . waitForLoadState ( 'networkidle' , { timeout : TIMEOUT } ) ,
page . waitForLoadState ( 'domcontentloaded' , { timeout : TIMEOUT } )
] ) ;
const giftInput = page . getByPlaceholder ( 'What was given' ) ;
await expect ( giftInput ) . toBeVisible ( { timeout : TIMEOUT } ) ;
// Fill form with verification between steps
await giftInput . fill ( title ) ;
await page . waitForTimeout ( 500 ) ;
const amountInput = page . getByRole ( 'spinbutton' ) ;
await expect ( amountInput ) . toBeVisible ( { timeout : TIMEOUT } ) ;
await amountInput . fill ( amount . toString ( ) ) ;
await page . waitForTimeout ( 500 ) ;
// Submit and wait for response
const submitButton = page . getByRole ( 'button' , { name : 'Sign & Send' } ) ;
await expect ( submitButton ) . toBeEnabled ( { timeout : TIMEOUT } ) ;
await submitButton . click ( ) ;
// Wait for confirmation with API check
const confirmationTimeout = Date . now ( ) + TIMEOUT ;
while ( Date . now ( ) < confirmationTimeout ) {
const isVisible = await page . getByText ( 'That gift was recorded.' ) . isVisible ( ) ;
if ( isVisible ) break ;
await page . waitForTimeout ( 1000 ) ;
}
await expect ( page . getByText ( 'That gift was recorded.' ) ) . toBeVisible ( { timeout : 1000 } ) ;
// If we get here, everything worked
console . log ( 'Gift recording successful' ) ;
return ;
} catch ( error ) {
retryCount -- ;
console . log ( ` Gift recording attempt failed, ${ retryCount } retries remaining ` ) ;
console . error ( 'Error:' , error instanceof Error ? error.message : String ( error ) ) ;
// Take screenshot on failure
if ( ! page . isClosed ( ) ) {
await page . screenshot ( {
path : ` test-results/gift-recording-failure- ${ 4 - retryCount } .png ` ,
fullPage : true
} ) ;
}
if ( retryCount === 0 ) {
console . error ( 'All gift recording attempts failed' ) ;
throw error ;
}
await page . waitForTimeout ( 5000 ) ;
}
}
}
async function switchToUser00 ( page : Page ) {
@ -192,91 +315,55 @@ async function switchToUser00(page: Page) {
}
async function confirmGift ( page : Page , title : string ) {
await page . goto ( './' ) ;
await page . getByTestId ( 'closeOnboardingAndFinish' ) . click ( ) ;
// Wait for the gift to be visible and clickable
const giftElement = page . locator ( 'li' ) . filter ( { hasText : title } ) ;
await expect ( giftElement ) . toBeVisible ( { timeout : NETWORK_TIMEOUT } ) ;
// Route all API requests to port 3000
await page . route ( '**/api/**' , async route = > {
const url = new URL ( route . request ( ) . url ( ) ) ;
if ( url . port === '8081' ) {
const newUrl = ` http://localhost:3000 ${ url . pathname } ${ url . search } ` ;
console . log ( ` Redirecting ${ url . toString ( ) } to ${ newUrl } ` ) ;
route . continue ( { url : newUrl } ) ;
} else {
route . continue ( ) ;
}
} ) ;
const TIMEOUT = getOSSpecificTimeout ( ) ;
await giftElement . locator ( 'a' ) . click ( ) ;
// Wait for both load states with a try-catch
try {
await page . goto ( './' , { timeout : TIMEOUT } ) ;
await page . waitForLoadState ( 'networkidle' , { timeout : TIMEOUT } ) ;
// Close onboarding if present
const onboardingButton = page . getByTestId ( 'closeOnboardingAndFinish' ) ;
if ( await onboardingButton . isVisible ( ) ) {
await onboardingButton . click ( ) ;
await page . waitForTimeout ( 1000 ) ;
}
// Debug: Log page content
console . log ( 'Page content before finding gift:' , await page . content ( ) ) ;
// Wait for and find the gift element
const giftElement = page . locator ( 'li, div' ) . filter ( { hasText : title } ) . first ( ) ;
await expect ( giftElement ) . toBeVisible ( { timeout : TIMEOUT } ) ;
console . log ( 'Found gift element' ) ;
// Click and wait for navigation
await giftElement . click ( ) ;
await Promise . all ( [
page . waitForLoadState ( 'networkidle' , { timeout : NETWORK_TIMEOUT } ) ,
page . waitForLoadState ( 'domcontentloaded' , { timeout : NETWORK_TIMEOUT } )
] ) ;
} catch ( e ) {
console . log ( 'Load state error:' , e . message ) ;
}
// Debug: Log all headings and content
const headings = await page . locator ( 'h1, h2, h3, h4, h5, h6' ) . allInnerTexts ( ) ;
console . log ( 'Gift page headings:' , headings ) ;
// Log the current URL
console . log ( 'Current URL:' , page . url ( ) ) ;
// Check for error message and retry if needed
const errorMessage = page . getByText ( 'Something went wrong retrieving claim data' ) ;
const isError = await errorMessage . isVisible ( ) ;
if ( isError ) {
console . log ( 'Error detected, will retry' ) ;
await page . waitForTimeout ( 2000 ) ; // Increased delay
await page . goto ( './' ) ;
await page . waitForTimeout ( 2000 ) ; // Increased delay
await giftElement . locator ( 'a' ) . click ( ) ;
await page . waitForLoadState ( 'networkidle' , { timeout : NETWORK_TIMEOUT } ) ;
}
// Wait for either the confirm link or button with increased timeout
const confirmLink = page . getByTestId ( 'confirmGiftLink' ) ;
const confirmButton = page . getByTestId ( 'confirmGiftButton' ) ;
console . log ( 'Waiting for confirm element to be visible...' ) ;
try {
// Try both selectors with a longer timeout
const confirmElement = await Promise . race ( [
confirmLink . waitFor ( { state : 'visible' , timeout : NETWORK_TIMEOUT * 2 } ) . then ( ( ) = > confirmLink ) ,
confirmButton . waitFor ( { state : 'visible' , timeout : NETWORK_TIMEOUT * 2 } ) . then ( ( ) = > confirmButton )
page . waitForLoadState ( 'networkidle' , { timeout : TIMEOUT } ) ,
page . waitForLoadState ( 'domcontentloaded' , { timeout : TIMEOUT } )
] ) ;
// Log success and click
console . log ( 'Found confirm element, clicking...' ) ;
// Debug: Log available elements
console . log ( 'Page content after navigation:' , await page . content ( ) ) ;
// Try multiple selectors for confirm button
const confirmElement = page . locator ( [
'[data-testid="confirmGiftLink"]' ,
'[data-testid="confirmGiftButton"]' ,
'button:has-text("Confirm")' ,
'a:has-text("Confirm")'
] . join ( ',' ) ) ;
await expect ( confirmElement ) . toBeVisible ( { timeout : TIMEOUT } ) ;
await confirmElement . click ( ) ;
} catch ( e ) {
console . log ( 'Error finding confirm element:' , e . message ) ;
// Log the page content for debugging
console . log ( 'Page content:' , await page . content ( ) ) ;
throw e ;
// Wait for confirmation
await expect ( page . getByText ( 'Confirmation submitted.' ) ) . toBeVisible ( { timeout : TIMEOUT } ) ;
} catch ( error ) {
console . error ( 'Confirmation failed:' , error ) ;
await page . screenshot ( { path : 'test-results/confirmation-failure.png' } ) ;
throw error ;
}
// Handle confirmation dialog
const confirmDialogButton = page . getByRole ( 'button' , { name : 'Confirm' } ) ;
await expect ( confirmDialogButton ) . toBeVisible ( { timeout : NETWORK_TIMEOUT } ) ;
await confirmDialogButton . click ( ) ;
const yesButton = page . getByRole ( 'button' , { name : 'Yes' } ) ;
await expect ( yesButton ) . toBeVisible ( { timeout : NETWORK_TIMEOUT } ) ;
await yesButton . click ( ) ;
// Wait for confirmation
await expect ( page . getByText ( 'Confirmation submitted.' ) ) . toBeVisible ( { timeout : NETWORK_TIMEOUT } ) ;
}
async function handleRegistrationAlert ( page : Page ) {
Matthew Raymer
6 days ago