click-focus-anchor.html | Explore in Territory

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

<div id=test-container>
<p><a id=a1 tabindex=0>Anchor with tab index</a>
<p><a id=a2>Anchor without tab index</a>
<p><a id=a3 href="#">Link without tab index</a>
<p><a id=a4 href="#" tabindex=0>Link with tab index</a>
<p><a id=a5 href="#" contentEditable>Link with contentEditable</a>
<p contenteditable id="p6"><a id=a6 href="#" title="not focusable">Link inside contentEditable</a>
<p tabindex="1" id="p7"><a id="a7" href="#">Link inside an elment with tabindex</a>

<p><svg width="500" height="30"><a id="svga1" tabindex="0"><text font-size="18px" y="20">SVG anchor with tab index</text></a></svg></p>
<p><svg width="500" height="30"><a id="svga2"><text font-size="18px" y="20">SVG anchor without tab index</text></a></svg></p>
<p><svg width="500" height="30"><a id="svga3" xlink:href="#"><text font-size="18px" y="20">SVG link without tabindex</text></a></svg></p>
<p><svg width="500" height="30"><a id="svga4" xlink:href="#" tabindex="0"><text font-size="18px" y="20">SVG link with tabindex</text></a></svg></p>
<p contentEditable id="psvg5"><svg width="500" height="30"><a id="svga5" xlink:href="#"><text font-size="18px" y="20">SVG link inside contentEditable</text></a></svg></p>
<p tabindex="1" id="psvg6"><svg width="500" height="30"><a id="svga6" xlink:href="#"><text font-size="18px" y="20">SVG link inside an element with tabindex</text></a></svg></p>
</div>

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

<script>
description('This test ensures that we can click to focus an a element.');

function handleFocus(e) {
    var el = e.target;
    debug(el.id + ' received focus');
}

document.addEventListener('focus', handleFocus, true);
if (window.testRunner) {
    var testAnchors = document.querySelectorAll('p > a, svg > a > text');
    for (var i = 0; i < testAnchors.length; i++) {
        var clientRect = testAnchors[i].getBoundingClientRect();
        eventSender.mouseMoveTo(clientRect.left + 2, clientRect.top + 2);
        eventSender.mouseDown();
        eventSender.mouseUp();
    }

    var tc = document.getElementById('test-container');
    tc.parentNode.removeChild(tc);
} else {
    debug('Need testRunner.');
}

</script>
</body>
</html>
chromium/third_party/blink/web_tests/fast/events/click-focus-anchor.html
