Question

We are trying to get tinyMCE object from DOM in order to set the text but unfortunately when we are injecting the javascript code in the page it is not working while the same code executes perfectly in the Javascript Console (Chrome).

The code is the following:

<script language="javascript">
 var testing = 'test';
 var curFrames;
 var curUrl;
 var mFrames;
 var cFrame;
 var editor;
 var editor2;

 window.onload=CodeOnLoad ;

//Javascript that runs on load
function CodeOnLoad() {
  curFrames=document.getElementsByTagName("frame");  


curFrames[0].onload = function() {
  curUrl= curFrames[0].contentDocument.getElementById("the_iframe").src;
  console.log(curUrl)

  if (curUrl.indexOf("post")!=-1)
  {
     mFrames=document.getElementsByTagName("frame");
     cFrame = mFrames[0].contentDocument.getElementById('the_iframe');
     editor = cFrame.contentWindow.tinymce;
     editor2 = editor.activeEditor;
  }
 }
}
</script>

The above code will allow us to use :

editor.activeEditor (which will return the correct editor object) // Only when we test it in the Browser Javascript console

while:

editor2 = editor.activeEditor; (the last line of the code - will return null) 

Answer 1

Two things to be aware of:

1. When the parent window finishes loading, there is absolutely no guarantee that the content of the iframe’s inside of it have finished loading.

2. You can not access properties of an iframe (such as contentWindow or contentDocument) if the iframe’s source is loaded from a different domain.