diff --git a/src/elements/core/testing/wait-for-image-ready.ts b/src/elements/core/testing/wait-for-image-ready.ts index 578a920e66..2d1a106fe4 100644 --- a/src/elements/core/testing/wait-for-image-ready.ts +++ b/src/elements/core/testing/wait-for-image-ready.ts @@ -5,26 +5,37 @@ export async function waitForImageReady( element: HTMLImageElement | SbbImageElement, timeoutInMilliseconds = 2 * 1000, ): Promise { + const imgElement = + element.localName === 'sbb-image' + ? (element.shadowRoot?.querySelector('.sbb-image__img') ?? null) + : (element as HTMLImageElement); + + if (!imgElement) { + return Promise.reject('img tag not found'); + } + if (!element.complete) { await new Promise((resolve, reject) => { const timeout = setTimeout(() => reject('image loading timeout'), timeoutInMilliseconds); element.addEventListener('load', () => { clearTimeout(timeout); - if (element instanceof HTMLImageElement) { - element.decode().then(resolve); - } else if (isSafari && element.localName === 'sbb-image') { - // On a test this is only happening once (first time an image is loaded). Therefore, the impact is very small. - setTimeout(resolve, 200); - } else { - resolve(); - } + + imgElement.decode().then(() => { + if (isSafari && element.localName === 'sbb-image') { + // On a test page this is only happening once (first time an image is loaded). Therefore, the impact is very small. + setTimeout(resolve, 100); + } else { + resolve(); + } + }); }); + element.addEventListener('error', () => { clearTimeout(timeout); reject('image error'); }); }); - } else if (element instanceof HTMLImageElement) { - await element.decode(); + } else { + await imgElement.decode(); } }