aria-labelledby-overrides-aria-labeledby.html

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
</head>
<body id="body">
<p id="description">This tests that if both aria-labeledby and aria-labelledby are used (for reasons best known to the page author), then aria-labelledby is preferred.</p>

<button id="using-labelledby" aria-labelledby="epsilon" aria-label="Zeta">Delta</button>
<button id="using-labeledby" aria-labeledby="theta" aria-label="Iota">Eta</button>
<button id="using-labeledby-and-labelledby" aria-labelledby="epsilon" aria-labeledby="theta" aria-label="Iota">Eta</button>
<span id="epsilon">Using aria-labelledby</span>
<span id="theta">Using aria-labeledby</span>

<ul id="results"></ul>
<div id="console"></div>

<script>
    function getAccessibilityObject(id) {
        var element = document.getElementById(id);
        element.focus();
        return accessibilityController.focusedElement;
    }

    function output(str) {
        var results = document.getElementById("results");
        var li = document.createElement("li");
        li.appendChild(document.createTextNode(str));
        results.appendChild(li);
    }

    if (window.testRunner)
        testRunner.dumpAsText();

    if (window.accessibilityController) {
        var usingLabelledby = getAccessibilityObject("using-labelledby");
        output("usingLabelledby.name: [" + usingLabelledby.name + "]");

        var usingLabeledby = getAccessibilityObject("using-labeledby");
        output("usingLabeledby.name: [" + usingLabeledby.name + "]");

        var usingLabeledbyAndLabelledby = getAccessibilityObject("using-labeledby-and-labelledby");
        output("usingLabeledbyAndLabelledby.name: [" + usingLabeledbyAndLabelledby.name + "]");

    }

    successfullyParsed = true;
</script>

</body>
</html>
chromium/third_party/blink/web_tests/accessibility/aria-labelledby-overrides-aria-labeledby.html
