Bug 1616656 [wpt PR 21885] - Input element does not fire scroll event, a=testonly

Automatic update from web-platform-tests
Input element does not fire scroll event

When there is text that overflows an input element, the scroll event is
not fired when the text scrolls into view.
The input element never receives the scroll event from the user agent
shadow DOM internal editor element. The fix is to change the scroll
event's target to the shadow host element when the event is generated.

Bug: 989937
Change-Id: Iff4aeae6adb931d681a2ade72eb8032c5a23067c
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2064818
Commit-Queue: Liviu Tinta <liviutinta@chromium.org>
Reviewed-by: Navid Zolghadr <nzolghadr@chromium.org>
Reviewed-by: David Bokan <bokan@chromium.org>
Cr-Commit-Position: refs/heads/master@{#745459}

--

wpt-commits: ebb246d2104b0a114fe31309ecb65a6a3c8343a2
wpt-pr: 21885
This commit is contained in:
Liviu Tinta 2020-03-03 13:31:19 +00:00 коммит произвёл moz-wptsync-bot
Родитель b35d4dedfe
Коммит 8d42b9361f
1 изменённых файлов: 71 добавлений и 0 удалений

Просмотреть файл

@ -0,0 +1,71 @@
<!doctype html>
<html>
<head>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/testdriver.js"></script>
<script src="/resources/testdriver-actions.js"></script>
<script src="/resources/testdriver-vendor.js"></script>
</head>
<body onload=runTest()>
<p>Moving the cursor using the arrow keys into an
input element fires scroll events when text has to scroll into view.
Uses arrow keys to move forward and backwards in the input
element.</p>
<input type="text" style='width: 50px'
value="Fooooooooooooooooooooooooooooooooooooooooooooooooo"/>
<textarea rows="4" cols="4">
Fooooooooooooooooooooooooooooooooooooooooooooooooo
</textarea>
<script>
async function moveCursorRightInsideElement(element, value){
var arrowRight = '\uE014';
for(var i=0;i<value;i++){
await test_driver.send_keys(element, arrowRight);
}
}
function runTest(){
promise_test(async(t) => { return new Promise(async (resolve, reject) => {
var input = document.getElementsByTagName('input')[0];
function handleScroll(){
resolve("Scroll Event successfully fired!");
}
input.addEventListener('scroll', handleScroll, false);
// move cursor to the right until the text scrolls
while(input.scrollLeft === 0){
await moveCursorRightInsideElement(input, 1);
}
// if there is no scroll event fired then test will fail by timeout
})},
/*
Moving the cursor using the arrow keys into an input element
fires scroll events when text has to scroll into view.
Uses arrow keys to move right in the input element.
*/
"Scroll event fired for <input> element.");
promise_test(async(t) => { return new Promise(async (resolve, reject) => {
var textarea = document.getElementsByTagName('textarea')[0];
function handleScroll(){
resolve("Scroll Event successfully fired!");
}
textarea.addEventListener('scroll', handleScroll, false);
// move cursor to the right until the text scrolls
while(textarea.scrollLeft === 0){
await moveCursorRightInsideElement(textarea, 1);
}
// if there is no scroll event fired then test will fail by timeout
})},
/*
Moving the cursor using the arrow keys into a textarea element
fires scroll events when text has to scroll into view.
Uses arrow keys to move right in the textarea element.
*/
"Scroll event fired for <textarea> element.");
}
</script>
</body>
</html>