diff options
Diffstat (limited to '')
| -rw-r--r-- | dom/base/test/test_bug564863.xhtml | 305 |
1 files changed, 305 insertions, 0 deletions
diff --git a/dom/base/test/test_bug564863.xhtml b/dom/base/test/test_bug564863.xhtml new file mode 100644 index 0000000000..18a934b1d5 --- /dev/null +++ b/dom/base/test/test_bug564863.xhtml @@ -0,0 +1,305 @@ +<!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 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); +} +#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" /> +<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]; +svg = root.children[2].firstChild; +nsx = root.children[3]; + +var div_cs = getComputedStyle(div, ""); +var a_cs = getComputedStyle(a, ""); +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($("svg_id"), svg, "svg getElementById " + test); + is($("ns_id"), nsx, "ns getElementById " + test); +} + +function checkHasIdNoGEBI(test) { + const connected = test != "removed node"; + is(div_cs.color, connected ? "rgb(10, 10, 10)" : "", "div color " + test); + is(a_cs.color, connected ? "rgb(20, 20, 20)" : "", "a color " + test); + is(svg_cs.color, connected ? "rgb(40, 40, 40)" : "", "svg color " + test); + is(nsx_cs.color, connected ? "rgb(50, 50, 50)" : "", "nsx color " + test); + + is(div.id, "div_id", "div id " + test); + is(a.id, "a_id", "a 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(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(svg.id, "", "svg id " + test); + + is(div.getAttribute("id"), attrValue, "div getAttribute " + test); + is(a.getAttribute("id"), attrValue, "a 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($("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 = ""; +svg.id = ""; +nsx.setAttribute("id", ""); + +checkHasNoId(false, "set to empty"); + +div.id = "div_id"; +a.id = "a_id"; +svg.id = "svg_id"; +nsx.setAttribute("id", "ns_id"); + +checkHasId("set using .id"); + +div.setAttribute("id", ""); +a.setAttribute("id", ""); +svg.setAttribute("id", ""); +nsx.setAttribute("id", ""); + +checkHasNoId(false, "setAttribute to empty"); + +div.id = "div_id"; +a.id = "a_id"; +svg.id = "svg_id"; +nsx.setAttribute("id", "ns_id"); + +checkHasId("set again using .id"); + +div.removeAttribute("id"); +a.removeAttribute("id"); +svg.removeAttribute("id"); +nsx.removeAttribute("id"); + +checkHasNoId(true, "removed attribute"); + +div.setAttribute("id", "div_id"); +a.setAttribute("id", "a_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"; +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.remove(); +} + +insertAfter(t1, div); +insertAfter(t2, a); +insertAfter(t4, svg); +insertAfter(t5, nsx); + +checkHasId("inserted after"); + +insertBefore(t1, div); +insertBefore(t2, a); +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($("svg_id"), t4, "svg getElementById inserted before"); +is($("ns_id"), t5, "ns getElementById inserted before"); + +t1.removeAttribute("id"); +t2.removeAttribute("id"); +t4.removeAttribute("id"); +t5.removeAttribute("id"); + +checkHasId("removed tx attribute"); + +t1.setAttribute("id", "div_id"); +t2.setAttribute("id", "a_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($("svg_id"), t4, "svg getElementById setAttribute before"); +is($("ns_id"), t5, "ns getElementById setAttribute before"); + +removeNode(t1); +removeNode(t2); +removeNode(t4); +removeNode(t5); + +checkHasId("removed temporaries"); + +removeNode(div); +removeNode(a); +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) { + 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; +}, {once: true}); +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) { + 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; +}, {once: true}); +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) { + 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; +}, {once: true}); +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) { + 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; +}, {once: true}); +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"); + +]]> +</script> +</pre> +</body> +</html> |