diff --git a/src/common/Frame.ts b/src/common/Frame.ts index 8a5507c87bbf4..9d2d7759f0a17 100644 --- a/src/common/Frame.ts +++ b/src/common/Frame.ts @@ -777,38 +777,35 @@ export class Frame { return this.worlds[MAIN_WORLD].transferHandle( await this.worlds[PUPPETEER_WORLD].evaluateHandle( async ({url, id, type, content}) => { + const promise = InjectedUtil.createDeferredPromise(); const script = document.createElement('script'); script.type = type; script.text = content; if (url) { script.src = url; - } - if (id) { - script.id = id; - } - let resolve: undefined | ((value?: unknown) => void); - const promise = new Promise((res, rej) => { - if (url) { - script.addEventListener('load', res, {once: true}); - } else { - resolve = res; - } + script.addEventListener( + 'load', + () => { + return promise.resolve(); + }, + {once: true} + ); script.addEventListener( 'error', event => { - let message = 'Could not load script'; - if (event instanceof ErrorEvent) { - message = event.message ?? message; - } - rej(message); + promise.reject( + new Error(event.message ?? 'Could not load script') + ); }, {once: true} ); - }); - document.head.appendChild(script); - if (resolve) { - resolve(); + } else { + promise.resolve(); + } + if (id) { + script.id = id; } + document.head.appendChild(script); await promise; return script; }, @@ -862,39 +859,38 @@ export class Frame { return this.worlds[MAIN_WORLD].transferHandle( await this.worlds[PUPPETEER_WORLD].evaluateHandle( async ({url, content}) => { + const promise = InjectedUtil.createDeferredPromise(); + let element: HTMLStyleElement | HTMLLinkElement; if (!url) { - const style = document.createElement('style'); - style.appendChild(document.createTextNode(content!)); - const promise = new Promise((res, rej) => { - style.addEventListener('load', res, {once: true}); - style.addEventListener( - 'error', - event => { - rej(event.message ?? 'Could not load style'); - }, - {once: true} - ); - }); - document.head.appendChild(style); - await promise; - return style; + element = document.createElement('style'); + element.appendChild(document.createTextNode(content!)); + } else { + const link = document.createElement('link'); + link.rel = 'stylesheet'; + link.href = url; + element = link; } - const link = document.createElement('link'); - link.rel = 'stylesheet'; - link.href = url; - const promise = new Promise((res, rej) => { - link.addEventListener('load', res, {once: true}); - link.addEventListener( - 'error', - event => { - rej(event.message ?? 'Could not load style'); - }, - {once: true} - ); - }); - document.head.appendChild(link); + element.addEventListener( + 'load', + () => { + promise.resolve(); + }, + {once: true} + ); + element.addEventListener( + 'error', + event => { + promise.reject( + new Error( + (event as ErrorEvent).message ?? 'Could not load style' + ) + ); + }, + {once: true} + ); + document.head.appendChild(element); await promise; - return link; + return element; }, options ) diff --git a/src/injected/injected.ts b/src/injected/injected.ts index f73435b390d64..7650a28fd5c16 100644 --- a/src/injected/injected.ts +++ b/src/injected/injected.ts @@ -1,3 +1,4 @@ +import {createDeferredPromise} from '../util/DeferredPromise.js'; import * as Poller from './Poller.js'; import * as util from './util.js'; @@ -7,6 +8,7 @@ Object.assign( InjectedUtil: { ...Poller, ...util, + createDeferredPromise, }, }) ); diff --git a/src/templates/injected.ts.tmpl b/src/templates/injected.ts.tmpl index 377e59cb8f135..bc13c1256a636 100644 --- a/src/templates/injected.ts.tmpl +++ b/src/templates/injected.ts.tmpl @@ -1,8 +1,11 @@ import * as Poller from '../injected/Poller.js'; import * as util from '../injected/util.js'; +import {createDeferredPromise} from '../util/DeferredPromise.js'; declare global { - const InjectedUtil: Readonly; + const InjectedUtil: Readonly & { + createDeferredPromise: typeof createDeferredPromise; + }; } /** @internal */