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

description("Test that different ways of changing an element's id all work properly.");

debug("\n1. Check id after parsing.");
shouldBe('document.getElementById("a")', 'document.body');
shouldBe('document.body.id', '"a"');
shouldBe('document.body.getAttributeNode("id").textContent', '"a"');

debug("\n2. Change Attr.value.");
document.body.getAttributeNode("id").value = "b";
shouldBe('document.getElementById("a")', 'null');
shouldBe('document.getElementById("b")', 'document.body');
shouldBe('document.body.getAttributeNode("id").textContent', '"b"');

debug("\n3. Change HTMLElement.id.");
document.body.id = "c";
shouldBe('document.getElementById("b")', 'null');
shouldBe('document.getElementById("c")', 'document.body');
shouldBe('document.body.getAttributeNode("id").textContent', '"c"');

debug("\n4. Change id attribute via setAttribute().");
document.body.setAttribute("id", "d");
shouldBe('document.getElementById("c")', 'null');
shouldBe('document.getElementById("d")', 'document.body');
shouldBe('document.body.getAttributeNode("id").textContent', '"d"');

debug("\n5. Change id attribute via setAttributeNS().");
document.body.setAttributeNS(null, "id", "e");
shouldBe('document.getElementById("d")', 'null');
shouldBe('document.getElementById("e")', 'document.body');
shouldBe('document.body.getAttributeNode("id").textContent', '"e"');

var attrNode = document.body.getAttributeNode("id");

debug("\n6. Change Attr.nodeValue.");
document.body.getAttributeNode("id").nodeValue = "f";
shouldBe('document.getElementById("e")', 'null');
shouldBe('document.getElementById("f")', 'document.body');
shouldBe('document.body.id', '"f"');
shouldBe('document.body.getAttribute("id")', '"f"');
shouldBe('attrNode.textContent', '"f"');
shouldBe('attrNode.childNodes.length', '0');

debug("\n7. Changing Attr.textContent.");
attrNode.textContent = "hi";
shouldBe('document.getElementById("i")', 'null');
shouldBe('document.getElementById("hi")', 'document.body');
shouldBe('document.body.id', '"hi"');
shouldBe('document.body.getAttribute("id")', '"hi"');
shouldBe('attrNode.textContent', '"hi"');
shouldBe('attrNode.childNodes.length', '0');

debug("\n8. Node.normalize(), joining text nodes.");
attrNode.normalize();
shouldBe('document.getElementById("hi")', 'document.body');
shouldBe('document.body.id', '"hi"');
shouldBe('document.body.getAttribute("id")', '"hi"');
shouldBe('document.body.getAttributeNode("id").textContent', '"hi"');
shouldBe('document.body.getAttributeNode("id").childNodes.length', '0');

debug("\n9. Remove an Attr node.");
document.body.removeAttributeNode(attrNode);
shouldBe('document.body.id', '""');
shouldBe('document.getElementById("mn")', 'null');
shouldBe('document.body.getAttribute("id")', 'null');
shouldBe('document.body.getAttributeNode("id")', 'null');

debug("\n10. Add an Attr node.");
var attrNode = document.createAttribute("id");
attrNode.value = "o";
document.body.setAttributeNode(attrNode);
shouldBe('document.getElementById("o")', 'document.body');
shouldBe('document.body.id', '"o"');
shouldBe('document.body.getAttribute("id")', '"o"');

debug("\n11. Add an Attr node over an existing one.");
var attrNode = document.createAttribute("id");
attrNode.value = "p";
document.body.setAttributeNode(attrNode);
shouldBe('document.getElementById("o")', 'null');
shouldBe('document.getElementById("p")', 'document.body');
shouldBe('document.body.id', '"p"');
shouldBe('document.body.getAttribute("id")', '"p"');
</script>
<script src="../../../resources/js-test-post.js"></script>
</body>
</html>