Commit a2986aa6 authored by Nikos Mouchtaris's avatar Nikos Mouchtaris Committed by moz-wptsync-bot
Browse files

Bug 1812159 [wpt PR 38151] - WebKit export of...

Bug 1812159 [wpt PR 38151] - WebKit export of https://bugs.webkit.org/show_bug.cgi?id=249354, a=testonly

Automatic update from web-platform-tests
WebKit export of https://bugs.webkit.org/show_bug.cgi?id=249354

 (#38151)

Co-authored-by: default avatarnikos <nikos@nikoss-iMac-Pro.local>
--

wpt-commits: eb16a6c5a8381137e6c245b656d3a8b816710f26
wpt-pr: 38151
parent f9766779
Loading
Loading
Loading
Loading
+51 −0
Original line number Diff line number Diff line
<!doctype html>
<title>Resnap to focused element after relayout</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>

#snapper {
    width: 100px;
    height: 200px;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    color: white;
    background-color: oldlace;
    display: flex;
    align-items: center;
}
.child {
    margin-right: 0.5rem;
    height: 90%;
    scroll-snap-align: start;
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100px;
    height: 100px;
    background-color: indigo;
}
</style>

<link rel="help" href="https://drafts.csswg.org/css-scroll-snap/#re-snap">

<div id=snapper>
    <div class="child no-snap" tabindex=-1></div>
    <div class=child></div>
    <div class="child" id ="focus" tabindex=-1></div>
    <div class="child" tabindex=-1></div>
    <div class=child></div>
    <div class=child></div>
</div>

<script>

test(t => {
    document.getElementById("focus").focus();
    const element = document.getElementById("snapper");
    element.style.width = "101px";
    assert_equals(element.scrollLeft, 0);
});
</script>