Browser API: locationchange, securitychange, loadend and loadstart events

logs.js

/*

Expecting:

"http://news.ycombinator.com":
 0: mozbrowserloadstart: {"msg_name":"loadstart"}
 1: mozbrowserloadend: {"backgroundColor":"transparent","msg_name":"loadend"}
 2: mozbrowserloadstart: {"msg_name":"loadstart"}
 3: mozbrowsersecuritychange: {"state":"secure","extendedValidation":false,"trackingContent":false,"mixedContent":false,"msg_name":"securitychange"}
 4: mozbrowserlocationchange: "https://news.ycombinator.com/"
 5: mozbrowsersecuritychange: {"state":"secure","extendedValidation":false,"trackingContent":false,"mixedContent":false,"msg_name":"securitychange"}
 6: mozbrowserloadend: {"backgroundColor":"transparent","msg_name":"loadend"}

"http://duckduckgo.com/?q=test"
 1: mozbrowserloadstart: {"msg_name":"loadstart"}
 2: mozbrowserloadend: {"backgroundColor":"transparent","msg_name":"loadend"}
 3: mozbrowserloadstart: {"msg_name":"loadstart"}
 4: mozbrowsersecuritychange: {"state":"secure","extendedValidation":false,"trackingContent":false,"mixedContent":false,"msg_name":"securitychange"}
 5: mozbrowserlocationchange: "https://duckduckgo.com/?q=test"
 6: mozbrowsersecuritychange: {"state":"secure","extendedValidation":false,"trackingContent":false,"mixedContent":false,"msg_name":"securitychange"}
 7: mozbrowserlocationchange: "https://duckduckgo.com/?q=test&iax=1"
 8: mozbrowserlocationchange: "https://duckduckgo.com/?q=test&iax=1"
 9: mozbrowserlocationchange: "https://duckduckgo.com/?q=test&iax=1&ia=meanings"
 10: mozbrowserloadend: {"backgroundColor":"rgb(255, 255, 255)","msg_name":"loadend"}


"http://encrypted.google.com/search?q=test"
 0: mozbrowserloadstart: {"msg_name":"loadstart"}
 1: mozbrowserloadend: {"backgroundColor":"transparent","msg_name":"loadend"}
 2: mozbrowserloadstart: {"msg_name":"loadstart"}
 3: mozbrowsersecuritychange: {"state":"secure","extendedValidation":false,"trackingContent":false,"mixedContent":false,"msg_name":"securitychange"}
 4: mozbrowserlocationchange: "https://encrypted.google.com/search?q=test"
 5: mozbrowsersecuritychange: {"state":"secure","extendedValidation":false,"trackingContent":false,"mixedContent":false,"msg_name":"securitychange"}
 6: mozbrowserloadend: {"backgroundColor":"rgb(255, 255, 255)","msg_name":"loadend"}

*/


var pre = document.querySelector("pre");

var iframe = document.createElement("iframe");
var count = 0;
function log(str) {
  console.log(str);
  pre.textContent += `\n ${count++}: ${str}`;
}
function logEvent(e) {
  log(`${e.type}: ${JSON.stringify(e.detail)}`);
}

iframe.addEventListener("mozbrowserloadstart", logEvent);
iframe.addEventListener("mozbrowserloadend", logEvent);
iframe.addEventListener("mozbrowserlocationchange", logEvent);
iframe.addEventListener("mozbrowsersecuritychange", logEvent);

iframe.setAttribute("mozbrowser", "true");
iframe.setAttribute("remote", "true");
iframe.setAttribute("src", "about:blank");

document.body.insertBefore(iframe, pre);

iframe.setAttribute("src", "http://encrypted.google.com/search?q=test");