<!doctype html>
<meta charset=utf-8>
<title>Form named getter</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<div id=log></div>
<!-- XXX Nothing tests id attributes yet. -->
<!-- XXX Keygen. -->
<!-- XXX We also need tests for moving inputs and forms in the DOM. -->
<form>
<input type=button name=button>
<input type=radio name=radio value=x>
<input type=radio name=radio value=y>
<input type=radio name=radio value=z>
</form>

<form>
<button name=l1></button>
<fieldset name=l2></fieldset>
<input type=hidden name=l3>
<input type=text name=l4>
<input type=search name=l5>
<input type=tel name=l6>
<input type=url name=l7>
<input type=email name=l8>
<input type=password name=l9>
<input type=datetime name=l10>
<input type=date name=l11>
<input type=month name=l12>
<input type=week name=l13>
<input type=time name=l14>
<input type=datetime-local name=l15>
<input type=number name=l16>
<input type=range name=l17>
<input type=color name=l18>
<input type=checkbox name=l19>
<input type=radio name=l20>
<input type=file name=l21>
<input type=submit name=l22>
<input type=image name=l23>
<input type=reset name=l24>
<input type=button name=l25>
<input type=foo name=l26>
<input name=l27>
<object name=l28></object>
<output name=l29></output>
<select name=l30></select>
<textarea name=l31></textarea>
</form>

<form>
<!-- EventTarget -->
<input type=radio name=addEventListener>
<input type=radio name=removeEventListener>
<input type=radio name=dispatchEvent>

<!-- Node -->
<input type=radio name=nodeType>
<input type=radio name=nodeName>
<input type=radio name=ownerDocument>

<!-- Element -->
<input type=radio name=namespaceURI>
<input type=radio name=prefix>
<input type=radio name=localName>

<!-- HTMLElement -->
<input type=radio name=title>
<input type=radio name=lang>
<input type=radio name=dir>

<!-- HTMLFormElement -->
<input type=radio name=acceptCharset>
<input type=radio name=action>
<input type=radio name=autocomplete>
<input type=radio name=enctype>
<input type=radio name=encoding>
<input type=radio name=method>
<input type=radio name=name>
<input type=radio name=noValidate>
<input type=radio name=target>
<input type=radio name=elements>
<input type=radio name=length>
<input type=radio name=submit>
<input type=radio name=reset>
<input type=radio name=checkValidity>
</form>

<img name=x>
<form></form><!-- no child nodes -->
<img name=y>
<form><!-- a child node --></form>
<img name=z>

<input form=a name=b>
<form id=a></form>
<input form=c name=d>
<input form=c name=d>
<form id=c></form>
<script>
test(function() {
  var form = document.getElementsByTagName("form")[0]
  assert_equals(form.item, undefined)
  assert_false("item" in form)
}, "Forms should not have an item method")

test(function() {
  var form = document.getElementsByTagName("form")[0]
  assert_equals(form.namedItem, undefined)
  assert_false("namedItem" in form)
}, "Forms should not have a namedItem method")

test(function() {
  var form = document.getElementsByTagName("form")[0]
  var button = document.getElementsByTagName("input")[0]
  assert_equals(button.type, "button")
  assert_equals(form.button, button)
  assert_equals(form.button.length, undefined)
}, "Name for a single element should work")

test(function() {
  var form = document.getElementsByTagName("form")[0]
  assert_equals(form.radio.item(-1), null)
  assert_array_equals([0, 1, 2].map(function(i) {
    return form.radio.item(i).value
  }), ["x", "y", "z"])
  assert_equals(form.radio.item(3), null)
}, "Calling item() on the NodeList returned from the named getter should work")

test(function() {
  var form = document.getElementsByTagName("form")[0]
  assert_equals(form.radio.length, 3)
  assert_equals(form.radio[-1], undefined)
  assert_array_equals([0, 1, 2].map(function(i) {
    return form.radio[i].value
  }), ["x", "y", "z"])
  assert_equals(form.radio[3], undefined)
}, "Indexed getter on the NodeList returned from the named getter should work")

test(function() {
  var form = document.getElementsByTagName("form")[0]
  var indices = [-1, 0, 1, 2, 3]
  indices.forEach(function(i) {
    assert_throws(new TypeError(), function() {
      form.radio(i)
    })
  })
}, "Invoking a legacycaller on the NodeList returned from the named getter " +
   "should not work")

test(function() {
  var form = document.getElementsByTagName("form")[1]
  for (var i = 1; i <= 31; ++i) {
    if (i == 23) {
      // input type=image
      assert_equals(form["l" + i], undefined)
    } else {
      assert_equals(form["l" + i], form.children[i - 1])
    }
  }
}, "All listed elements except input type=image should be present in the form")

test(function() {
  var names = [
    // EventTarget
    "addEventListener", "removeEventListener", "dispatchEvent",
    // Node
    "nodeType", "nodeName", "ownerDocument",
    // Element
    "namespaceURI", "prefix", "localName",
    // HTMLElement
    "title", "lang", "dir",
    // HTMLFormElement
    "acceptCharset", "action", "autocomplete", "enctype", "encoding", "method",
    "name", "noValidate", "target", "elements", "length", "submit", "reset",
    "checkValidity"
  ]
  var form = document.getElementsByTagName("form")[2]
  names.forEach(function(name, i) {
    assert_equals(form[name], form.children[i])
  })
}, "Named elements should override builtins")

test(function() {
  var form = document.getElementsByTagName("form")[3]
  assert_equals(form.x, undefined, "x should not be associated with the form")
  assert_equals(form.y, undefined, "y should not be associated with the form")
  assert_equals(form.z, undefined, "z should not be associated with the form")
  assert_equals(form[0], undefined, "The form should not have supported property indices")
  assert_equals(form.length, 0)
}, "Named items outside the form should not be returned (no children)")

test(function() {
  var form = document.getElementsByTagName("form")[4]
  assert_equals(form.x, undefined, "x should not be associated with the form")
  assert_equals(form.y, undefined, "y should not be associated with the form")
  assert_equals(form.z, undefined, "z should not be associated with the form")
  assert_equals(form[0], undefined, "The form should not have supported property indices")
  assert_equals(form.length, 0)
}, "Named items outside the form should not be returned (one child)")

test(function() {
  var form = document.getElementsByTagName("form")[5]
  assert_equals(form.id, "a")

  var input = document.getElementsByName("b")[0]
  assert_equals(input.localName, "input")
  assert_equals(input.getAttribute("form"), "a")

  assert_equals(form.b, input);
}, "The form attribute should be taken into account for named getters (single element)")

test(function() {
  var form = document.getElementsByTagName("form")[6]
  assert_equals(form.id, "c")

  var input1 = document.getElementsByName("d")[0]
  assert_equals(input1.localName, "input")
  assert_equals(input1.getAttribute("form"), "c")

  var input2 = document.getElementsByName("d")[1]
  assert_equals(input2.localName, "input")
  assert_equals(input2.getAttribute("form"), "c")

  assert_true(form.d instanceof NodeList, "form.d should be a NodeList")
  assert_array_equals(form.d, [input1, input2])
}, "The form attribute should be taken into account for named getters (multiple elements)")

test(function() {
  var f = document.body.appendChild(document.createElement("form"))
  f.id = "f"
  var g = f.appendChild(document.createElement("form"))
  g.id = "g"
  var input = g.appendChild(document.createElement("input"))
  input.name = "x"
  assert_equals(f.x, undefined)
  assert_equals(g.x, input)
}, "Input should only be a named property on the innermost form that contains it")
</script>