blob: 357663fabc5a0b877a5a97027eb7ad168355f4b6 [file] [log] [blame]
<!DOCTYPE html> <!-- webkit-test-runner [ useFlexibleViewport=true internal:AsyncOverflowScrollingEnabled=true internal: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>