typescript - Hvordan vente på at bildet er fullstendig gjengitt i Playwright

Jeg har et problem med en av testene mine. I prosjektet mitt bruker jeg Playwright 1.37.1 og Typescript 5.1.6. Jeg vil sammenligne bilder ved hjelp av snapshot-metoden. Problemet er at skjermbildet under testene ikke er helt rendret, og påstandene mine feiler alltid. Jeg har prøvd å bruke noen ventemetoder, f.eks. waitForSelector(), waitForLoadState(), men det hjelper ikke. Bare hvis jeg bruker koden nedenfor fungerer det.

await new Promise(resolve => setTimeout(resolve, 1000)); // 1000 milliseconds = 1 second

Kjenner du til bedre løsninger? :) Takk for alle tips :)

Svar #1

Bildet(er) kan lastes inn tregt, prøv å rulle for å vente til alle bildene er fullstendig lastet:

I koden nedenfor vil du vente på at alle bilder lastes inn parallelt, så den vil bare vente til lastetiden for bildet som tar lengst tid å laste.

// Trigger loading of all images
let locators=  page.locator('//img')
await locators.evaluateAll(e => e.scrollIntoView());
// Set up listeners concurrently
const promises = locators.map(locator => locator.evaluate(image => image.complete || new Promise(f => image.onload = f)));
// Wait for all once
await Promise.all(promises);

Referanse: https://github.com/microsoft/playwright/issues/14388#issuecomment-1147769469

/rediger: skrivefeil