Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-10-20 00:35:44 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Bug 1625482 [wpt PR 22496] - [ScrollTimeline] Do not show scrollbar to bypass flakiness on early Mac, a=testonly

Browse Source 
Automatic update from web-platform-tests
[ScrollTimeline] Do not show scrollbar to bypass flakiness on early Mac

The flaky tests are not related to worklet animations because it's the
reference file that is not painted correctly.

Mac scrollbars have their own painting path and they paint greedily.
There might be a race condition on the order of painting that caused the
scrollbar being completely black.

Bug: 946534
Change-Id: I5e2fab05e7a5ee5ec09dcab2a03606ca5ce1fd0c
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2124296
Commit-Queue: Yi Gu <yigu@chromium.org>
Reviewed-by: Majid Valipour <majidvp@chromium.org>
Cr-Commit-Position: refs/heads/master@{#754480}

--

wpt-commits: fba97eee58d4bf45b5c2cadc2eac780b78a8fe95
wpt-pr: 22496
This commit is contained in:
Yi Gu 2020-03-31 12:22:42 +00:00 committed by moz-wptsync-bot
parent 736bbded6a
commit d86959738a
5 changed files with 44 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
testing/web-platform/tests/animation-worklet/worklet-animation-with-scroll-timeline-and-display-none.https.html
View File

@ -21,7 +21,13 @@
background-color: red;
}
/* Hide scrollbars to avoid unnecessary visual issues related to them */
#scroller::-webkit-scrollbar {
display: none;
}
#scroller {
scrollbar-width: none;
overflow: auto;
height: 100px;
width: 100px;
@ -75,4 +81,4 @@
});
});
});
</script>
</script>

6
testing/web-platform/tests/animation-worklet/worklet-animation-with-scroll-timeline-ref.html
View File

@ -16,7 +16,13 @@
background-color: red;
}
/* Hide scrollbars to avoid unnecessary visual issues related to them */
#scroller::-webkit-scrollbar {
display: none;
}
#scroller {
scrollbar-width: none;
overflow: auto;
height: 100px;
width: 100px;

8
testing/web-platform/tests/animation-worklet/worklet-animation-with-scroll-timeline-root-scroller-ref.html
View File

@ -1,7 +1,13 @@
<!DOCTYPE html>
<title>Reference for Scroll timeline with WorkletAnimation using the root scroller</title>
<style>
/* Hide scrollbars to avoid unnecessary visual issues related to them */
html::-webkit-scrollbar {
display: none;
}
html {
scrollbar-width: none;
min-height: 100%;
min-width: 100%;
padding-bottom: 100px;
@ -34,4 +40,4 @@
const maxScroll = scroller.scrollHeight - scroller.clientHeight;
scroller.scrollTop = 0.5 * maxScroll;
});
</script>
</script>

19
testing/web-platform/tests/animation-worklet/worklet-animation-with-scroll-timeline-root-scroller.https.html
View File

@ -1,7 +1,8 @@
<html class="reftest-wait">
<title>Scroll timeline with WorkletAnimation using the root scroller</title>
<link rel="help" href="https://drafts.css-houdini.org/css-animationworklet/">
<meta name="assert" content="Worklet animation correctly updates values when using the root scroller as the source for the ScrollTimeline">
<meta name="assert"
content="Worklet animation correctly updates values when using the root scroller as the source for the ScrollTimeline">
<link rel="match" href="worklet-animation-with-scroll-timeline-root-scroller-ref.html">
<script src="/web-animations/testcommon.js"></script>
@ -9,7 +10,13 @@
<script src="common.js"></script>
<style>
/* Hide scrollbars to avoid unnecessary visual issues related to them */
html::-webkit-scrollbar {
display: none;
}
html {
scrollbar-width: none;
min-height: 100%;
min-width: 100%;
padding-bottom: 100px;
@ -33,15 +40,15 @@
<div id="covered"></div>
<script>
registerPassthroughAnimator().then(()=>{
registerPassthroughAnimator().then(() => {
const box = document.getElementById('box');
const effect = new KeyframeEffect(box,
[
{transform: 'translateY(0)', opacity: 1},
{transform: 'translateY(200px)', opacity: 0}
{ transform: 'translateY(0)', opacity: 1 },
{ transform: 'translateY(200px)', opacity: 0 }
], {
duration: 1000,
}
duration: 1000,
}
);
const scroller = document.scrollingElement;

16
testing/web-platform/tests/animation-worklet/worklet-animation-with-scroll-timeline.https.html
View File

@ -21,7 +21,13 @@
background-color: red;
}
/* Hide scrollbars to avoid unnecessary visual issues related to them */
#scroller::-webkit-scrollbar {
display: none;
}
#scroller {
scrollbar-width: none;
overflow: auto;
height: 100px;
width: 100px;
@ -45,11 +51,11 @@
const box = document.getElementById('box');
const effect = new KeyframeEffect(box,
[
{ transform: 'translateY(0)', opacity: 1},
{ transform: 'translateY(200px)', opacity: 0}
{ transform: 'translateY(0)', opacity: 1 },
{ transform: 'translateY(200px)', opacity: 0 }
], {
duration: 1000,
}
duration: 1000,
}
);
const scroller = document.getElementById('scroller');
@ -65,4 +71,4 @@
takeScreenshot();
});
});
</script>
</script>