<!DOCTYPE html> <!-- webkit-test-runner [ useFlexibleViewport=true AsyncOverflowScrollingEnabled=true AsyncFrameScrollingEnabled=true ] -->
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<script src="../../../resources/ui-helper.js"></script>
<style>
html, body { width: 100%; height: 100%; margin: 0px; padding: 0px; }
#content { width: 100%; height: 100%; box-sizing: border-box; padding: 20px; background: #ccc; }
#target { position: absolute; }
</style>
<script>
if (window.testRunner) {
    testRunner.waitUntilDone();
    testRunner.dumpAsText();
}

function listenForEventOnce(target, name, timeout) {
    return new Promise((resolve, reject) => {
        const timer = timeout ? setTimeout(reject, timeout) : null;
        target.addEventListener(name, () => {
            if (timer)
                clearTimeout(timer);
            resolve();
        }, {once: true});
    });
}

async function runTest() {
    const target = document.getElementById('target');
    const resizeEvent = listenForEventOnce(target, 'focus').then(() => listenForEventOnce(visualViewport, 'resize'));

    if (window.testRunner) {
        await UIHelper.setHardwareKeyboardAttached(false);
        await UIHelper.activateElementAndWaitForInputSession(target);
    }

    await resizeEvent;

    const keyboardHeight = document.documentElement.clientHeight - visualViewport.height;
    target.style.bottom = (keyboardHeight + 20) + 'px';

    if (window.testRunner) {
        document.activeElement.blur();
        await UIHelper.waitForKeyboardToHide();
    }

    const scrollEvent = listenForEventOnce(target, 'focus').then(() => listenForEventOnce(visualViewport, 'scroll', window.testRunner ? 3000 : 500));

    if (window.testRunner)
        await UIHelper.activateElementAndWaitForInputSession(target);

    try {
        await scrollEvent;
    } catch (error) { }

    document.getElementById('result').textContent = document.documentElement.scrollTop >= 50 ? 'PASS - the document did scroll' : 'FAIL - the document did not scroll';

    if (window.testRunner)
        testRunner.notifyDone();
}

</script>
<body onload="runTest()">
<div id="content">
This tests focusing an element right above the keyboard. WebKit should scroll the document to reveal the element.<br>
To manually test, focus the text field below on iPad to bring up the docked software keyboard.<br>
Dimiss it and focus it again after the text field had moved. The document should scroll.<br>
<div id="result"></div>
<input id="target">
</div>
</html>