How to wait for all images to be loaded?

[nicodemuz]

I tried the following code, but it did not seem to work:

$client->waitForVisibility('img');

[nicodemuz]

Hmmm, I'm not sure if it's cause my images have loading="lazy" attribute..

[nicodemuz]

This seems to be a workaround:

$client->executeScript("
    Promise.all(Array.from(document.images).filter(img => !img.complete).map(img => new Promise(resolve => { img.onload = img.onerror = resolve; }))).then(() => {
        console.log('All images loaded.');
        var div = document.createElement('div');
        div.setAttribute('id', 'imagesLoaded');
        div.innerHTML = 'Images loaded';
        document.body.appendChild(div);
    });
");

$client->waitForVisibility('div#imagesLoaded');

You can then continue to remove the appended div if needed.