<!DOCTYPE html>
<html>
<head>
<script src="../../resources/js-test.js"></script>
</head>
<body>
<script>

function handle(list, id, event)
{
    list.push(event.type + "@" + id);
}

function testEventsFiredOn(doc)
{
    window.caughtFoo = [];
    var root = doc.documentElement;
    var target = doc.getElementById("target");

    target.addEventListener("foo", handle.bind(null, caughtFoo, "target"));
    target.setAttribute("onclick", "caughtFoo.push('click@target')");
    root.addEventListener("foo", handle.bind(null, caughtFoo, "root"));
    root.setAttribute("onclick", "caughtFoo.push('click@root')");

    window.caughtFoo.length = 0;
    target.dispatchEvent(new CustomEvent("foo", { bubbles: true }));
    shouldBe("window.caughtFoo", "['foo@target', 'foo@root']");

    window.caughtFoo.length = 0;
    target.dispatchEvent(new MouseEvent("click", { bubbles: true }));
    shouldBe("window.caughtFoo", "[]");
}

var htmlDoc = document.implementation.createHTMLDocument("");
htmlDoc.documentElement.innerHTML = "<body><div id='target'></div></body>";
testEventsFiredOn(htmlDoc);

var xhtmlDoc = document.implementation.createDocument('http://www.w3.org/1999/xhtml', 'html', null);
xhtmlDoc.documentElement.innerHTML = "<body><div id='target'></div></body>";
testEventsFiredOn(xhtmlDoc);

var svgDoc = document.implementation.createDocument('http://www.w3.org/2000/svg', 'svg', null);
var target = svgDoc.createElement("g");
target.setAttribute("id", "target");
svgDoc.documentElement.appendChild(target);
testEventsFiredOn(xhtmlDoc);

var xmlDoc = document.implementation.createDocument('http://www.example.com/', 'foo', null);
var target = xmlDoc.createElement("bar");
target.setAttribute("id", "target");
xmlDoc.documentElement.appendChild(target);
testEventsFiredOn(xmlDoc);

</script>
</body>
</html>