<!DOCTYPE html>
<meta charset="UTF-8">
<title>Selectors-API Level 2 Test Suite: HTML with Selectors Level 3</title>
<!-- Selectors API Test Suite Version 3 -->
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/dom/nodes/selectors.js"></script>
<script src="/dom/nodes/ParentNode-querySelector-All.js"></script>
<script src="ParentNode-query-queryAll.js"></script>
<style>iframe { visibility: hidden; position: absolute; }</style>

<div id="log">This test requires JavaScript.</div>

<script>
async_test(function() {
  var frame = document.createElement("iframe");
  frame.onload = this.step_func_done(init);
  frame.src = "/dom/nodes/ParentNode-querySelector-All-content.html#target";
  document.body.appendChild(frame);
});

function init(e) {
  /*
   * This test suite tests Selectors API methods in 4 different contexts:
   * 1. Document node
   * 2. In-document Element node
   * 3. Detached Element node (an element with no parent, not in the document)
   * 4. Document Fragment node
   *
   * For each context, the following tests are run:
   *
   * The interface check tests ensure that each type of node exposes the Selectors API methods.
   *
   * The matches() tests are run
   * All the selectors tested for both the valid and invalid selector tests are found in selectors.js.
   * See comments in that file for documentation of the format used.
   *
   * The level2-lib.js file contains all the common test functions for running each of the aforementioned tests
   */

  var docType  = "html"; // Only run tests suitable for HTML

  // Prepare the nodes for testing
  var doc = e.target.contentDocument;                 // Document Node tests

  var element = doc.getElementById("root");   // In-document Element Node tests

  //Setup the namespace tests
  setupSpecialElements(doc, element);

  var outOfScope = element.cloneNode(true);   // Append this to the body before running the in-document
                                               // Element tests, but after running the Document tests. This
                                               // tests that no elements that are not descendants of element
                                               // are selected.

  traverse(outOfScope, function(elem) {        // Annotate each element as being a clone; used for verifying
    elem.setAttribute("data-clone", "");     // that none of these elements ever match.
  });


  var detached = element.cloneNode(true);     // Detached Element Node tests

  var fragment = doc.createDocumentFragment(); // Fragment Node tests
  fragment.appendChild(element.cloneNode(true));

  // Setup Tests
  interfaceCheckQuery("Document", doc);
  interfaceCheckQuery("Detached Element", detached);
  interfaceCheckQuery("Fragment", fragment);
  interfaceCheckQuery("In-document Element", element);

  runSpecialSelectorTests("Document", doc);
  runSpecialSelectorTests("Detached Element", detached);
  runSpecialSelectorTests("Fragment", fragment);
  runSpecialSelectorTests("In-document Element", element);

  verifyStaticList("Document", doc, doc);
  verifyStaticList("Detached Element", doc, detached);
  verifyStaticList("Fragment", doc, fragment);
  verifyStaticList("In-document Element", doc, element);

  runInvalidSelectorTestQuery("Document", doc, invalidSelectors);
  runInvalidSelectorTestQuery("Detached Element", detached, invalidSelectors);
  runInvalidSelectorTestQuery("Fragment", fragment, invalidSelectors);
  runInvalidSelectorTestQuery("In-document Element", element, invalidSelectors);

  runValidSelectorTest("In-document", doc, scopedSelectors, "html");
}
</script>