1 files changed, 170 insertions, 0 deletions
diff --git a/dom/base/test/test_bug564863-2.xhtml b/dom/base/test/test_bug564863-2.xhtml
new file mode 100644
index 0000000000..6f338f612d
--- /dev/null
+++ b/dom/base/test/test_bug564863-2.xhtml
@@ -0,0 +1,170 @@
+<?xml version="1.0"?>
+<html xmlns="http://www.w3.org/1999/xhtml"
+      xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+<!--
+https://bugzilla.mozilla.org/show_bug.cgi?id=564863
+-->
+<head>
+  <title>Test for Bug 564863</title>
+  <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"/>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
+<style>
+* {
+  color: rgb(0, 0, 0);
+}
+#xul_id {
+  color: rgb(30, 30, 30);
+}
+</style>
+</head>
+<body>
+<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=564863">Mozilla Bug 564863</a>
+
+<!-- DOM to muck around with for tests -->
+<p id="root">
+<xul:button id="xul_id" />
+</p>
+
+<pre id="test">
+<script type="application/javascript">
+<![CDATA[
+SimpleTest.waitForExplicitFinish();
+
+(async function runTests() {
+  root = $('root');
+  xul = root.children[0];
+
+  var xul_cs = getComputedStyle(xul, "");
+
+  function checkHasId(test) {
+    // Check computed style first to avoid flushes from hiding problems
+    checkHasIdNoGEBI(test);
+
+    is($("xul_id"), xul, "xul getElementById " + test);
+  }
+
+  function checkHasIdNoGEBI(test) {
+    const connected = test != "removed node";
+    is(xul_cs.color, connected ? "rgb(30, 30, 30)" : "", "xul color " + test);
+
+    is(xul.id, "xul_id", "xul id " + test);
+  }
+
+  function checkHasNoId(removed, test) {
+    // XXX This fails for some reason when this is run as a Mochitest chrome, but
+    // not when run as a Mochitest plain.
+    //is(xul_cs.color, "rgb(0, 0, 0)", "xul color " + test);
+
+    attrValue = removed ? null : "";
+
+    is(xul.id, "", "xul id " + test);
+
+    is(xul.getAttribute("id"), "",        "xul getAttribute " + test);
+
+    is($("xul_id"), null, "xul getElementById " + test);
+  }
+
+  // Check that dynamic modifications of attribute work
+
+  checkHasId("in markup");
+
+  xul.id = "";
+
+  checkHasNoId(false, "set to empty");
+
+  xul.id = "xul_id";
+
+  checkHasId("set using .id");
+
+  xul.setAttribute("id", "");
+
+  checkHasNoId(false, "setAttribute to empty");
+
+  xul.id = "xul_id";
+
+  checkHasId("set again using .id");
+
+  xul.removeAttribute("id");
+
+  checkHasNoId(true, "removed attribute");
+
+  xul.setAttribute("id", "xul_id");
+
+  checkHasId("set using setAttribute");
+
+  t3 = document.createElementNS("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul", "button");
+  t3.id = "xul_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(t3, xul);
+
+  checkHasId("inserted after");
+
+  insertBefore(t3, xul);
+
+  checkHasIdNoGEBI("inserted before");
+  is($("xul_id"), t3, "xul getElementById inserted before");
+
+  t3.removeAttribute("id");
+
+  checkHasId("removed tx attribute");
+
+  t3.setAttribute("id", "xul_id");
+
+  checkHasIdNoGEBI("setAttribute before");
+  is($("xul_id"), t3, "xul getElementById setAttribute before");
+
+  removeNode(t3);
+
+  checkHasId("removed temporaries");
+
+  removeNode(xul);
+
+  checkHasIdNoGEBI("removed node");
+
+  // 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");
+  let mutation;
+  const observer = new MutationObserver((aMutationList, aObserver) => {
+    mutation = aMutationList[0];
+    aObserver.disconnect();
+  });
+  observer.observe(xul, { attributes: true });
+  xul.removeAttribute("id");
+  await new Promise(SimpleTest.executeSoon);
+  if (mutation) {
+    is(mutation.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";
+  } else {
+    observer.disconnect();
+    ok(false, "mutation should've occurred");
+  }
+  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");
+
+  SimpleTest.finish();
+})();
+]]>
+</script>
+</pre>
+</body>
+</html>