diff --git a/ext/js/templates/template-renderer-frame-api.js b/ext/js/templates/template-renderer-frame-api.js index dd6be517..f234c8e0 100644 --- a/ext/js/templates/template-renderer-frame-api.js +++ b/ext/js/templates/template-renderer-frame-api.js @@ -27,6 +27,7 @@ class TemplateRendererFrameApi { prepare() { window.addEventListener('message', this._onWindowMessage.bind(this), false); + this._postMessage(window.parent, 'ready', {}, null); } // Private @@ -52,7 +53,7 @@ class TemplateRendererFrameApi { } if (typeof id === 'undefined') { return; } - source.postMessage({action: `${action}.response`, params: response, id}, '*'); + this._postMessage(source, `${action}.response`, response, id); } _onRender({template, data, type}) { @@ -101,4 +102,8 @@ class TemplateRendererFrameApi { _clone(value) { return JSON.parse(JSON.stringify(value)); } + + _postMessage(target, action, params, id) { + return target.postMessage({action, params, id}, '*'); + } } diff --git a/ext/js/templates/template-renderer-proxy.js b/ext/js/templates/template-renderer-proxy.js index f35239cb..b93fdd6b 100644 --- a/ext/js/templates/template-renderer-proxy.js +++ b/ext/js/templates/template-renderer-proxy.js @@ -67,31 +67,33 @@ class TemplateRendererProxy { _loadFrame(frame, url, timeout=5000) { return new Promise((resolve, reject) => { - let ready = false; const cleanup = () => { - frame.removeEventListener('load', onLoad, false); + window.removeEventListener('message', onWindowMessage, false); if (timer !== null) { clearTimeout(timer); timer = null; } }; - const onLoad = () => { - if (!ready) { return; } + const onWindowMessage = (e) => { + const frameWindow = frame.contentWindow; + if (frameWindow === null || frameWindow !== e.source) { return; } + const {data} = e; + if (!(typeof data === 'object' && data !== null && data.action === 'ready')) { return; } cleanup(); resolve(); }; let timer = setTimeout(() => { + timer = null; cleanup(); reject(new Error('Timeout')); }, timeout); frame.removeAttribute('src'); frame.removeAttribute('srcdoc'); - frame.addEventListener('load', onLoad, false); + window.addEventListener('message', onWindowMessage, false); try { document.body.appendChild(frame); - ready = true; frame.contentDocument.location.href = url; } catch (e) { cleanup();