mozilla
/
gecko-dev
зеркало из https://github.com/mozilla/gecko-dev.git
1
0
Форкнуть 0
Код Задачи Пакеты Проекты Релизы Вики Активность

Bug 1650081 - Use scrollbar-width:none instead of overflow:hidden to hide scrollbars. r=botond 

Instead of using overflow:hidden on the body to hide the scrollbar, this
patch sets scrollbar-width:none on the html element. In some cases
overflow:hidden is set on non-root scrollers (i.e. div elements); in those
cases it is replaced by overflow:scroll;scrollbar-width:none to get an
equivalent effect.

One test had a pre-existing visible scrollbar on a nested scrollframe, but
which started failing with a small fuzz difference. I left the scrollbar as-is
and added an annotation to the reftest.list file.

Note that this only updates the tests that use reftest-async-scroll as those
were the cases that were easily detectable, and causing problems with the
apz.allow_zooming=true pref.

Differential Revision: https://phabricator.services.mozilla.com/D82032
This commit is contained in:
Kartikaya Gupta 2020-07-03 16:07:51 +00:00
Родитель 77b4f9fdf9
Коммит 3bc44b4a60
64 изменённых файлов: 162 добавлений и 98 удалений
Показать статистику Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

2
gfx/tests/reftest/1086723.html
Просмотреть файл

@ -16,7 +16,7 @@
height: 5000px;
}
body,html {
overflow: hidden;
scrollbar-width: none;
}
</style>
</head>

2
gfx/tests/reftest/1524261.html
Просмотреть файл

@ -1,6 +1,6 @@
<!DOCTYPE html>
<html reftest-async-scroll>
<div style="overflow-y:hidden; position:absolute; top:50px; width: 200px; height: 100px; border: solid 1px black"
<div style="overflow-y:scroll; scrollbar-width:none; position:absolute; top:50px; width: 200px; height: 100px; border: solid 1px black"
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="200" reftest-displayport-h="300"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">

2
layout/reftests/async-scrolling/background-blend-mode-1.html
Просмотреть файл

