Description
Right now vue-friendly-iframe
exposes load
and iframe-load
events. however both of those event are triggered before the document from src url is loaded. I was testing both in chrome and firefox with vue-friendly-iframe
, I had my server take 3 seconds before returning html but vue-friendly-iframe
was triggering both of those events right away.
In the end I ended up having an onload
listener set on iframe and that worked well. I suggest refactoring load
event to be triggered after src loads. Looking at the code it seems that if we add event listener for load after iframeDoc.close(); //iframe onload event happens
line, then it should work correctly.
I can try to submit a PR if you agree with this approach.
Basically this would be the new setIframeUrl()
method:
setIframeUrl() {
if (this.iframeEl.contentWindow === null) {
setTimeout(this.setIframeUrl)
return;
}
const iframeDoc = this.iframeEl.contentWindow.document;
iframeDoc.open()
.write(
`
<body onload="window.location.replace('${this.src}'); parent.postMessage('${this.iframeLoadedMessage}', '*')"></body>
`
);
iframeDoc.close(); //iframe iframe-load event happens
const vm = this;
this.iframeEl.addEventListener("load", (e) => {
vm.$emit('load');
});