<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<script src="../resources/js-test.js"></script>
</head>
<body id="body">

<ul id="tablist_1" role="tablist">
<li id="tab_1" role="tab" aria-controls="panel_1 panel_2"></li>
</ul>

<div id="panel_1" role="tabpanel">Panel 1</div>
<div id="panel_2" role="tabpanel">Panel 2</div>

<p id="description"></p>
<div id="console"></div>

<script>
    description("This tests that aria-controls identifies the correct element");

    if (window.accessibilityController) {
        var tab_1 = accessibilityController.accessibleElementById("tablist_1").childAtIndex(0);
        var panel_1 = accessibilityController.accessibleElementById("panel_1");
        var panel_2 = accessibilityController.accessibleElementById("panel_2");

        shouldBeTrue("tab_1.ariaControlsElementAtIndex(0).isEqual(panel_1)");
        shouldBeTrue("tab_1.ariaControlsElementAtIndex(1).isEqual(panel_2)");

    }

</script>

</body>
</html>