| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../../resources/js-test-pre.js"></script> |
| <script src="../../resources/ui-helper.js"></script> |
| </head> |
| <body onload="setupTopLevel();"> |
| <script> |
| window.jsTestIsAsync = true; |
| |
| var iframeTarget; |
| var selectLeft; |
| var selectRight; |
| var previousSelectLeftScrollPosition; |
| |
| function checkForScroll() |
| { |
| if (selectLeft.scrollTop == previousSelectLeftScrollPosition) |
| testPassed("Leftmost <select> was not scrolled by the latch state logic"); |
| else |
| testFailed("Leftmost <select> was incorrectly scrolled by wrong latch logic." + " " + selectLeft.scrollTop + " " + previousSelectLeftScrollPosition); |
| |
| if (selectRight.scrollTop > 0) |
| testPassed("Rightmost <select> was properly scrolled."); |
| else |
| testFailed("Rightmost <select> was not scrolled though it should."); |
| |
| finishJSTest(); |
| } |
| |
| async function scrollRightMostSelect() |
| { |
| if (selectLeft.scrollTop > 0) |
| testPassed("Leftmost <select> was scrolled"); |
| else |
| testFailed("Leftmost <select> was not scrolled"); |
| previousSelectLeftScrollPosition = selectLeft.scrollTop; |
| |
| const startPosX = Math.round(selectRight.offsetLeft) + 10; |
| const startPosY = Math.round(selectRight.offsetTop) + 10; |
| |
| const events = [ |
| { |
| type : "wheel", |
| viewX : startPosX, |
| viewY : startPosY, |
| deltaY : -10, |
| phase : "began" |
| }, |
| { |
| type : "wheel", |
| deltaY : -10, |
| phase : "changed" |
| }, |
| { |
| type : "wheel", |
| phase : "ended" |
| } |
| ]; |
| |
| await UIHelper.mouseWheelSequence({ events: events }); |
| checkForScroll(); |
| } |
| |
| async function scrollLeftMostSelect() |
| { |
| const startPosX = Math.round(selectLeft.offsetLeft) + 10; |
| const startPosY = Math.round(selectLeft.offsetTop) + 10; |
| |
| const events = [ |
| { |
| type : "wheel", |
| viewX : startPosX, |
| viewY : startPosY, |
| deltaY : -10, |
| phase : "began" |
| }, |
| { |
| type : "wheel", |
| deltaY : -10, |
| phase : "changed" |
| }, |
| { |
| type : "wheel", |
| phase : "ended" |
| } |
| ]; |
| |
| await UIHelper.mouseWheelSequence({ events: events }); |
| scrollRightMostSelect(); |
| } |
| |
| function setupTopLevel() |
| { |
| if (window.eventSender) { |
| iframeTarget = document.getElementById("target"); |
| selectLeft = window.frames["target"].document.getElementById("selectLeft"); |
| selectRight = window.frames["target"].document.getElementById("selectRight"); |
| |
| setTimeout(scrollLeftMostSelect, 0); |
| } |
| } |
| </script> |
| <iframe id="target" name="target" height="400" width="400" src="resources/selects-iframe.html"></iframe> |
| <div id="console"></div> |
| <script> |
| description("Tests that latched state logic does not get stuck scrolling a specific <select>. To manually run this test, place the mouse pointer<br>" + |
| "within one left <select> boundary, and then use the mouse wheel or a two-finger to scroll down the list, without momentum scrolling.<br>" + |
| "Do the same for the right <select>. The left <select> should not scroll when trying to scroll the right <select>."); |
| </script> |
| <script src="../../resources/js-test-post.js"></script> |
| </body> |
| </html> |
