blob: 9b38bab68a9851d69712a44ebb1f8bd377bb0967 [file] [log] [blame]
<html>
<head>
<script src="../../resources/js-test.js"></script>
<script>
function runTest()
{
description("This tests accessing form elements by name. "
+ "IE only lets you look up names under the first name the element had and "
+ "does not respond to name changes. Firefox remembers every name item has been "
+ "accessed with, but forgets items that have not been accessed. "
+ "This test has been written to expect the Firefox behavior.");
form = document.getElementById('form');
a = document.getElementById('a');
b = document.getElementById('b');
shouldBe('form.length', '2');
shouldBe('form.original', 'a');
shouldBe('form.originalB', 'b');
shouldBe('form.second', 'undefined');
shouldBe('form.third', 'undefined');
shouldBe('form.elements.original', 'a');
shouldBe('form.elements.originalB', 'b');
shouldBe('form.elements.second', 'undefined');
shouldBe('form.elements.third', 'undefined');
debug('');
debug("change the form item a's name to thisWillBeRemembered");
debug('');
a.name="thisWillBeRemembered";
debug("get the variable value through form element");
shouldBe('form.thisWillBeRemembered', 'a');
debug('');
debug("now change the form item a's name to thisWillBeRememberedToo");
debug("access it in boolean context");
a.name="thisWillBeRememberedToo";
debug('');
if (form.thisWillBeRememberedToo)
debug('accessed form.thisWillBeRememberedToo');
debug('');
debug("now change the form item a's name to thisWillBeForgotten");
debug('');
a.name="thisWillBeForgotten";
debug("get the variable value through collection");
shouldBe('form.elements.thisWillBeForgotten', 'a');
debug('');
debug("now change the form item a's name to thisWillBeForgottenToo, but don't access it afterwards");
a.name="thisWillBeForgottenToo";
debug('');
debug("now change the form item a's name to second");
debug('');
a.name="second";
shouldBe('form.length', '2');
shouldBe('form.original', 'a');
shouldBe('form.originalB', 'b');
shouldBe('form.second', 'a');
shouldBe('form.third', 'undefined');
shouldBe('form.elements.original', 'undefined');
shouldBe('form.elements.originalB', 'b');
shouldBe('form.elements.second', 'a');
shouldBe('form.elements.third', 'undefined');
debug('');
debug("now change the form item a's name to third");
debug('');
a.name="third";
shouldBe('form.length', '2');
shouldBe('form.original', 'a');
shouldBe('form.originalB', 'b');
shouldBe('form.second', 'a');
shouldBe('form.third', 'a');
shouldBe('form.elements.original', 'undefined');
shouldBe('form.elements.originalB', 'b');
shouldBe('form.elements.second', 'undefined');
shouldBe('form.elements.third', 'a');
debug('');
debug("now change form item b's name to second");
debug('');
b.name="second";
shouldBe('form.length', '2');
shouldBe('form.original', 'a');
shouldBe('form.originalB', 'b');
shouldBe('form.second', 'b');
shouldBe('form.elements.original', 'undefined');
shouldBe('form.elements.originalB', 'undefined');
shouldBe('form.elements.second', 'b');
debug('');
debug("now change a form item b's name to third");
debug('');
form.originalB.name="third";
shouldBe('form.length', '2');
shouldBe('form.original', 'a');
shouldBe('form.originalB', 'b');
shouldBe('form.second', 'b');
shouldBe('form.third.length', '2');
shouldBe('form.third[0]', 'a');
shouldBe('form.third[1]', 'b');
shouldBe('form.elements.original', 'undefined');
shouldBe('form.elements.originalB', 'undefined');
shouldBe('form.elements.second', 'undefined');
shouldBe('form.elements.third.length', '2');
shouldBe('form.elements.third[0]', 'a');
shouldBe('form.elements.third[1]', 'b');
debug('');
debug("now change a form item b's name to fourth");
debug('');
form.originalB.name="fourth";
shouldBe('form.third', 'a');
shouldBe('form.third.length', 'undefined');
shouldBe('form.elements.third', 'a');
shouldBe('form.elements.third.length', 'undefined');
debug('');
debug("now remove element a");
debug('');
form.removeChild(a);
shouldBe('form.length', '1');
shouldBeUndefined('form.original', 'a');
shouldBe('form.originalB', 'b');
shouldBe('form.second', 'b');
shouldBeUndefined('form.third', 'a');
shouldBe('form.fourth', 'b');
shouldBe('form.elements.original', 'undefined');
shouldBe('form.elements.originalB', 'undefined');
shouldBe('form.elements.second', 'undefined');
shouldBe('form.elements.third', 'undefined');
shouldBe('form.elements.fourth', 'b');
debug('');
debug("check that we no longer remember the past names of a");
debug('');
shouldBe('form.thisWillBeForgotten', 'undefined');
shouldBe('form.thisWillBeForgottenToo', 'undefined');
shouldBeUndefined('form.thisWillBeRemembered');
shouldBeUndefined('form.thisWillBeRememberedToo');
debug('');
}
</script>
</head>
<body>
<form id='form'>
<input type='hidden' id='a' name='original'>
<input type='hidden' id='b' name='originalB'>
</form>
<form id="form1"><input name="foo" id="input3"></form>
<form id="form2"></form>
<form id="form4"><input name="foo"><input name="bar"><input name="bar"></form>
<p id="description"></p>
<div id="console"></div>
<script>
runTest();
debug('Ensures elements are removed from the past names map of a form element once they are no longer associated with the form element.');
var form1 = document.querySelector("#form1");
var input3 = document.querySelector("#input3");
shouldBe("form1['foo']", "input3");
shouldBeUndefined("form2.appendChild(form1.firstChild); form1['foo']");
shouldBe("form2['foo']", "input3");
shouldBeUndefined("form2.removeChild(input3); form2['foo']");
shouldBe("form1.appendChild(input3); form1['foo']", "input3");
// input3 will be an orphan. So form content attribute doesn't work.
shouldBeUndefined("input3.setAttribute('form', 'form1'); form1.removeChild(input3); input3.appendChild(form1); form1['foo']");
shouldNotBe("form1['foo']", "input3");
debug("");
debug("Don't add the element from the past names map if we've found elements of the given name.");
var form4 = document.querySelector("#form4");
shouldBe("form4['foo']", "form4.childNodes[0]");
shouldBe("form4['bar'][0]", "form4.childNodes[1]");
shouldBe("form4['bar'][1]", "form4.childNodes[2]");
shouldBe("form4.childNodes[0].name = 'bar'; form4.childNodes[1].name = form4.childNodes[2].name = 'foo'; form4['foo'].length", "2");
</script>
</body>
</html>