diff options
Diffstat (limited to 'testing/web-platform/tests/css/css-scroll-snap/snap-after-relayout/multiple-aligned-targets/resources/common.js')
-rw-r--r-- | testing/web-platform/tests/css/css-scroll-snap/snap-after-relayout/multiple-aligned-targets/resources/common.js | 119 |
1 files changed, 66 insertions, 53 deletions
diff --git a/testing/web-platform/tests/css/css-scroll-snap/snap-after-relayout/multiple-aligned-targets/resources/common.js b/testing/web-platform/tests/css/css-scroll-snap/snap-after-relayout/multiple-aligned-targets/resources/common.js index 6ceec9118c..1fd88949b3 100644 --- a/testing/web-platform/tests/css/css-scroll-snap/snap-after-relayout/multiple-aligned-targets/resources/common.js +++ b/testing/web-platform/tests/css/css-scroll-snap/snap-after-relayout/multiple-aligned-targets/resources/common.js @@ -6,54 +6,55 @@ // This function should be used by scroll snap WPTs wanting to test snap target // selection when scrolling to multiple aligned targets. -// It assumes scroll-snap-align: start alignment and tries to align to the list -// of snap targets provided, |elements|, which are all expected to be at the -// same offset. -async function scrollToAlignedElementsInAxis(scroller, elements, axis) { +// It assumes scroll-snap-align: start alignment and tries to align to the lists +// of snap targets provided, |elements_x| and |elements_y|, which are all +// expected to be at the same offset in the relevant axis. +async function scrollToAlignedElements(scroller, elements_x, elements_y) { let target_offset_y = null; let target_offset_x = null; - if (axis == "y") { - for (const e of elements) { - if (target_offset_y) { - assert_equals(e.offsetTop, target_offset_y, - `${e.id} is at y offset ${target_offset_y}`); - } else { - target_offset_y = e.offsetTop; - } + for (const e of elements_y) { + if (target_offset_y != null) { + assert_equals(e.offsetTop, target_offset_y, + `${e.id} is at y offset ${target_offset_y}`); + } else { + target_offset_y = e.offsetTop; } - assert_equals(); - } else { - for (const e of elements) { - if (target_offset_x) { - assert_equals(e.offsetLeft, target_offset_x, - `${e.id} is at x offset ${target_offset_x}`); - } else { - target_offset_x = e.offsetLeft; - } + } + for (const e of elements_x) { + if (target_offset_x != null) { + assert_equals(e.offsetLeft, target_offset_x, + `${e.id} is at x offset ${target_offset_x}`); + } else { + target_offset_x = e.offsetLeft; } } - assert_not_equals(target_offset_x || target_offset_y, null); + assert_true((target_offset_x != null) || (target_offset_y != null), + "scrolls in at least 1 axis"); - const scrollend_promise = waitForScrollendEventNoTimeout(scroller); - await new test_driver.Actions().scroll(0, 0, - (target_offset_x || 0) - scroller.scrollLeft, - (target_offset_y || 0) - scroller.scrollTop, - { origin: scroller }) - .send(); - await scrollend_promise; - if (axis == "y") { + if ((target_offset_x != null && scroller.scrollLeft != target_offset_x) || + (target_offset_y != null && scroller.scrollTop != target_offset_y)) { + const scrollend_promise = waitForScrollendEventNoTimeout(scroller); + await new test_driver.Actions().scroll(0, 0, + (target_offset_x || scroller.scrollLeft) - scroller.scrollLeft, + (target_offset_y || scroller.scrollTop) - scroller.scrollTop, + { origin: scroller }) + .send(); + await scrollend_promise; + } + if (target_offset_y) { assert_equals(scroller.scrollTop, target_offset_y, "vertical scroll done"); - } else { - assert_equals(scroller.scrollLeft,target_offset_x, "horizontal scroll done"); + } + if (target_offset_x) { + assert_equals(scroller.scrollLeft, target_offset_x, "horizontal scroll done"); } } -// This function verifies the snap target that a scroller picked by triggerring +// This function verifies the snap target that a scroller picked by triggering // a layout change and observing which target is followed. Tests using this // method should ensure that there is at least 100px of room to scroll in the // desired axis. // It assumes scroll-snap-align: start alignment. -function verifySelectedSnapTarget(scroller, expected_snap_target, axis) { +function verifySelectedSnapTarget(t, scroller, expected_snap_target, axis) { // Save initial style. const initial_left = getComputedStyle(expected_snap_target).left; const initial_top = getComputedStyle(expected_snap_target).top; @@ -62,19 +63,26 @@ function verifySelectedSnapTarget(scroller, expected_snap_target, axis) { const initial_scroll_top = scroller.scrollTop; const target_top = expected_snap_target.offsetTop + 100; expected_snap_target.style.top = `${target_top}px`; - assert_equals(scroller.scrollTop, expected_snap_target.offsetTop, - `scroller followed ${expected_snap_target.id} after layout change`); - assert_not_equals(scroller.scrollTop, initial_scroll_top, - "scroller actually scrolled in y axis"); + // Wrap these asserts in t.step (which catches exceptions) so that even if + // they fail, we'll get to undo the style changes we made, allowing + // subsequent tests to run with the expected style/layout. + t.step(() => { + assert_equals(scroller.scrollTop, expected_snap_target.offsetTop, + `scroller followed ${expected_snap_target.id} in y axis after layout change`); + assert_not_equals(scroller.scrollTop, initial_scroll_top, + "scroller actually scrolled in y axis"); + }); } else { - // Move the expected snap target along the y axis. + // Move the expected snap target along the x axis. const initial_scroll_left = scroller.scrollLeft; const target_left = expected_snap_target.offsetLeft + 100; expected_snap_target.style.left = `${target_left}px`; - assert_equals(scroller.scrollLeft, expected_snap_target.offsetLeft, - `scroller followed ${expected_snap_target.id} after layout change`); - assert_not_equals(scroller.scrollLeft, initial_scroll_left, - "scroller actually scrolled in x axis"); + t.step(() => { + assert_equals(scroller.scrollLeft, expected_snap_target.offsetLeft, + `scroller followed ${expected_snap_target.id} in x axis after layout change`); + assert_not_equals(scroller.scrollLeft, initial_scroll_left, + "scroller actually scrolled in x axis"); + }); } // Undo style changes. expected_snap_target.style.top = initial_top; @@ -83,19 +91,24 @@ function verifySelectedSnapTarget(scroller, expected_snap_target, axis) { // This is a utility function for tests which verify that the correct element // is snapped to when snapping at the end of a scroll. -async function runScrollSnapSelectionVerificationTest(t, scroller, aligned_elements, - expected_target, axis) { +async function runScrollSnapSelectionVerificationTest(t, scroller, + aligned_elements_x=[], aligned_elements_y=[], axis="", + expected_target_x=null, expected_target_y=null) { // Save initial scroll offset. const initial_scroll_left = scroller.scrollLeft; const initial_scroll_top = scroller.scrollTop; - await scrollToAlignedElementsInAxis(scroller, aligned_elements, axis); - verifySelectedSnapTarget(scroller, expected_target, axis); - // Restore initial scroll offsets. - const scrollend_promise = new Promise((resolve) => { - scroller.addEventListener("scrollend", resolve); + await scrollToAlignedElements(scroller, aligned_elements_x, + aligned_elements_y); + t.step(() => { + if (axis == "y" || axis == "both") { + verifySelectedSnapTarget(t, scroller, expected_target_y, axis); + } + if (axis == "x" || axis == "both") { + verifySelectedSnapTarget(t, scroller, expected_target_x, axis); + } }); - scroller.scrollTo(initial_scroll_left, initial_scroll_top); - await scrollend_promise; + // Restore initial scroll offsets. + await waitForScrollReset(t, scroller, initial_scroll_left, initial_scroll_top); } // This is a utility function for tests verifying that a layout shift does not @@ -127,7 +140,7 @@ async function runLayoutSnapSeletionVerificationTest(t, scroller, elements_to_al } shiftLayoutToAlignElements(elements_to_align, expected_target, axis); - verifySelectedSnapTarget(scroller, expected_target, axis); + verifySelectedSnapTarget(t, scroller, expected_target, axis); // Restore initial scroll offset and position states. let num_elements = initial_tops.length; |