Integrate Canvas into the DisplayList
Canvas is currently given a layer at the stacking context level.
Instead it's DisplayItem should be given a layer directly. This fixes
painting order issues where canvases are painted on top of other
positioned content that is later in tree order. It always simplifies
the code a bit.
<!-- Reviewable:start -->
[<img src="https://reviewable.io/review_button.png" height=40 alt="Review on Reviewable"/>](https://reviewable.io/reviews/servo/servo/8140)
<!-- Reviewable:end -->
Canvas is currently given a layer at the stacking context level.
Instead it's DisplayItem should be given a layer directly. This fixes
painting order issues where canvases are painted on top of other
positioned content that is later in tree order. It always simplifies
the code a bit.
Integrate iframes into the display list
Instead of always promoting iframes to StackingContexts, integrate them
into the display list. This prevents stacking bugs when
non-stacking-context elements should be drawn on top of iframes.
To accomplish this, we add another step to ordering layer creation,
where LayeredItems in the DisplayList are added to layers described by
the LayerInfo structures collected at the end of the DisplayList.
Unlayered items that follow these layered items are added to
synthesized layers.
Another result of this change is that iframe layers can be positioned
directly at the location of the iframe fragment, eliminating the need
for the SubpageLayerInfo struct entirely.
Iframes are the first type of content treated this way, but this change
opens up the possibility to properly order canvas and all other layered
content that does not create a stacking context.
<!-- Reviewable:start -->
[<img src="https://reviewable.io/review_button.png" height=40 alt="Review on Reviewable"/>](https://reviewable.io/reviews/servo/servo/7950)
<!-- Reviewable:end -->
Instead of always promoting iframes to StackingContexts, integrate them
into the display list. This prevents stacking bugs when
non-stacking-context elements should be drawn on top of iframes.
To accomplish this, we add another step to ordering layer creation,
where LayeredItems in the DisplayList are added to layers described by
the LayerInfo structures collected at the end of the DisplayList.
Unlayered items that follow these layered items are added to
synthesized layers.
Another result of this change is that iframe layers can be positioned
directly at the location of the iframe fragment, eliminating the need
for the SubpageLayerInfo struct entirely.
Iframes are the first type of content treated this way, but this change
opens up the possibility to properly order canvas and all other layered
content that does not create a stacking context.
Fixes#7566.
Fixes#7796.
When a stacking-context is not positioned, its z-index should be
ignored. This is per CSS 2 9.9.1. The only exception to this is when
the z-index is applied to an element with display: flex | inline-flex.
inline-flex does not appear to be implemented at this time so we only
do this for flex.
This makes use of the new functionality that allows iframes to generate their own pipeline IDs in order to remove any knowledge of subpage ids from the compositor.
(This is the first of several commits removing subpage from parts of servo).
Simplify stacking context creation
Have Fragment::create_stacking_context understand which stacking
contexts need layers and which do not. This simplifies the way it is
called and eliminates a bunch of code.
<!-- Reviewable:start -->
[<img src="https://reviewable.io/review_button.png" height=40 alt="Review on Reviewable"/>](https://reviewable.io/reviews/servo/servo/7804)
<!-- Reviewable:end -->
Have Fragment::create_stacking_context understand which stacking
contexts need layers and which do not. This simplifies the way it is
called and eliminates a bunch of code.
each iframe.
The old code that attempted to do this during layout wasn't able to work
for multiple reasons: it couldn't know where the iframe was going to be
on the page (because of nested iframes), and at the time it was building
the display list for a fragment it couldn't know where that fragment was
going to be in page coordinates.
This patch rewrites that code so that both the sizes and positions of
iframes are determined by the compositor. Layout layerizes all iframes
and marks the iframe layers with the appropriate pipeline and subpage
IDs so that the compositor can place them correctly. This approach is
similar in spirit to Gecko's `RefLayer` infrastructure. The logic that
determines when it is time to take the screenshot for reftests has been
significantly revamped to deal with this change in delegation of
responsibility.
Additionally, this code removes the infrastructure that sends layout
data back to the layout task to be destroyed, since it is now all
thread-safe and can be destroyed on the script task.
The failing tests now fail because of a pre-existing bug related to
intrinsic heights and borders on inline replaced elements. They happened
to pass before because we never rendered the iframes at all, which meant
they never had a chance to draw the red border the tests expect to not
render!
Closes#7377.
layout: Lay absolutely-positioned blocks with inline containing blocks out of flow.
Removes the long space before the site-specific drop-down in the Google SERPs.
r? @glennw
<!-- Reviewable:start -->
[<img src="https://reviewable.io/review_button.png" height=40 alt="Review on Reviewable"/>](https://reviewable.io/reviews/servo/servo/7534)
<!-- Reviewable:end -->
margins.
* The code that attempted to strip out borders that span multiple
fragments in the same element could go wrong if fragments were
stripped out due to text clumping or whitespace stripping. This patch
rewrites that code to maintain flags in the inline fragment context
specifying whether the node is the beginning or end of the element.
Not only is this easier to maintain, it's closer in spirit to what roc
originally suggested two years ago: it's isomorphic to "begin element,
end element" markers for inline layout.
* Padding and margins for spans containing inline-blocks are now
properly handled via a division of labor between the `InlineBlock`
fragment and the `BlockFlow` that represents the inline-block.
* Unscanned text fragments may not be joined together into a text run if
borders, padding, or margins separate them.
Because Servo now matches the rendering of Gecko and WebKit on the
`input_button_margins_a` reftest, I had to modify it to add some
vertical alignment.
The combined effect of all of these fixes places "Advertising" on the
right place on google.com.
layout: Make overflow calculation take relative percentages into account.
This necessitated changing overflow to be calculated by the parent flow
if relatively positioned children are present. That is because the
overflow regions cannot be calculated without knowing relative offsets,
which themselves cannot be calculated without knowing the parent size
(because of percentages). To accomplish this without sacrificing
parallelism in the non-relative case, this patch splits overflow into
"early" and "late" computation. Late overflow computation cannot be
parallelized across children, while early overflow computation can.
Makes the "Apple Music" text show up over the full-bleed promotional
background on apple.com.
r? @SimonSapin -- would appreciate a look over the iframe test case that was changed.
<!-- Reviewable:start -->
[<img src="https://reviewable.io/review_button.png" height=40 alt="Review on Reviewable"/>](https://reviewable.io/reviews/servo/servo/7313)
<!-- Reviewable:end -->
account.
This necessitated changing overflow to be calculated by the parent flow
if relatively positioned children are present. That is because the
overflow regions cannot be calculated without knowing relative offsets,
which themselves cannot be calculated without knowing the parent size
(because of percentages). To accomplish this without sacrificing
parallelism in the non-relative case, this patch splits overflow into
"early" and "late" computation. Late overflow computation cannot be
parallelized across children, while early overflow computation can.
Makes the "Apple Music" text show up over the full-bleed promotional
background on apple.com.
layout: Centralize the logic that determines whether fragments get layers in the fragment.
…so that it can be activated when we're forcing
the creation of extra layers due to positioned descendants that
themselves have layers.
The newly failing tests were tests that accidentally passed due to
incorrect stacking order.
Closes#7281.
r? @mbrubeck
<!-- Reviewable:start -->
[<img src="https://reviewable.io/review_button.png" height=40 alt="Review on Reviewable"/>](https://reviewable.io/reviews/servo/servo/7291)
<!-- Reviewable:end -->
layers in the fragment, so that it can be activated when we're forcing
the creation of extra layers due to positioned descendants that
themselves have layers.
The newly failing tests were tests that accidentally passed due to
incorrect stacking order.
Closes#7281.
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.)
r? @mbrubeck
<!-- Reviewable:start -->
[<img src="https://reviewable.io/review_button.png" height=40 alt="Review on Reviewable"/>](https://reviewable.io/reviews/servo/servo/7177)
<!-- Reviewable:end -->
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.)