How to dynamically set "src" for browser or iframe element (Firefox extension)

Question

I am trying to create a Firefox extension that uses a flex application. I have tried to wrap it in XUL types (<iframe> and <browser>) and I have no preference as to which one I use... whichever works.

The problem is that whenever I use a relative path (access through chrome:// or mySWF.html) the flash fails to load.

I have a method to search for the absolute path (it's posted below) but I cannot for the life of me figure out a way to dynamically change the src of either an iframe or browser.

 <script type="text/javascript">
 function loadSWF() {
  alert("loadSWF!");
  var fullPath = "file:///" + extensionPath.path.replace(/\\/g,"/") +  "/chrome/content/HelloWorld.html";
  top.document.getElementById('AppFrame').setAttribute("src",fullPath);
 }
 </script>

Below are my 2 methods of calling the flex app:

 <iframe
  type="content"
  src=??????
  flex="1"
  id="AppFrame"
  name="AppFrame"
  onLoad="loadSWF();"/>

 <browser 
  id="browserid"
  type="content"
  src=??????
  flex="1"/>

How can I call my function to set the src attribute???

Sounds like you may not have set up your chrome manifest correctly. developer.mozilla.org/en/chrome_manifest — MatrixFrog

Nickolay Nickolay · Accepted Answer · 2011-07-17T10:50:50

1) Dynamically setting src works fine (see testcase below).

2) To get a URL of a file, use nsIIOService.newFileURI() instead of trying to convert by hand.

3) onLoad="loadSWF();" in your iframe is suspicious, you should have posted the complete XUL code that shows how it all fits together. You should call loadSWF not from the iframe's load handler, but from your XUL document's load handler or off another event.

Testcase for #1:

<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<window id="yourwindow" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:html="http://www.w3.org/1999/xhtml">
<script type="text/javascript">
<![CDATA[
function f() {
 document.getElementById("z").setAttribute("src", "http://google.com/")
}
]]>
</script>
<iframe type="content" id="z"/>
<button onclick="f()"/>
</window>

How to dynamically set "src" for browser or iframe element (Firefox extension)

1 Answers