<!DOCTYPE html> <!-- webkit-test-runner [ useFlexibleViewport=true ] -->
<html>
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<head>
    <script src="../../../resources/ui-helper.js"></script>
    <script src="../../../resources/js-test.js"></script>
    <style>
    body {
        margin: 0;
    }

    #editor {
        width: 100%;
        height: 280px;
        border: 2px solid tomato;
        outline: none;
        box-sizing: border-box;
        font-size: 100px;
        margin: 0;
    }
    </style>
    <script>
    jsTestIsAsync = true;

    function doAfterDetectingVisibleSelectionViewRects(callback)
    {
        const uiScript = `
            function waitForSelectionRects() {
                uiController.doAsyncTask(() => {
                    const rects = uiController.selectionRangeViewRects;
                    if (rects && rects.length)
                        uiController.uiScriptComplete(JSON.stringify(rects));
                    else
                        waitForSelectionRects();
                });
            }
            uiController.doAsyncTask(waitForSelectionRects);`;
        testRunner.runUIScript(uiScript, result => callback(JSON.parse(result)));
    }

    async function run()
    {
        description("Verifies that after tapping a focused element to bring up the keyboard, changing the selection via "
            + "script causes the native selection UI to be shown. To manually test, tap the red box above and tap select "
            + "all via the callout bar; the entire text in the editable element should be selected.");

        if (!window.testRunner)
            return;

        await UIHelper.activateAndWaitForInputSessionAt(130, 100);
        await new Promise(resolve => setTimeout(resolve, 500));

        doAfterDetectingVisibleSelectionViewRects(selectionRects => {
            window.selectionRects = selectionRects;
            shouldBe("selectionRects.length", "1");
            shouldBe("selectionRects[0].left", "2");
            shouldBe("selectionRects[0].top", "4");
            shouldBe("selectionRects[0].width", "309");
            shouldBe("selectionRects[0].height", "112");
            finishJSTest();
        });

        await UIHelper.tapAt(130, 100);
        getSelection().selectAllChildren(editor);
    }
    </script>
</head>
<body onload=run()>
    <div id="editor" contenteditable>WebKit</div>
    <div id="description"></div>
    <div id="console"></div>
</body>
</html>
