In XUL, how do I know a browser-tag has finished loading?

Question

I'm developing a firefox extension based on this tutorial which is a FF 2.0 extension (second part of the tutorial is at this url)

The main thing that is important is that it uses

<iframe id="contentview" src="http://www.ibm.com/developerworks/web" flex="2"/>

In the backend code, when clicking the GO button, this happens:

contentview.contentDocument.location.href = urlbox.value;

//Use Firefox XPath to get the raw text of the document
var doctext = contentview.contentDocument.evaluate(
    "string(.)", document, null, XPathResult.STRING_TYPE, null).stringValue;

I get an error with the xpath, but that's not my question. The issue I have with FF 3.0 is that the contentDocument value refers to the old site loaded, not to the one loaded by the href-change.

So my question is: how can I create a similar window, but be notified someone when the loaded document is complete, so I can access its DOM?

Cassius

Answer 1

Updated: first you need to handle the load event of the window then you add an event listener to the iframe element

window.addEventListener("load",Listen,false);
function Listen()
{
  var frame = document.getElementById("contentview");
  frame.addEventListener("DOMContentLoaded", DomLoadedEventHandler, true);          
}

    function DomLoadedEventHandler() {
    var frame = document.getElementById("contentview");
    alert(frame.contentDocument.location.href);
    }

replace "DomLoadedEventHandler" with your event handler name.

I recommend that you take a look at the official site of Mozilla to learn everything about Firefox extensions

http://developer.mozilla.com

Transference

Doesn't work entirely though. When I click GO, your code does not get called (I never see the alert, I mean). Then when I look at the error console, the first time i click GO, nothing happens. Second time, I see "doc.location is undefined". I'm guessing what happens is same as the original extension code: it gets called on the previous loaded page? Not the one being loaded? – Cassius

Still not 100%, but very close! I've put your code at the same level as the change_url function (instead of inside). Then commented all code related to that section within the change_url function of course. One issue still remains, the 'doc' parameter is of type Event, not Document. More getElementById magic? – Cassius

then no problem, just get document from the contendDocument property. I will update the answer – Transference

Thanks, got it working mostly the way I want. I changed the DomLoadedEventHandler function to this: function DomLoadedEventHandler(e) { var frame = document.getElementById("contentview"); if (e.target == frame.contentDocument) { alert("main frame loaded"); } } because some pages consist of iframes themselves, and so the function gets called multiple times, which could get annoying for automatic processing. Anyway, I can handle the situation from there I think. So thanks again! – Cassius