Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-09-18 02:48:20 +01:00
Code Issues Projects Releases Packages Wiki Activity

Fix various issues with overflow clipping

Browse source 
When dealing absolutely positioned items, we should use clip of our
containing block, even if our containing block doesn't itself establish
a new overflow clip. Additionally, we need to properly handle
assigning scroll root ids to fragments of inline elements.

We add a test for this behavior.
This commit is contained in:
Martin Robinson 2017-04-14 20:07:42 +02:00
parent f537fbd08f
commit 4213b320d1
4 changed files with 111 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

25
tests/wpt/mozilla/meta/MANIFEST.json
View file

@ -4127,6 +4127,18 @@
{}
]
],
"css/overflow_clipping.html": [
[
"/_mozilla/css/overflow_clipping.html",
[
[
"/_mozilla/css/overflow_clipping_ref.html",
"=="
]
],
{}
]
],
"css/overflow_position_abs_inline_block.html": [
[
"/_mozilla/css/overflow_position_abs_inline_block.html",
@ -8483,6 +8495,11 @@
{}
]
],
"css/overflow_clipping_ref.html": [
[
{}
]
],
"css/overflow_position_abs_inline_block_ref.html": [
[
{}
@ -22795,6 +22812,14 @@
"3798d0efb1b9858ad47ecf6f09357c3c0dae1b80",
"support"
],
"css/overflow_clipping.html": [
"f87d3c74c15393fb490e3855c88f6331fce9e077",
"reftest"
],
"css/overflow_clipping_ref.html": [
"d9a6a3b4fa21742d0f4ddd3f348534ec35ab8579",
"support"
],
"css/overflow_position_abs_inline_block.html": [
"7550f9c9f3e91635c15554d9ae21e172944054e6",
"reftest"

39
tests/wpt/mozilla/tests/css/overflow_clipping.html Normal file
View file

@ -0,0 +1,39 @@
<!DOCTYPE html>
<html>
<head>
<link rel='match' href='overflow_clipping_ref.html'>
<style>
.test { float: left; margin-right: 25px; }
.box { height: 50px; width: 50px; }
.grayer { background: rgb(80, 80, 80); }
.grayest { background: rgb(0, 0, 0); }
.overflowing-absolute-child {
position: absolute;
left: 10px;
top: 10px;
width: 200px;
height: 200px;
}
</style>
</head>
<body>
<div class="test grayest box" style="overflow: scroll">
<div style="position: relative;">
<div class="overflowing-absolute-child grayer"></div>
</div>
</div>
<!-- This box is positioned and sized very strangely because of
https://github.com/servo/servo/issues/16462. For now we diable
this test until the bug is fixed.
<div class="test grayest box" style="overflow: scroll">
<span style="position: relative;">
<div class="overflowing-absolute-child grayer"></div>
</span>
</div>
-->
</body>
</html>

26
tests/wpt/mozilla/tests/css/overflow_clipping_ref.html Normal file
View file

@ -0,0 +1,26 @@
<!DOCTYPE html>
<html>
<head>
<style>
.test { float: left; margin-right: 25px; }
.box { height: 50px; width: 50px; }
.smallbox { height: 40px; width: 40px; }
.grayer { background: rgb(80, 80, 80); }
.grayest { background: rgb(0, 0, 0); }
</style>
</head>
<body>
<div class="test grayest box">
<div class="grayer smallbox" style="margin-left: 10px; margin-top: 10px;"></div>
</div>
<!-- This box is positioned and sized very strangely because of
https://github.com/servo/servo/issues/16462. For now we diable
this test until the bug is fixed.
<div class="test grayest box">
<div class="grayer smallbox" style="margin-left: 10px; margin-top: 25px; height: 25px;"></div>
</div>
-->
</body>
</html>