@ -14,7 +14,7 @@ html {
radial-gradient(circle 200px at 400px 400px, blue 100px, transparent 0) scroll
white no-repeat;
background-blend-mode: multiply;
overflow: hidden;
scrollbar-width: none;
}
body {

5
layout/reftests/async-scrolling/bg-fixed-1.html
Просмотреть файл

@ -2,8 +2,9 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">
<body style="overflow:hidden; height:3000px;
reftest-async-scroll-x="0" reftest-async-scroll-y="50"
style="scrollbar-width:none">
<body style="height:3000px;
background-image:url(repeatable-diagonal-gradient.png);
background-attachment:fixed;
background-repeat:no-repeat;

5
layout/reftests/async-scrolling/bg-fixed-child-clip-1.html
Просмотреть файл

@ -2,8 +2,9 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">
<body style="overflow:hidden; height:3000px; margin:0;">
reftest-async-scroll-x="0" reftest-async-scroll-y="50"
style="scrollbar-width:none">
<body style="height:3000px; margin:0;">
<div style="margin-top: 100px; height: 100px;
background-image:url(repeatable-diagonal-gradient.png);
background-attachment:fixed;

5
layout/reftests/async-scrolling/bg-fixed-child-clip-2.html
Просмотреть файл

@ -2,8 +2,9 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">
<body style="overflow:hidden; height:3000px; margin:0;">
reftest-async-scroll-x="0" reftest-async-scroll-y="50"
style="scrollbar-width:none">
<body style="height:3000px; margin:0;">
<div style="margin-top: 100px; height: 100px;
position: relative;">
<div style="position: absolute;

5
layout/reftests/async-scrolling/bg-fixed-child-mask.html
Просмотреть файл

@ -2,8 +2,9 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">
<body style="overflow:hidden; height:3000px; margin:0;">
reftest-async-scroll-x="0" reftest-async-scroll-y="50"
style="scrollbar-width:none">
<body style="height:3000px; margin:0;">
<div style="margin-top: 100px; height: 100px;
background-image:url(repeatable-diagonal-gradient.png);
background-attachment:fixed;

5
layout/reftests/async-scrolling/bg-fixed-child-no-culling-1.html
Просмотреть файл

@ -2,8 +2,9 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">
<body style="overflow:hidden; height:3000px; margin:0;">
reftest-async-scroll-x="0" reftest-async-scroll-y="50"
style="scrollbar-width:none">
<body style="height:3000px; margin:0;">
<div style="height: 50px; position: relative;
background:url(repeatable-diagonal-gradient.png) top left fixed no-repeat;">
</div>

5
layout/reftests/async-scrolling/bg-fixed-child-no-culling-2.html
Просмотреть файл

@ -2,8 +2,9 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="1000">
<body style="overflow: hidden; height: 3000px; margin: 0;">
reftest-async-scroll-x="0" reftest-async-scroll-y="1000"
style="scrollbar-width:none">
<body style="height: 3000px; margin: 0;">
<div style="height: 1200px;
background: linear-gradient(white, white) top left fixed no-repeat;">
</div>

2
layout/reftests/async-scrolling/bg-fixed-child-no-culling-3.html
Просмотреть файл

@ -3,7 +3,7 @@
reftest-displayport-x="0" reftest-displayport-y="-150"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="-150"
style="overflow: hidden; background: linear-gradient(white, white) top left fixed no-repeat;">
style="scrollbar-width: none; background: linear-gradient(white, white) top left fixed no-repeat;">
<body style="height: 3000px; margin: 0;">
<div style="width: 200px; height: 100px; background: lime;"></div>

5
layout/reftests/async-scrolling/bg-fixed-child.html
Просмотреть файл

@ -2,8 +2,9 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">
<body style="overflow:hidden; height:3000px; margin:0;">
reftest-async-scroll-x="0" reftest-async-scroll-y="50"
style="scrollbar-width:none">
<body style="height:3000px; margin:0;">
<div style="height: 1000px;
background-image:url(repeatable-diagonal-gradient.png);
background-attachment:fixed;

5
layout/reftests/async-scrolling/bg-fixed-cover-1.html
Просмотреть файл

@ -2,8 +2,9 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="400">
<body style="overflow:hidden; height:3000px;
reftest-async-scroll-x="0" reftest-async-scroll-y="400"
style="scrollbar-width:none">
<body style="height:3000px;
background-image:url(repeatable-diagonal-gradient.png);
background-attachment:fixed;
background-repeat:no-repeat;

5
layout/reftests/async-scrolling/bg-fixed-cover-2.html
Просмотреть файл

@ -2,8 +2,9 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="300">
<body style="overflow:hidden; height:3000px;
reftest-async-scroll-x="0" reftest-async-scroll-y="300"
style="scrollbar-width:none">
<body style="height:3000px;
background-image:url(repeatable-diagonal-gradient.png), url(repeatable-diagonal-gradient.png);
background-attachment:fixed, scroll;
background-repeat:no-repeat;

5
layout/reftests/async-scrolling/bg-fixed-cover-3.html
Просмотреть файл

@ -2,8 +2,9 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="300">
<body style="overflow:hidden; height:3000px;
reftest-async-scroll-x="0" reftest-async-scroll-y="300"
style="scrollbar-width:none">
<body style="height:3000px;
background-image:url(repeatable-diagonal-gradient.png), url(repeatable-diagonal-gradient.png);
background-attachment:fixed, scroll;
background-repeat:no-repeat;

3
layout/reftests/async-scrolling/bg-fixed-in-css-filter.html
Просмотреть файл

@ -7,7 +7,8 @@
.scrollable {
width: 100px;
height: 100px;
overflow: hidden;
overflow: scroll;
scrollbar-width: none;
}
.bg {
width: 100px;

5
layout/reftests/async-scrolling/bg-fixed-in-opacity.html
Просмотреть файл

@ -5,11 +5,14 @@
reftest-async-scroll-x="0" reftest-async-scroll-y="50.23">
<style>
html {
scrollbar-width: none;
}
body {
margin: 0px;
position: relative;
height: 1200.23px;
overflow: hidden;
}
.fixed-background {

5
layout/reftests/async-scrolling/bg-fixed-transformed-image.html
Просмотреть файл

@ -5,9 +5,12 @@
reftest-async-scroll-x="0" reftest-async-scroll-y="50">
<style>
html {
scrollbar-width: none;
}
body {
margin: 0;
overflow: hidden;
}
div {

5
layout/reftests/async-scrolling/checkerboard-1.html
Просмотреть файл

@ -2,10 +2,11 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="1800">
reftest-async-scroll-x="0" reftest-async-scroll-y="1800"
style="scrollbar-width:none">
<!-- This is a simple test where we set the async-scroll position so that it
extends outside the displayport, and ensure that the checkerboarded area
is filled with the expected background color. -->
<body style="background-color: green; height: 5000px; overflow:hidden">
<body style="background-color: green; height: 5000px">
<div style="position:absolute; left: 0px; top: 1800px; width: 100px; height: 400px; background-color: red"></div>
</body>

5
layout/reftests/async-scrolling/checkerboard-2.html
Просмотреть файл

@ -2,14 +2,15 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="1800">
reftest-async-scroll-x="0" reftest-async-scroll-y="1800"
style="scrollbar-width: none">
<!-- This is a test where we set the async-scroll position so that it
extends outside the displayport, but also have some fixed-position
elements in the mix. In particular, the purple element is below
(in z-order) the main scrolling content and should not be made visible
while checkerboarding; the checkerboarding code should cover it up
with the appropriate background color. -->
<body style="background-color: green; height: 5000px; overflow:hidden">
<body style="background-color: green; height: 5000px">
<div style="position:fixed; left: 0px; top: 0px; width: 100px; height: 500px; background-color: purple; z-index: -1"></div>
<div style="position:absolute; left: 0px; top: 500px; background-color: yellow; width: 100px; height: 4500px"></div>
<div style="position:fixed; left: 10px; top: 10px; width: 10px; height: 10px; background-color: blue"></div>

5
layout/reftests/async-scrolling/checkerboard-3.html
Просмотреть файл

@ -2,12 +2,13 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="2100">
reftest-async-scroll-x="0" reftest-async-scroll-y="2100"
style="scrollbar-width: none">
<!-- This is the exact same test as checkerboard-2.html, but we put
the scroll position entirely outside of the displayport. This ensures
that even we do the proper checkerboarding even if the layer would
otherwise be culled out in the compositor because it is not on-screen. -->
<body style="background-color: green; height: 5000px; overflow:hidden">
<body style="background-color: green; height: 5000px">
<div style="position:fixed; left: 0px; top: 0px; width: 100px; height: 500px; background-color: purple; z-index: -1"></div>
<div style="position:absolute; left: 0px; top: 500px; background-color: yellow; width: 100px; height: 4500px"></div>
<div style="position:fixed; left: 10px; top: 10px; width: 10px; height: 10px; background-color: blue"></div>

3
layout/reftests/async-scrolling/contain-paint-scrollable-frame-1.html
Просмотреть файл

@ -1,7 +1,8 @@
<!DOCTYPE HTML>
<html reftest-async-scroll>
<body>
<div style="width:400px; height:200px; overflow:hidden;
<div style="width:400px; height:200px; overflow:scroll;
scrollbar-width: none;
border:2px solid black; background: red;
contain:paint;"
reftest-displayport-x="0" reftest-displayport-y="0"

2
layout/reftests/async-scrolling/element-1.html
Просмотреть файл

@ -2,7 +2,7 @@
<html reftest-async-scroll>
<body>
<!-- Test that element content scrolls asynchronously -->
<div style="width:400px; height:500px; overflow:hidden; border:2px solid black"
<div style="width:400px; height:500px; overflow:scroll; scrollbar-width: none; border:2px solid black"
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">

5
layout/reftests/async-scrolling/fixed-pos-scrollable-1.html
Просмотреть файл

@ -2,9 +2,10 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="80">
reftest-async-scroll-x="0" reftest-async-scroll-y="80"
style="scrollbar-width: none">
<meta name="viewport" content="width=device-width">
<body style="height: 5000px; overflow:hidden">
<body style="height: 5000px">
<!-- In this test the fixed-position element is a child of the scrollable layer, but
gets a clip rect because it is itself a container for scrolling sublayers. This
tests that such a layer is transformed correctly while an async scroll transform

5
layout/reftests/async-scrolling/group-opacity-surface-size-1.html
Просмотреть файл

@ -5,9 +5,12 @@
reftest-async-scroll-x="0" reftest-async-scroll-y="100">
<style>
html {
scrollbar-width: none;
}
body {
margin: 0;
overflow: hidden;
height: 4000px;
}

2
layout/reftests/async-scrolling/iframe-1.html
Просмотреть файл

@ -5,7 +5,7 @@
srcdoc="<!DOCTYPE HTML>
<html reftest-displayport-x='0' reftest-displayport-y='0'
reftest-displayport-w='800' reftest-displayport-h='2000'
reftest-async-scroll-x='0' reftest-async-scroll-y='50' style='overflow:hidden'>
reftest-async-scroll-x='0' reftest-async-scroll-y='50' style='scrollbar-width: none'>
<div style='height:500px'></div>
<div style='height:200px; background:purple'>
<div style='display:inline-block; width:20px; height:20px; background:yellow;'></div>

4
layout/reftests/async-scrolling/nested-1.html
Просмотреть файл

@ -2,11 +2,11 @@
<html reftest-async-scroll>
<body>
<!-- Test that nested active scrolling elements work -->
<div style="width:400px; height:500px; overflow:hidden; border:2px solid black"
<div style="width:400px; height:500px; overflow:scroll; scrollbar-width: none; border:2px solid black"
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">
<div style="width:300px; height:800px; overflow:hidden; border:2px solid blue"
<div style="width:300px; height:800px; overflow:scroll; scrollbar-width: none; border:2px solid blue"
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">

4
layout/reftests/async-scrolling/nested-2.html
Просмотреть файл

@ -2,11 +2,11 @@
<html reftest-async-scroll>
<body>
<!-- Test that nested active scrolling elements work -->
<div style="width:400px; height:500px; overflow:hidden; border:2px solid black"
<div style="width:400px; height:500px; overflow:scroll; scrollbar-width: none; border:2px solid black"
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">
<div style="width:300px; height:100px; overflow:hidden; border:2px solid blue; margin-top: 100px"
<div style="width:300px; height:100px; overflow:scroll; scrollbar-width: none; border:2px solid blue; margin-top: 100px"
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="0">

3
layout/reftests/async-scrolling/offscreen-prerendered-active-opacity.html
Просмотреть файл

@ -9,7 +9,8 @@
border: 1px solid black;
width: 200px;
height: 200px;
overflow: hidden;
overflow: scroll;
scrollbar-width: none;
}
.scrolledContent {

5
layout/reftests/async-scrolling/position-fixed-1.html
Просмотреть файл

@ -2,8 +2,9 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">
<body style="overflow:hidden; height:3000px">
reftest-async-scroll-x="0" reftest-async-scroll-y="50"
style="scrollbar-width:none">
<body style="height:3000px">
<!-- Test that position:fixed content stays fixed when we async-scroll -->
<div style="position:fixed; background:blue; top:0; left:0; width:200px; height:100px"></div>
</body>

5
layout/reftests/async-scrolling/position-fixed-2.html
Просмотреть файл

@ -2,8 +2,9 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">
<body style="overflow:hidden; height:3000px">
reftest-async-scroll-x="0" reftest-async-scroll-y="50"
style="scrollbar-width:none">
<body style="height:3000px">
<!-- test that a fixed-pos element whose contents are interleaved in z-order
with non-scrolling content works correctly with async scrolling -->
<div style="position:absolute; top:25px; left:0; width:100px; height:200px; background:yellow; z-index:1"></div>

4
layout/reftests/async-scrolling/position-fixed-async-zoom-1.html
Просмотреть файл

@ -6,10 +6,12 @@
reftest-async-zoom="2.0">
<head>
<style>
html {
scrollbar-width: none;
}
body {
height: 3000px;
margin: 0;
overflow: hidden;
}
div {
position: fixed;

3
layout/reftests/async-scrolling/position-fixed-body-ref.html
Просмотреть файл

@ -8,7 +8,8 @@ body {
#scrollbox {
width: 100%;
height: 100%;
overflow: hidden;
overflow: scroll;
scrollbar-width: none;
}
#scrolledContents {
height: 10000px;

3
layout/reftests/async-scrolling/position-fixed-body.html
Просмотреть файл

@ -12,7 +12,8 @@ body {
#scrollbox {
width: 100%;
height: 100%;
overflow: hidden;
overflow: scroll;
scrollbar-width: none;
}
#scrolledContents {
height: 10000px;

5
layout/reftests/async-scrolling/position-fixed-cover-1.html
Просмотреть файл

@ -2,8 +2,9 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="400">
<body style="overflow:hidden; height:3000px">
reftest-async-scroll-x="0" reftest-async-scroll-y="400"
style="scrollbar-width:none">
<body style="height:3000px">
<!-- Test that position:fixed content covered by scrolling content gets rendered
properly -->
<div style="position:fixed; background:blue; top:300px; left:0; width:500px; height:200px; z-index:1"></div>

5
layout/reftests/async-scrolling/position-fixed-cover-2.html
Просмотреть файл

@ -2,8 +2,9 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="400">
<body style="overflow:hidden; height:3000px">
reftest-async-scroll-x="0" reftest-async-scroll-y="400"
style="scrollbar-width:none">
<body style="height:3000px">
<!-- Test that scrolling content covered by position-fixed content
gets rendered properly -->
<div style="position:absolute; background:black; top:300px; left:0; width:500px; height:200px; z-index:1"></div>

5
layout/reftests/async-scrolling/position-fixed-cover-3.html
Просмотреть файл

@ -2,8 +2,9 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="400">
<body style="overflow:hidden; height:3000px">
reftest-async-scroll-x="0" reftest-async-scroll-y="400"
style="scrollbar-width:none">
<body style="height:3000px">
<!-- Test that scrolling content above position-fixed content but not
intersecting it doesn't get moved down to a layer below the
position-fixed content -->

10
layout/reftests/async-scrolling/position-fixed-iframe-1.html
Просмотреть файл

@ -2,15 +2,17 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="0">
<body style="overflow:hidden; height:3000px; margin:0;">
reftest-async-scroll-x="0" reftest-async-scroll-y="0"
style="scrollbar-width:none">
<body style="height:3000px; margin:0;">
<!-- Test that position:fixed content stays fixed when we async-scroll -->
<iframe style="border:0; width:400px; height:400px;" src="data:text/html,
<!DOCTYPE HTML>
<html reftest-displayport-x='0' reftest-displayport-y='0'
reftest-displayport-w='800' reftest-displayport-h='2000'
reftest-async-scroll-x='0' reftest-async-scroll-y='50'>
<body style='overflow:hidden; height:3000px'>
reftest-async-scroll-x='0' reftest-async-scroll-y='50'
style='scrollbar-width:none'>
<body style='height:3000px'>
<div style='position:fixed; background:blue; top:0; left:0; width:200px; height:100px'></div>
<div style='background:red; margin-top:100px; width:100px; height:50px'></div>
</body>

10
layout/reftests/async-scrolling/position-fixed-iframe-2.html
Просмотреть файл

@ -2,15 +2,17 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="80">
<body style="overflow:hidden; height:3000px; margin:0;">
reftest-async-scroll-x="0" reftest-async-scroll-y="80"
style="scrollbar-width:none">
<body style="height:3000px; margin:0;">
<!-- Test that position:fixed content stays fixed when we async-scroll -->
<iframe style="border:0; width:400px; height:400px; margin-top:80px;" src="data:text/html,
<!DOCTYPE HTML>
<html reftest-displayport-x='0' reftest-displayport-y='0'
reftest-displayport-w='800' reftest-displayport-h='2000'
reftest-async-scroll-x='0' reftest-async-scroll-y='50'>
<body style='overflow:hidden; height:3000px'>
reftest-async-scroll-x='0' reftest-async-scroll-y='50'
style='scrollbar-width:none'>
<body style='height:3000px'>
<div style='position:fixed; background:blue; top:0; left:0; width:200px; height:100px'></div>
<div style='background:red; margin-top:100px; width:100px; height:50px'></div>
</body>

3
layout/reftests/async-scrolling/position-fixed-in-scroll-container.html
Просмотреть файл

@ -20,7 +20,8 @@ body {
border: 1px solid black;
width: 200px;
height: 400px;
overflow: hidden;
overflow: scroll;
scrollbar-width: none;
}
.inner-opacity {

4
layout/reftests/async-scrolling/position-fixed-inside-clip-path.html
Просмотреть файл

@ -4,10 +4,12 @@
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">
<style>
html {
scrollbar-width: none;
}
body {
height: 4000px;
margin: 0;
overflow: hidden;
}
#clip {
position: absolute;

4
layout/reftests/async-scrolling/position-fixed-inside-sticky-1.html
Просмотреть файл

@ -4,10 +4,12 @@
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">
<style>
html {
scrollbar-width: none;
}
body {
height: 4000px;
margin: 0;
overflow: hidden;
}
#sticky {
position: sticky;

4
layout/reftests/async-scrolling/position-fixed-inside-sticky-2.html
Просмотреть файл

@ -4,10 +4,12 @@
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">
<style>
html {
scrollbar-width: none;
}
body {
height: 4000px;
margin: 0;
overflow: hidden;
}
#sticky {
position: sticky;

4
layout/reftests/async-scrolling/position-fixed-inside-sticky-3.html
Просмотреть файл

@ -4,10 +4,12 @@
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="300">
<style>
html {
scrollbar-width: none;
}
body {
height: 4000px;
margin: 0;
overflow: hidden;
}
#sticky {
position: sticky;

4
layout/reftests/async-scrolling/position-sticky-async-zoom-1.html
Просмотреть файл

@ -6,10 +6,12 @@
reftest-async-zoom="2.0">
<head>
<style>
html {
scrollbar-width: none;
}
body {
height: 3000px;
margin: 0;
overflow: hidden;
}
div {
position: sticky;

4
layout/reftests/async-scrolling/position-sticky-bug1434250.html
Просмотреть файл

@ -6,8 +6,8 @@
<head>
<meta charset='utf-8'>
<style type="text/css" media="all">
body {
overflow: hidden;
html {
scrollbar-width: none;
}
.container {
width: 500px;

5
layout/reftests/async-scrolling/position-sticky-transformed.html
Просмотреть файл

@ -2,8 +2,9 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">
<body style="height:3000px; margin: 0px; overflow: hidden">
reftest-async-scroll-x="0" reftest-async-scroll-y="50"
style="scrollbar-width: none">
<body style="height:3000px; margin: 0px;">
<div style="position:sticky; transform: rotateX(30deg) rotateY(10deg); background:blue; top:0; left:0; width:200px; height:100px"></div>
</body>
</html>

2
layout/reftests/async-scrolling/reftest.list
Просмотреть файл

@ -35,7 +35,7 @@ skip-if(!asyncPan) == sticky-pos-scrollable-4.html sticky-pos-scrollable-4-ref.h
skip-if(!asyncPan) == sticky-pos-scrollable-5.html sticky-pos-scrollable-5-ref.html
skip-if(!asyncPan) == sticky-pos-scrollable-6.html sticky-pos-scrollable-6-ref.html
skip-if(!asyncPan) == sticky-pos-scrollable-7.html sticky-pos-scrollable-7-ref.html
skip-if(!asyncPan) == fixed-pos-scrollable-1.html fixed-pos-scrollable-1-ref.html
skip-if(!asyncPan) fuzzy(0-2,0-2) == fixed-pos-scrollable-1.html fixed-pos-scrollable-1-ref.html
skip-if(!asyncPan) == culling-1.html culling-1-ref.html
fails-if(browserIsFission) skip-if(!asyncPan) == position-fixed-iframe-1.html position-fixed-iframe-1-ref.html
fails-if(browserIsFission) skip-if(!asyncPan) == position-fixed-iframe-2.html position-fixed-iframe-2-ref.html

2
layout/reftests/async-scrolling/split-layers-1.html
Просмотреть файл

@ -4,7 +4,7 @@
<!-- Test that element content scrolls asynchronously even when content
has to be split into separate layers with non-scrolling content in
between -->
<div style="width:400px; height:500px; overflow:hidden; border:2px solid black"
<div style="width:400px; height:500px; overflow: scroll; scrollbar-width: none; border:2px solid black"
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">

7
layout/reftests/async-scrolling/split-layers-multi-scrolling-1.html
Просмотреть файл

@ -2,12 +2,13 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">
<body style="height:3000px; overflow:hidden">
reftest-async-scroll-x="0" reftest-async-scroll-y="50"
style="scrollbar-width:none">
<body style="height:3000px">
<!-- Test that element content scrolls asynchronously even when content
has to be split into separate layers with non-scrolling content in
between -->
<div style="width:400px; height:500px; overflow:hidden; border:2px solid black"
<div style="width:400px; height:500px; overflow: scroll; scrollbar-width: none; border:2px solid black"
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">

2
layout/reftests/async-scrolling/split-opacity-layers-1.html
Просмотреть файл

@ -1,7 +1,7 @@
<!DOCTYPE HTML>
<html reftest-async-scroll>
<body>
<div style="width:400px; height:500px; overflow:hidden; border:2px solid black"
<div style="width:400px; height:500px; overflow:scroll; scrollbar-width: none; border:2px solid black"
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">

3
layout/reftests/async-scrolling/sticky-inside-fixed-1.html
Просмотреть файл

@ -11,7 +11,8 @@
}
.scrollable {
height:100%;
overflow-y:hidden;
overflow-y: scroll;
scrollbar-width: none;
}
.sticky {
position:sticky;

2
layout/reftests/async-scrolling/sticky-pos-scrollable-1.html
Просмотреть файл

@ -1,7 +1,7 @@
<!DOCTYPE HTML>
<html reftest-async-scroll>
<body>
<div style="width:400px; height:300px; overflow:hidden; border:2px solid black"
<div style="width:400px; height:300px; overflow:scroll; scrollbar-width:none; border:2px solid black"
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="100">

4
layout/reftests/async-scrolling/sticky-pos-scrollable-2.html
Просмотреть файл

@ -4,10 +4,12 @@
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="100">
<style>
html {
scrollbar-width: none;
}
body {
margin: 0;
height: 4000px;
overflow: hidden;
}
div {
background: blue;

4
layout/reftests/async-scrolling/sticky-pos-scrollable-3.html
Просмотреть файл

@ -5,7 +5,7 @@
reftest-async-scroll-x="0" reftest-async-scroll-y="100">
<style>
html {
overflow: hidden;
scrollbar-width: none;
}
#section {
padding-top: 1px;
@ -30,4 +30,4 @@
</div>
<div id="spacer"></div>
</div>
</html>
</html>

2
layout/reftests/async-scrolling/sticky-pos-scrollable-4.html
Просмотреть файл

@ -1,7 +1,7 @@
<!DOCTYPE HTML>
<html reftest-async-scroll>
<body>
<div style="width:400px; height:300px; overflow:hidden; border:2px solid black"
<div style="width:400px; height:300px; overflow:scroll; scrollbar-width:none; border:2px solid black"
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="100">

2
layout/reftests/async-scrolling/sticky-pos-scrollable-5.html
Просмотреть файл

@ -1,7 +1,7 @@
<!DOCTYPE HTML>
<html reftest-async-scroll>
<body>
<div style="width:400px; height:300px; overflow:hidden; border:2px solid black"
<div style="width:400px; height:300px; overflow:scroll; scrollbar-width:none; border:2px solid black"
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="150">

2
layout/reftests/async-scrolling/sticky-pos-scrollable-6.html
Просмотреть файл

@ -1,7 +1,7 @@
<!DOCTYPE HTML>
<html reftest-async-scroll>
<body>
<div style="width:400px; height:300px; overflow:hidden; border:2px solid black"
<div style="width:400px; height:300px; overflow:scroll; scrollbar-width:none; border:2px solid black"
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="300">

2
layout/reftests/async-scrolling/sticky-pos-scrollable-7.html
Просмотреть файл

@ -5,7 +5,7 @@
reftest-async-scroll-x="0" reftest-async-scroll-y="100">
<style>
html {
overflow: hidden;
scrollbar-width: none;
}
#section {
padding-top: 1px;

2
layout/reftests/display-list/1437374-1.html
Просмотреть файл

@ -1,7 +1,7 @@
<!DOCTYPE HTML>
<html reftest-async-scroll class="reftest-wait reftest-snapshot-all">
<body>
<div style="width:400px; height:500px; overflow:hidden; border:2px solid black"
<div style="width:400px; height:500px; overflow: scroll; scrollbar-width: none; border:2px solid black"
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">

5
layout/reftests/display-list/1464288-1.html
Просмотреть файл

@ -8,10 +8,13 @@
<style>
html {
scrollbar-width: none;
}
body {
margin: 0;
height: 4000px;
overflow:hidden;
}
div {

5
layout/reftests/display-list/retained-dl-async-scrolled-1.html
Просмотреть файл

@ -8,10 +8,13 @@
<style>
html {
scrollbar-width: none;
}
body {
margin: 0;
height: 4000px;
overflow:hidden;
}
div {

3
layout/reftests/position-sticky/inline-4.html
Просмотреть файл

@ -13,7 +13,8 @@
margin-top: 100px;
height: 200px;
width: 500px;
overflow: hidden;
overflow: scroll;
scrollbar-width: none;
}
#container {
background: pink;

5
layout/reftests/reftest-sanity/async-scroll-1a.html
Просмотреть файл

@ -2,8 +2,9 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="2000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">
<body style="background:red; margin:0; overflow:hidden">
reftest-async-scroll-x="0" reftest-async-scroll-y="50"
style="scrollbar-width:none">
<body style="background:red; margin:0">
<div style="position:absolute; background:lime; top:50px; left:0; width:800px; height:1000px"></div>
<div style="position:absolute; background:yellow; bottom:-50px; left:50px; width:50px; height:50px"></div>
</body>

5
layout/reftests/reftest-sanity/async-scroll-1b.html
Просмотреть файл

@ -2,8 +2,9 @@
<html reftest-async-scroll
reftest-displayport-x="0" reftest-displayport-y="0"
reftest-displayport-w="800" reftest-displayport-h="1000"
reftest-async-scroll-x="0" reftest-async-scroll-y="50">
<body style="background:red; margin:0; overflow:hidden">
reftest-async-scroll-x="0" reftest-async-scroll-y="50"
style="scrollbar-width:none">
<body style="background:red; margin:0">
<div style="position:absolute; background:lime; top:50px; left:0; width:800px; height:1000px"></div>
<div style="position:absolute; background:yellow; bottom:-50px; left:50px; width:50px; height:50px"></div>
</body>