<html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title>DOM Core: getElementsByTagNameNS()</title>
  <script type="text/javascript">

    var variable;

    function test() {
      var pre = document.getElementById('output');
      while (pre.hasChildNodes()) pre.removeChild(pre.firstChild);
      // control test
      assert(pre, "typeof document.getElementsByTagNameNS", "function");
      // non-match cases
      assert(pre, "document.getElementsByTagNameNS('', 'bogus').length", 0);
      assert(pre, "document.getElementsByTagNameNS('bogus', '').length", 0);
      assert(pre, "document.getElementsByTagNameNS('', 'div').length", 0);
      assert(pre, "document.getElementsByTagNameNS('div', '').length", 0);
      assert(pre, "document.getElementsByTagNameNS('http://www.w3.org/1999/xhtml', 'test').length", 0);
      assert(pre, "document.getElementsByTagNameNS('http://www.w3.org/1999/xhtml', '').length", 0);
      assert(pre, "document.getElementsByTagNameNS('', '').length", 0);
      // static match cases
      assert(pre, "document.getElementsByTagNameNS('http://www.w3.org/1999/xhtml', 'em').length", 6);
      assert(pre, "document.getElementsByTagNameNS('', 'test').length", 2);
      // static changes (ahem)
      var x = document.createElementNS('http://www.w3.org/1999/xhtml', 'em');
      document.getElementById('test3').appendChild(x);
      assert(pre, "document.getElementsByTagNameNS('http://www.w3.org/1999/xhtml', 'em').length", 7);
      var t2 = document.getElementById('test2');
      t2.removeChild(t2.firstChild);
      assert(pre, "document.getElementsByTagNameNS('http://www.w3.org/1999/xhtml', 'em').length", 6);
      // dynamic changes
      assert(pre, "variable = document.getElementsByTagNameNS('http://www.w3.org/1999/xhtml', 'em')", "[object NodeList]");
      assert(pre, "variable.length", 6);
      x.parentNode.removeChild(x);
      assert(pre, "variable.length", 5);
      t2.firstChild.appendChild(x);
      assert(pre, "variable.length", 6);
      t2.parentNode.removeChild(t2);
      assert(pre, "variable.length", 3);
      variable[0].appendChild(x);
      assert(pre, "variable.length", 4);
      variable[1].appendChild(x);
      assert(pre, "variable.length", 4);
    }

    function assert(pre, value, answer) {
      result = eval(value);
      var span = document.createElementNS('http://www.w3.org/1999/xhtml', 'span');
      span.appendChild(document.createTextNode(value + ' should equal "' + answer + '", actually equals "' + result + '"'));
      span.className = result == answer ? 'pass' : 'fail';
      pre.appendChild(span);
    }

  </script>
  <style type="text/css">
   span { display: block; }
   .fail { background: maroon; color: yellow; }
   .pass { color: green; }
  </style>
 </head>
 <body onload="test()">
  <pre id="output">Test failed. Script did not execute.</pre>
  <div id="test1"><em/><em/><em/></div>
  <div id="test2"><em/><em/><em/></div>
  <div id="test3"><test xmlns=""> test <test/> </test> </div>
 </body>
</html>
