I am rendering an iFrame developed by a different org using:
<script type="text/javascript" src="https://externalUrl/popup.js"></script>
<iframe ref={iframeRef} id="ImportantFrame" src={iframeURL}></iframe>
The iframe contains among other things a close button, which when clicked calls a non-existent 'closePopUp()` function:
How can I insert my own function into my website which will handle this call if I cannot directly modify the code rendered by the iFrame?
Attempt 1
I tried embedding a function directly into my react code:
function closePopup() {
console.log('called react script')
}
But that didn't get called.
Attempt 2
I also tried creating a vanilla JS file with the following:
function closePopup() {
console.log('called custom script')
}
document.addEventListener("DOMContentLoaded", function(){
console.log('document loaded')
});
'document loaded' did appear on page load confirming that my custom vanilla JS works, but closePopUp() didn't get called.
Is there a way I can handle the function call without directly modifying the source code inside the rendered iFrame?
