blob: 3b05b56571ab91b83008c22afbf38e65577ce54c [file] [log] [blame]
<!DOCTYPE html> <!-- webkit-test-runner [ useFlexibleViewport=true ] -->
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="../../../resources/js-test.js"></script>
<script src="../../../resources/ui-helper.js"></script>
<style>
body {
width: 100%;
height: 100%;
margin: 0;
}
button {
width: 320px;
height: 80px;
display: block;
}
#container {
width: 30px;
height: 0px;
font-size: 6px;
overflow: hidden;
}
</style>
<script>
jsTestIsAsync = true;
addEventListener("load", async () => {
description("Verifies that native selection UI is suppressed when focusing a textarea that is completely hidden "
+ "underneath an empty container with <code>overflow: hidden;</code>. To manually test, tap the top button, "
+ "and then tap on the bottom button. In both cases, there should be no platform selection shown.");
if (!window.testRunner)
return;
frame = document.getElementById("frame");
caretViewRect = null;
function caretViewRectShouldBeNull() {
shouldBeNull("caretViewRect.top");
shouldBeNull("caretViewRect.left");
shouldBe("caretViewRect.width", "0");
shouldBe("caretViewRect.height", "0");
}
await UIHelper.activateAndWaitForInputSessionAt(160, 40);
await UIHelper.ensurePresentationUpdate();
caretViewRect = await UIHelper.getUICaretViewRect();
caretViewRectShouldBeNull();
shouldBeEqualToString("document.activeElement.id", "editor");
document.activeElement.blur();
await UIHelper.waitForKeyboardToHide();
await UIHelper.activateAndWaitForInputSessionAt(160, 120);
await UIHelper.ensurePresentationUpdate();
caretViewRect = await UIHelper.getUICaretViewRect();
caretViewRectShouldBeNull();
shouldBeEqualToString("document.activeElement.id", "frame");
shouldBeEqualToString("frame.contentWindow.document.activeElement.id", "editor");
frame.contentWindow.document.activeElement.blur();
await UIHelper.waitForKeyboardToHide();
document.querySelectorAll("button, #container").forEach(element => element.remove());
finishJSTest();
});
</script>
</head>
<body>
<button onclick="document.getElementById('editor').focus()">Focus hidden textarea</button>
<button onclick="frame.contentWindow.document.getElementById('editor').focus()">
Focus hidden textarea (in subframe)
</button>
<div id="container">
<textarea id="editor"></textarea>
<iframe id="frame" srcdoc="<textarea id='editor'></textarea>"></iframe>
</div>
<div id="description"></div>
<div id="console"></div>
</body>
</html>