mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-11-01 14:45:29 +00:00
360 lines
10 KiB
HTML
360 lines
10 KiB
HTML
<!DOCTYPE html [
|
|
<!ATTLIST ns:x id ID #REQUIRED>
|
|
<!ATTLIST ns2:x id_2 ID #REQUIRED>
|
|
]>
|
|
<html xmlns="http://www.w3.org/1999/xhtml"
|
|
xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
|
|
xmlns:svg="http://www.w3.org/2000/svg"
|
|
xmlns:ns="urn:namespace"
|
|
xmlns:ns2="urn:namespace">
|
|
<!--
|
|
https://bugzilla.mozilla.org/show_bug.cgi?id=564863
|
|
-->
|
|
<head>
|
|
<title>Test for Bug 564863</title>
|
|
<script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
|
|
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
|
|
<style>
|
|
* {
|
|
color: rgb(0, 0, 0);
|
|
}
|
|
#div_id {
|
|
color: rgb(10, 10, 10);
|
|
}
|
|
#a_id {
|
|
color: rgb(20, 20, 20);
|
|
}
|
|
#xul_id {
|
|
color: rgb(30, 30, 30);
|
|
}
|
|
#svg_id {
|
|
color: rgb(40, 40, 40);
|
|
}
|
|
#ns_id {
|
|
color: rgb(50, 50, 50);
|
|
}
|
|
#ns2_id {
|
|
color: rgb(60, 60, 60);
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=564863">Mozilla Bug 564863</a>
|
|
<!-- Elements to ensure we have nodeinfos with id-attribute set -->
|
|
<div><ns:x id="ns-holder"/><ns2:x id_2="ns2-holder"/></div>
|
|
|
|
<!-- DOM to muck around with for tests -->
|
|
<p id="root">
|
|
<div id="div_id" />
|
|
<a id="a_id" />
|
|
<xul:button id="xul_id" />
|
|
<svg:svg><svg:g id="svg_id" /></svg:svg>
|
|
<ns:x id="ns_id" />
|
|
</p>
|
|
|
|
<pre id="test">
|
|
<script class="testbody" type="text/javascript">
|
|
<![CDATA[
|
|
|
|
root = $('root');
|
|
div = root.children[0];
|
|
a = root.children[1];
|
|
xul = root.children[2];
|
|
svg = root.children[3].firstChild;
|
|
nsx = root.children[4];
|
|
|
|
var div_cs = getComputedStyle(div, "");
|
|
var a_cs = getComputedStyle(a, "");
|
|
var xul_cs = getComputedStyle(xul, "");
|
|
var svg_cs = getComputedStyle(svg, "");
|
|
var nsx_cs = getComputedStyle(nsx, "");
|
|
|
|
function checkHasId(test) {
|
|
// Check computed style first to avoid flushes from hiding problems
|
|
checkHasIdNoGEBI(test);
|
|
|
|
is($("div_id"), div, "div getElementById " + test);
|
|
is($("a_id"), a, "a getElementById " + test);
|
|
is($("xul_id"), xul, "xul getElementById " + test);
|
|
is($("svg_id"), svg, "svg getElementById " + test);
|
|
is($("ns_id"), nsx, "ns getElementById " + test);
|
|
}
|
|
|
|
function checkHasIdNoGEBI(test) {
|
|
is(div_cs.color, "rgb(10, 10, 10)", "div color " + test);
|
|
is(a_cs.color, "rgb(20, 20, 20)", "a color " + test);
|
|
is(xul_cs.color, "rgb(30, 30, 30)", "xul color " + test);
|
|
is(svg_cs.color, "rgb(40, 40, 40)", "svg color " + test);
|
|
is(nsx_cs.color, "rgb(50, 50, 50)", "nsx color " + test);
|
|
|
|
is(div.id, "div_id", "div id " + test);
|
|
is(a.id, "a_id", "a id " + test);
|
|
is(xul.id, "xul_id", "xul id " + test);
|
|
is(svg.id, "svg_id", "svg id " + test);
|
|
is (nsx.getAttribute("id"), "ns_id", "ns id " + test);
|
|
}
|
|
|
|
function checkHasNoId(removed, test) {
|
|
is(div_cs.color, "rgb(0, 0, 0)", "div color " + test);
|
|
is(a_cs.color, "rgb(0, 0, 0)", "a color " + test);
|
|
is(xul_cs.color, "rgb(0, 0, 0)", "xul color " + test);
|
|
is(svg_cs.color, "rgb(0, 0, 0)", "svg color " + test);
|
|
is(nsx_cs.color, "rgb(0, 0, 0)", "nsx color " + test);
|
|
|
|
attrValue = removed ? null : "";
|
|
|
|
is(div.id, "", "div id " + test);
|
|
is(a.id, "", "a id " + test);
|
|
is(xul.id, "", "xul id " + test);
|
|
is(svg.id, "", "svg id " + test);
|
|
|
|
is(div.getAttribute("id"), attrValue, "div getAttribute " + test);
|
|
is(a.getAttribute("id"), attrValue, "a getAttribute " + test);
|
|
is(xul.getAttribute("id"), "", "xul getAttribute " + test);
|
|
is(svg.getAttribute("id"), attrValue, "svg getAttribute " + test);
|
|
is(nsx.getAttribute("id"), attrValue, "ns getAttribute " + test);
|
|
|
|
is($("div_id"), null, "div getElementById " + test);
|
|
is($("a_id"), null, "a getElementById " + test);
|
|
is($("xul_id"), null, "xul getElementById " + test);
|
|
is($("svg_id"), null, "svg getElementById " + test);
|
|
is($("ns_id"), null, "ns getElementById " + test);
|
|
}
|
|
|
|
// Check that dynamic modifications of attribute work
|
|
|
|
checkHasId("in markup");
|
|
|
|
div.id = "";
|
|
a.id = "";
|
|
xul.id = "";
|
|
svg.id = "";
|
|
nsx.setAttribute("id", "");
|
|
|
|
checkHasNoId(false, "set to empty");
|
|
|
|
div.id = "div_id";
|
|
a.id = "a_id";
|
|
xul.id = "xul_id";
|
|
svg.id = "svg_id";
|
|
nsx.setAttribute("id", "ns_id");
|
|
|
|
checkHasId("set using .id");
|
|
|
|
div.setAttribute("id", "");
|
|
a.setAttribute("id", "");
|
|
xul.setAttribute("id", "");
|
|
svg.setAttribute("id", "");
|
|
nsx.setAttribute("id", "");
|
|
|
|
checkHasNoId(false, "setAttribute to empty");
|
|
|
|
div.id = "div_id";
|
|
a.id = "a_id";
|
|
xul.id = "xul_id";
|
|
svg.id = "svg_id";
|
|
nsx.setAttribute("id", "ns_id");
|
|
|
|
checkHasId("set again using .id");
|
|
|
|
div.removeAttribute("id");
|
|
a.removeAttribute("id");
|
|
xul.removeAttribute("id");
|
|
svg.removeAttribute("id");
|
|
nsx.removeAttribute("id");
|
|
|
|
checkHasNoId(true, "removed attribute");
|
|
|
|
div.setAttribute("id", "div_id");
|
|
a.setAttribute("id", "a_id");
|
|
xul.setAttribute("id", "xul_id");
|
|
svg.setAttribute("id", "svg_id");
|
|
nsx.setAttribute("id", "ns_id");
|
|
|
|
checkHasId("set using setAttribute");
|
|
|
|
t1 = document.createElement("div");
|
|
t1.id = "div_id";
|
|
t2 = document.createElement("a");
|
|
t2.id = "a_id";
|
|
t3 = document.createElementNS("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul", "button");
|
|
t3.id = "xul_id";
|
|
t4 = document.createElementNS("http://www.w3.org/2000/svg", "g");
|
|
t4.id = "svg_id";
|
|
t5 = document.createElementNS("urn:namespace", "ns:x");
|
|
t5.setAttribute("id", "ns_id");
|
|
|
|
// Check that inserting elements before/after existing work
|
|
|
|
function insertAfter(newChild, existing) {
|
|
existing.parentNode.insertBefore(newChild, existing.nextSibling);
|
|
}
|
|
function insertBefore(newChild, existing) {
|
|
existing.parentNode.insertBefore(newChild, existing);
|
|
}
|
|
function removeNode(child) {
|
|
child.parentNode.removeChild(child);
|
|
}
|
|
|
|
insertAfter(t1, div);
|
|
insertAfter(t2, a);
|
|
insertAfter(t3, xul);
|
|
insertAfter(t4, svg);
|
|
insertAfter(t5, nsx);
|
|
|
|
checkHasId("inserted after");
|
|
|
|
insertBefore(t1, div);
|
|
insertBefore(t2, a);
|
|
insertBefore(t3, xul);
|
|
insertBefore(t4, svg);
|
|
insertBefore(t5, nsx);
|
|
|
|
checkHasIdNoGEBI("inserted before");
|
|
is($("div_id"), t1, "div getElementById inserted before");
|
|
is($("a_id"), t2, "a getElementById inserted before");
|
|
is($("xul_id"), t3, "xul getElementById inserted before");
|
|
is($("svg_id"), t4, "svg getElementById inserted before");
|
|
is($("ns_id"), t5, "ns getElementById inserted before");
|
|
|
|
t1.removeAttribute("id");
|
|
t2.removeAttribute("id");
|
|
t3.removeAttribute("id");
|
|
t4.removeAttribute("id");
|
|
t5.removeAttribute("id");
|
|
|
|
checkHasId("removed tx attribute");
|
|
|
|
t1.setAttribute("id", "div_id");
|
|
t2.setAttribute("id", "a_id");
|
|
t3.setAttribute("id", "xul_id");
|
|
t4.setAttribute("id", "svg_id");
|
|
t5.setAttribute("id", "ns_id");
|
|
|
|
checkHasIdNoGEBI("setAttribute before");
|
|
is($("div_id"), t1, "div getElementById setAttribute before");
|
|
is($("a_id"), t2, "a getElementById setAttribute before");
|
|
is($("xul_id"), t3, "xul getElementById setAttribute before");
|
|
is($("svg_id"), t4, "svg getElementById setAttribute before");
|
|
is($("ns_id"), t5, "ns getElementById setAttribute before");
|
|
|
|
removeNode(t1);
|
|
removeNode(t2);
|
|
removeNode(t3);
|
|
removeNode(t4);
|
|
removeNode(t5);
|
|
|
|
checkHasId("removed temporaries");
|
|
|
|
removeNode(div);
|
|
removeNode(a);
|
|
removeNode(xul);
|
|
removeNode(svg);
|
|
removeNode(nsx);
|
|
|
|
checkHasIdNoGEBI("removed node");
|
|
|
|
// Check that removing an element during UnsetAttr works
|
|
is(div.id, "div_id", "div still has id set");
|
|
var mutateFired = false;
|
|
root.appendChild(div);
|
|
div.addEventListener("DOMAttrModified", function(e) {
|
|
div.removeEventListener("DOMAttrModified", arguments.callee, false);
|
|
is(e.target, div, "target is div");
|
|
is(div.id, "", "div no longer has id");
|
|
is(div.getAttribute("id"), null, "div no longer has id attr");
|
|
removeNode(div);
|
|
is(div.parentNode, null, "div was removed");
|
|
mutateFired = true;
|
|
}, false);
|
|
div.removeAttribute("id");
|
|
ok(mutateFired, "mutation event fired");
|
|
|
|
// Check same for XML elements
|
|
is(nsx.getAttribute("id"), "ns_id", "nsx still has id set");
|
|
mutateFired = false;
|
|
root.appendChild(nsx);
|
|
nsx.addEventListener("DOMAttrModified", function(e) {
|
|
nsx.removeEventListener("DOMAttrModified", arguments.callee, false);
|
|
is(e.target, nsx, "target is nsx");
|
|
is(nsx.getAttribute("id"), null, "nsx no longer has id attr");
|
|
removeNode(nsx);
|
|
is(nsx.parentNode, null, "nsx was removed");
|
|
mutateFired = true;
|
|
}, false);
|
|
nsx.removeAttribute("id");
|
|
ok(mutateFired, "mutation event fired");
|
|
|
|
|
|
// Re-add the id inside a mutation event on a XML element
|
|
is($("ns_id"), null, "no nsx");
|
|
is($("ns2_id"), null, "no nsx");
|
|
nsx = document.createElementNS("urn:namespace", "ns:x");
|
|
nsx.setAttribute("id", "ns_id");
|
|
root.appendChild(nsx);
|
|
is($("ns_id"), nsx, "new nsx is set up");
|
|
mutateFired = false;
|
|
nsx.addEventListener("DOMAttrModified", function(e) {
|
|
nsx.removeEventListener("DOMAttrModified", arguments.callee, false);
|
|
is(e.target, nsx, "target is nsx");
|
|
is(nsx.getAttribute("id"), null, "nsx no longer has id attr");
|
|
nsx.setAttribute("id", "other_id");
|
|
mutateFired = true;
|
|
}, false);
|
|
nsx.removeAttribute("id");
|
|
ok(mutateFired, "mutation event fired");
|
|
is($("ns_id"), null, "ns_id was removed from table");
|
|
is($("other_id"), nsx, "other_id was added");
|
|
removeNode(nsx);
|
|
is($("other_id"), null, "other_id was removed");
|
|
|
|
// Re-add the id inside a mutation event on a HTML element
|
|
is($("div_id"), null, "no div");
|
|
div = document.createElement("div");
|
|
div.id = "div_id";
|
|
root.appendChild(div);
|
|
is($("div_id"), div, "new div is set up");
|
|
mutateFired = false;
|
|
div.addEventListener("DOMAttrModified", function(e) {
|
|
div.removeEventListener("DOMAttrModified", arguments.callee, false);
|
|
is(e.target, div, "target is div");
|
|
is(div.getAttribute("id"), null, "div no longer has id attr");
|
|
is(div.id, "", "div no longer has id");
|
|
div.id = "other_div_id";
|
|
mutateFired = true;
|
|
}, false);
|
|
div.removeAttribute("id");
|
|
ok(mutateFired, "mutation event fired");
|
|
is($("div_id"), null, "div_id was removed from table");
|
|
is($("other_div_id"), div, "other_div_id was added");
|
|
removeNode(div);
|
|
is($("other_div_id"), null, "other_div_id was removed");
|
|
|
|
// Re-add the id inside a mutation event on a XUL element
|
|
is($("xul_id"), null, "no xul");
|
|
xul = document.createElementNS("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul", "button");
|
|
xul.id = "xul_id";
|
|
root.appendChild(xul);
|
|
is($("xul_id"), xul, "new xul is set up");
|
|
mutateFired = false;
|
|
xul.addEventListener("DOMAttrModified", function(e) {
|
|
xul.removeEventListener("DOMAttrModified", arguments.callee, false);
|
|
is(e.target, xul, "target is xul");
|
|
is(xul.getAttribute("id"), "", "xul no longer has id attr");
|
|
is(xul.id, "", "xul no longer has id");
|
|
xul.id = "other_xul_id";
|
|
mutateFired = true;
|
|
}, false);
|
|
xul.removeAttribute("id");
|
|
ok(mutateFired, "mutation event fired");
|
|
is($("xul_id"), null, "xul_id was removed from table");
|
|
is($("other_xul_id"), xul, "other_xul_id was added");
|
|
removeNode(xul);
|
|
is($("other_xul_id"), null, "other_xul_id was removed");
|
|
|
|
]]>
|
|
</script>
|
|
</pre>
|
|
</body>
|
|
</html>
|