<!DOCTYPE html>
<html>
<body>
<script src="../../resources/js-test.js"></script>
<div id="container"></div>
<form></form>
<script>

description("This tests verifies that namedItem and named getter returns the first matched item for all but all, options, and form controls collections.");

function createElementWithId(name, id, attributes) {
    var element = document.createElement(name);
    element.id = id;
    for (var attr in attributes)
        element.setAttribute(attr, attributes[attr]);
    return element;
}

function insertElementWithId(name, id, attributes) {
    var element = createElementWithId(name, id, attributes);
    document.getElementById('container').appendChild(element);
    return element;
}

function removeTestElements() {
    document.getElementById('container').innerHTML = '';
    document.querySelector('form').innerHTML = '';
}

var elements;
debug('document.all');
shouldBeTrue("document.all instanceof HTMLAllCollection");
shouldBeTrue("document.all instanceof HTMLCollection");
shouldBe("initialLength = document.all.length; elements = [insertElementWithId('b', 'foo'), insertElementWithId('q', 'foo')];\n"
    + "     document.all.length", "initialLength + 2;");
shouldBe("document.all['foo'].length", "2");
shouldBe("document.all['foo'][0]", "elements[0]");
shouldBe("document.all['foo'][1]", "elements[1]");
shouldBe("elements[0].parentNode.removeChild(elements[0]); document.all['foo']", 'elements[1]');
shouldBeUndefined("document.all['no-such-element']");
debug("");

var form = document.querySelector('form');
debug("form.elements");
shouldBeTrue("form.elements instanceof HTMLFormControlsCollection");
shouldBeTrue("form.elements instanceof HTMLCollection");
shouldBe("form.elements.length", "0");
shouldBe("elements = [createElementWithId('input', 'foo'), createElementWithId('input', 'foo')];\n"
    + "     form.appendChild(elements[0]); form.elements.length", "1");
shouldBe("form.elements['foo']", "elements[0]");
shouldBe("form.appendChild(elements[1]); form.elements.length", "2");
shouldBe("form.elements['foo'].toString()", "'[object RadioNodeList]'");
shouldBe("form.elements['foo'].length", "2");
shouldBe("form.elements['foo'][0]", "elements[0]");
shouldBe("form.elements['foo'][1]", "elements[1]");
shouldBe("form.removeChild(elements[0]); form.elements['foo']", "elements[1]");
shouldBe("removeTestElements(); form.elements.length", "0");
shouldBeUndefined("form.elements['no-such-element']");
debug("");

function testFirstItemReturnsFirstMatch(collection, initialLength, elementNames, attributes) {
    debug(collection);
    shouldBe(collection + ".length", initialLength.toString());
    elements = [];
    for (var i = 0; i < elementNames.length; i++) {
        var attrs = attributes ? ", " + JSON.stringify(attributes) : '';
        shouldBe("elements[" + i + "] = insertElementWithId('" + elementNames[i] + "', 'foo'" + attrs + "); "
            + collection + ".length", (initialLength + i + 1).toString());
    }
    shouldBe(collection + "['foo']", "elements[0]");
    shouldBe("removeTestElements(); " + collection + ".length", initialLength.toString());
    debug("");
}

testFirstItemReturnsFirstMatch('document.images', 0, ['img', 'img']);
testFirstItemReturnsFirstMatch('document.applets', 0, ['object', 'object'], {'type': 'application/x-java-applet'});
testFirstItemReturnsFirstMatch('document.embeds', 0, ['embed', 'embed']);
testFirstItemReturnsFirstMatch('document.forms', 1, ['form', 'form']);
testFirstItemReturnsFirstMatch('document.links', 0, ['a', 'a', 'area'], {'href': 'some url'});
testFirstItemReturnsFirstMatch('document.anchors', 0, ['a', 'a'], {'name': 'some name'});
testFirstItemReturnsFirstMatch('document.scripts', 2, ['script', 'script']);

var successfullyParsed = true;

</script>
</body>
</html>