<!DOCTYPE html> <!-- webkit-test-runner [ useFlexibleViewport=true ] -->
<html>
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <style>
            a[tabindex] {
                outline: none;
            }

            span.empty {
                display: inline-block;
                width: 100%;
                height: 1em;
                font-size: 40px;
            }

            span#b {
                border: 1px solid red;
            }
        </style>
        <script src="../../resources/js-test.js"></script>
        <script src="../../resources/ui-helper.js"></script>
        <script>
            jsTestIsAsync = true;

            addEventListener("load", async () => {
                anchor = document.querySelector("a");
                target = document.getElementById("b");
                target.addEventListener("click", () => {
                    testPassed("Clicked target.");
                    shouldBe("document.activeElement", "anchor");
                });

                description("This test verifies that clicking an empty container in an anchor element with a tabindex correctly focuses the anchor without hanging the web content process. To run the test manually, tap or click the red box; the active element should be set to the anchor element, and the web process should remain responsive.");

                if (!window.testRunner)
                    return;

                await UIHelper.activateElement(target);
                await UIHelper.ensurePresentationUpdate();
                finishJSTest();
            });
        </script>
    </head>
    <body>
        <p id="description"></p>
        <p id="console"></p>
        <a tabindex="0">
            <span class="empty" id="a"> </span>
            <span class="empty" id="b"> </span>
        </a>
        <div>
            <span class="empty" id="c"> </span>
        </div>
    </body>
</html>