<!DOCTYPE html> <!-- webkit-test-runner [ useFlexibleViewport=true ] -->

<html>

<head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <script>
        let write = message => output.innerHTML += message + "<br>";
        if (window.testRunner) {
            testRunner.dumpAsText();
            testRunner.waitUntilDone();
        }

        let remainingInputEventCount = 0;
        let resolveExpectedInputEvents = null;
        function handleInput() {
            remainingInputEventCount--;
            if (resolveExpectedInputEvents && !remainingInputEventCount)
                resolveExpectedInputEvents();
        }

        function runTestWithAutocapitalizeType(autocapitalizeType, inputEventCount)
        {
            editable.autocapitalize = autocapitalizeType;
            remainingInputEventCount = inputEventCount;
            resolveExpectedInputEvents = () => {
                write(`With autocapitalize: ${editable.autocapitalize}, the output is: "${editable.textContent}"`);
                editable.textContent = "";
                editable.blur();
            };

            return new Promise(function(resolve) {
                let rect = editable.getBoundingClientRect();
                testRunner.runUIScript(`(function() {
                    uiController.didShowKeyboardCallback = function() {
                        uiController.typeCharacterUsingHardwareKeyboard("t", function() {
                            uiController.typeCharacterUsingHardwareKeyboard("o", function() {});
                        });
                    }
                    uiController.didHideKeyboardCallback = function() {
                        uiController.uiScriptComplete();
                    }
                    uiController.singleTapAtPoint(${rect.left + rect.width / 2}, ${rect.top + rect.height / 2}, function() {});
                })();`, resolve);
            });
        }

        async function runTest()
        {
            if (!window.testRunner || !testRunner.runUIScript)
                return;

            await runTestWithAutocapitalizeType("none", 2);
            await runTestWithAutocapitalizeType("sentences", 2);
            await runTestWithAutocapitalizeType("characters", 2);
            testRunner.notifyDone();
        }
    </script>
    <style>
    #editable {
        width: 200px;
        height: 100px;
        top: 0;
        left: 0;
        position: absolute;
    }
    </style>
</head>

<body onload=runTest()>
    <div contenteditable id="editable" oninput=handleInput()></div>
    <p>To manually test, type 't' into the contenteditable. The 't' should not be autocapitalized.</p>
    <div id="output"></div>
</body>

</html>
