diff options
| author | Patrick Walton <pcwalton@mimiga.net> | 2015-08-11 17:39:43 -0700 |
|---|---|---|
| committer | Patrick Walton <pcwalton@mimiga.net> | 2015-08-17 12:43:12 -0700 |
| commit | a30379975a50e52dd8ad7b7b0f95447efe231c5a (patch) | |
| tree | 1a8340f927374a207294abae9bf915800d7427f9 /tests | |
| parent | 55e755e35ac8622a80cbebe3395aae44a0239b4f (diff) | |
| download | servo-a30379975a50e52dd8ad7b7b0f95447efe231c5a.tar.gz servo-a30379975a50e52dd8ad7b7b0f95447efe231c5a.zip | |
layout: Improve our handling of inline absolute containing blocks.
Several issues are addressed in this commit:
* Inline flows now bubble up their absolute descendants instead of
making the inline flow the containing block for them. (In the future,
we will need to make the inline flow *sometimes* be the containing
block for them, but for now it improves sites to unconditionally
bubble up.)
* Fragments now look at their inline fragment context to determine
whether they are positioned.
* Inline flows now push the stacking-relative position of the absolute
containing block down to their inline-block fragments.
* Inline absolute hypothetical fragments can be containing blocks.
* Fixes the logic in
`containing_block_range_for_flow_surrounding_fragment_at_index`. The
condition to determine whether fragments are positioned was inverted!
* `Descendants`/`AbsDescendants` has been refactored in order to become
more friendly to inline absolute containing blocks in the future.
Improves the inline position of the green drop-down arrow in the Google
SERPs. (The block position is still wrong.)
Diffstat (limited to 'tests')
5 files changed, 71 insertions, 9 deletions
diff --git a/tests/ref/absolute_hypothetical_with_intervening_inline_block_a.html b/tests/ref/absolute_hypothetical_with_intervening_inline_block_a.html new file mode 100644 index 00000000000..587dde3c589 --- /dev/null +++ b/tests/ref/absolute_hypothetical_with_intervening_inline_block_a.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<style> +em { + position: relative; +} +main { + display: inline-block; +} +section { + display: inline; + position: absolute; + top: 0; + left: 0; + background: white; + width: 48px; + height: 48px; +} +strong { + color: red; +} +</style> +There should be no red.<em><main><section></section></main></em><strong>_</strong> + diff --git a/tests/ref/absolute_hypothetical_with_intervening_inline_block_ref.html b/tests/ref/absolute_hypothetical_with_intervening_inline_block_ref.html new file mode 100644 index 00000000000..985e941cdd9 --- /dev/null +++ b/tests/ref/absolute_hypothetical_with_intervening_inline_block_ref.html @@ -0,0 +1,3 @@ +<!DOCTYPE html> +There should be no red. + diff --git a/tests/ref/absolute_inline_containing_block_a.html b/tests/ref/absolute_inline_containing_block_a.html index 84584219490..a10d4fa9e3d 100644 --- a/tests/ref/absolute_inline_containing_block_a.html +++ b/tests/ref/absolute_inline_containing_block_a.html @@ -5,7 +5,6 @@ html, body { margin: 0; font-size: 0.1px; - line-height: 0; } #a { padding-left: 100px; @@ -21,10 +20,46 @@ html, body { height: 100px; background: purple; } +.cover-up-platform-specific-differences { + position: absolute; + background: white; +} +#cover-up-platform-specific-differences-a, #cover-up-platform-specific-differences-b { + left: 0; + width: 300px; +} +#cover-up-platform-specific-differences-c, #cover-up-platform-specific-differences-d { + top: 0; + height: 300px; +} +#cover-up-platform-specific-differences-a { + top: 0; + height: 25px; +} +#cover-up-platform-specific-differences-b { + top: 75px; + height: 100px; +} +#cover-up-platform-specific-differences-c { + left: 0; + width: 125px; +} +#cover-up-platform-specific-differences-d { + left: 175px; + width: 100px; +} </style> </head> <body> -<div><span id=a> </span><span id=b> <div id=c></div></span></span></div> +<div><span id=a>a</span><span id=b><div id=c></div></span></span></div> +<div class=cover-up-platform-specific-differences id=cover-up-platform-specific-differences-a> +</div> +<div class=cover-up-platform-specific-differences id=cover-up-platform-specific-differences-b> +</div> +<div class=cover-up-platform-specific-differences id=cover-up-platform-specific-differences-c> +</div> +<div class=cover-up-platform-specific-differences id=cover-up-platform-specific-differences-d> +</div> </body> </html> diff --git a/tests/ref/absolute_inline_containing_block_ref.html b/tests/ref/absolute_inline_containing_block_ref.html index a7b1de7e4b4..9a36136b853 100644 --- a/tests/ref/absolute_inline_containing_block_ref.html +++ b/tests/ref/absolute_inline_containing_block_ref.html @@ -4,20 +4,20 @@ <style> html, body { margin: 0; - font-size: 0.1px; + font-size: 0; } -#a { +div { position: absolute; - left: 100px; - top: 0; - width: 100px; - height: 100px; + top: 25px; + left: 125px; + width: 50px; + height: 50px; background: purple; } </style> </head> <body> -<div id=a></div> +<div></div> </body> </html> diff --git a/tests/ref/basic.list b/tests/ref/basic.list index 3f6c6c6316f..465e1ea4501 100644 --- a/tests/ref/basic.list +++ b/tests/ref/basic.list @@ -10,6 +10,7 @@ fragment=top != ../html/acid2.html acid2_ref.html == abs_rel_explicit_height.html abs_rel_explicit_height_ref.html +== absolute_hypothetical_with_intervening_inline_block_a.html absolute_hypothetical_with_intervening_inline_block_ref.html == absolute_inline_containing_block_a.html absolute_inline_containing_block_ref.html == absolute_z_index_auto_paint_order_a.html absolute_z_index_auto_paint_order_ref.html == acid1_a.html acid1_b.html |