Commit graph

3206 commits

Author SHA1 Message Date
Martin Robinson
69ff4afa58
Rename script_layout_interface to layout_api (#37591)
Now that we are standardizing on the `_traits` crates becoming `_api`
and exposing the API of the crate that they get their name from [^1],
`script_layout_interface` becomes `layout_api` as it exposes the API for
`layout` that is used by `script` This brings the crate in line with the
naming of the other ones in `shared`.

[^1]:
https://servo.zulipchat.com/#narrow/channel/263398-general/topic/Organizing.20*_traits.20crates/with/396893711

Testing: This should not change any behavior and thus is covered by
existing tests.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
2025-06-20 17:13:05 +00:00
Martin Robinson
3774ef00d4
script: Get scroll offsets from layout (#37509)
No longer store scroll offsets for elements in the DOM. Instead
consistently get and set these in layout's `ScrollTree`. This more
consistently requires layout to run when querying scroll offsets, which
ensures that they are up-to-date and properly bounded by scrollable
overflow area.

Testing: This causes several WPT tests to start passing, and one to
start
failing. In the case of
`/shadow-dom/scroll-to-the-fragment-in-shadow-tree.html`, I believe the
issue
is that we don't properly handle scrolling and shadow DOM elements.
Before, the
faulty scrolling was hiding this issue.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
2025-06-20 09:39:12 +00:00
Steven Novaryo
b622157c10
Layout: Add Debug Print for The Scroll Tree (#37522)
Add debug option `dump-scroll-tree` to print the scroll tree that had
been stored after each reflow, or log that the scoll tree is not
initialized yet..

To reduce the coupling, the debug print operation will process the
scroll tree node list that have been constructed in the stacking context
tree. It will generate a adjacency list and do preorder traversal. The
order of the tree then will depends on the order of the node in the node
list that has been constructed. Which, in turn, correspond to the
declaration order of the nodes.

This would help with the analysis and development of post composite
queries and its caching.

cc: @xiaochengh

Signed-off-by: stevennovaryo <steven.novaryo@gmail.com>
2025-06-20 07:16:30 +00:00
Oriol Brufau
b394727ff6
Upgrade Stylo to 2025-06-03 (#37444)
This continues #36835

Changelog:
- Upstream:
ca369cbc83...7e2201c32c
- Servo fixups:
f387e6396c...2e1f66b068

Stylo tracking issue: https://github.com/servo/stylo/issues/200

---------

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
2025-06-19 12:30:32 +00:00
Bhuwan Pandit
04bcafa140
chore: Simplify tracing with servo_tracing macro (#36661) (#37497)
This pull request refactors existing tracing annotations to leverage the
new `servo_tracing::instrument` macro introduced in #36573.

Specifically, the following transformations were applied:
- Removed `#[cfg_attr(feature = "tracing", ...)]` wrappers.
- Replaced `tracing::instrument` with `servo_tracing::instrument`.
- Removed `level = "trace"`
- Removed `fields(servo_profiling = true)` from tracing attributes
however retained others like `name`. `skip type`

Closes: #36661

---------

Signed-off-by: Bhuwan Pandit <bhuwanpandit109@gmail.com>
Signed-off-by: Jonathan Schwender <55576758+jschwe@users.noreply.github.com>
Co-authored-by: Jonathan Schwender <55576758+jschwe@users.noreply.github.com>
2025-06-18 16:18:04 +00:00
Martin Robinson
bdf8c0ebc8
layout: Do not add empty border images to the display list (#37534)
Zero-sized gradient border images cause WebRender to panic, so simply
don't add them to the display list.

Testing: This change adds a WPT crash test.
Fixes: #37432

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
2025-06-18 15:53:29 +00:00
Simon Wülker
f29eee5356
Make layout build a display list when the highlighted DOM node changed (#37501)
Highlights from the devtools trigger reflows. Previously, incremental
layout would notice that nothing about the box tree changed and skip
generating a new display list. This caused the highlights to never be
painted.

Forcing a new DL in this case makes reflows that happen *while* there is
a highlighted DOM node (which did not change since the last reflow)
slightly less efficient. We could check if the highlighted node changed
and only force a new display list if it did, but I'm not sure if
`OpaqueNode`s can be compared like that. It also seems like a very niche
issue.

Testing: This is hard to test for, so there are no tests.
Fixes https://github.com/servo/servo/issues/37500.

Signed-off-by: Simon Wülker <simon.wuelker@arcor.de>
2025-06-17 11:14:41 +00:00
Euclid Ye
f60e9cdff5
layout: capitalize string for TextTransformCase::Capitalize in fn rendered_text_collection_steps (#37486)
Previously, `rendered_text_collection_steps` ignores
`TextTransformCase::Capitalize` due to limitation of iterator. Now we
handle the case outside.

Testing: Added a new test as not covered by existing wpt-test, except
for the indirectly related WebDriver test.
`./mach test-wpt -r
tests\wpt\tests\webdriver\tests\classic\get_element_text\get.py
--product servodriver`

Fixes: #37469

---------

Signed-off-by: Euclid Ye <yezhizhenjiakang@gmail.com>
2025-06-16 14:12:07 +00:00
Martin Robinson
0f61361e27
layout: Unify scrollable overflow calculation and include position: absolute (#37475)
Previously, layout was handling scrollable overflow and srolling area
calculation separately, only excluding the "unreachable scrollable
overflow region" at the last step. In addition, `position: absolute` was
not included in scrollable overflow calculation.

This change combines the two concepts into a single scrollable overflow
calculation and starts taking into account `position: absolute`.
Finally, `BoxFragment::scrollable_overflow_for_parent` is converted to
use early returns which reduces the amount of indentation.

Fixes #35928.
Fixes #37204.
Testing: This causes some WPT test to pass, but also two to start
failing:
- `/css/css-masking/clip-path/clip-path-fixed-scroll.html`: This seems
to fail
because script is scrolling past the boundaries of the document. This is
a
failure that was uncovered by the fixed element now being added to the
   page's scroll area.
- `/css/css-overflow/overflow-outside-padding.html`: One test has
started to fail
here because now the absolutely positioned element is included in the
scroll area,
and I think there is an issue with how we are placing RTL items with
negative margins.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
2025-06-16 11:30:31 +00:00
Oriol Brufau
ae20cdbdc9
layout: Ensure that min/max-content sizes ignore sizing properties (#37464)
This amends #37457 so that the min-content and max-content inline sizes
of a replaced element stop depending on the value of the inline sizing
properties.

In practice I don't think this has any observable effect, but now the
code obeys https://drafts.csswg.org/css-sizing-3/#intrinsic-sizes, and
it's simpler.

Testing: Unneeded

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
2025-06-15 16:11:18 +00:00
Oriol Brufau
f963f2731d
layout: Properly handle intrinsic min/max block sizes on replaced element (#37457)
This change aligns Servo with both Blink and WebKit in common cases.

When the `aspect-ratio` property is set to a different value than the
natural ratio, then Blink and WebKit disagree, we match Blink.

Gecko doesn't support intrinsic min/max block sizes at all.

Note this patch doesn't fix the intrinsic contributions, they will need
to be addressed in a follow-up patch.

Testing: Covered by WPT
Fixes: #37433

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
2025-06-14 09:24:10 +00:00
Martin Robinson
f451dccd0b
layout: Store scroll offsets in the ScrollTree (#37428)
There are currently five places that scroll offsets are stored:

 - DOM: A set of scroll offsets used for script.
 - Layout: An array of scroll offsets that is used for tracking
   layout-side scroll offsets.
 - Layout: The scroll offsets stored in the `ScrollTree`. These are
   currently unset and unused.
 - Compositor: The scroll offsets stored in the `ScrollTree` mirrored
   from layout.
 - WebRender: The scrolled offsets stored in the WebRender spatial tree.

This change is the first step in combining the first three into the
layout `ScrollTree`. It eliminates the extra array of scroll offsets
stored in layout in favor of the storing them in the `ScrollTree`. A
followup change will eliminate the ones stored in the DOM.

- In addition the `ScrollState` data structure is eliminated as these
are
now stored in a `HashMap` everywhere when passing them via IPC.
- The offsests stored in layout can now never scroll past the boundaries
of the scrolled content.

Testing: This should not change behavior and is thus covered by existing
WPT tests.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: stevennovaryo <steven.novaryo@gmail.com>
2025-06-13 12:01:27 +00:00
JoeDow
5159529888
Layout: refactor the box tree update logic for better readability (#37390)
Refactor the box tree update logic to improve readability and facilitate
the addition of incremental update logic in the following PRs.

Testing: No logic changed, just covered by existing WPT tests
Fixes: Nothing to fix

Signed-off-by: sharpshooter_pt <ibluegalaxy_taoj@163.com>
2025-06-13 08:42:59 +00:00
Oriol Brufau
1bbdcb1911
layout: Avoid useless LazyCell when resolving replaced element's size (#37419)
The callback can be used instead, since `Size::resolve()` already takes
care of creating a `LazyCell`.

Testing: Unnecessary, no behavior change

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
2025-06-13 08:29:37 +00:00
Martin Robinson
23acb623c8
script: Allow reflows that do not produce display lists (#37186)
This change has two parts which depend on each other:

1. An early exit in the layout process, which allows for skipping
   display list construction entirely when nothing would change.
2. A simplification and unification of the way that "fake" animation
   frames are triggered. Now this happens on an entire ScriptThread at
   once and is based on whether or not any Pipeline triggered a display
   list update.

   Animations are never canceled in the compositor when the Pipeline
   isn't updating, instead the fake animation frame is triggered far
   enough in the future that an unexpected compositor tick will cancel
   it. This could happen, for instance, if some other Pipeline in some
   other ScriptThread produced a new display list for a tick. This makes
   everything simpler about these ticks.

The goal is that in a future change the ScriptThread-based animation
ticks will be made more generic so that they can throttle the number of
"update the rendering" calls triggered by script.

This should make Servo do a lot less work when moving the cursor over a
page. Before it would constantly produce new display lists.

Fixes: #17029.
Testing: This should not cause any web observable changes. The fact that
all WPT tests keep passing is the test for this change.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Oriol Brufau <obrufau@igalia.com>
2025-06-12 19:25:04 +00:00
Nico Burns
7427ea4aed
Move to_bidi_level method from Stylo to Servo (#37343)
This method is only used in Servo and is the only reason that `stylo`
depends on `unicode-bidi`.

Stylo PR: https://github.com/servo/stylo/pull/196
2025-06-11 14:44:13 +00:00
Martin Robinson
c36ef34464
layout: Remove two arguments from StackingContextTree::new() (#37396)
This is a minor cleanup that simplifies the construct of
`StackingContextTree`. The two arguments removed are derived from the
`FragmentTree` which is already passed as an argument.

Testing: This should not change behavior and is thus covered by existing
tests.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
2025-06-11 12:42:54 +00:00
Oriol Brufau
5c597f98e0
layout: Floor free space by 0 in solve_inline_margins_avoiding_floats() (#37362)
`PlacementAmongFloats` should guarantee that the inline size of the
placement rect is at least as big as the inline size of the box,
resulting in a non-negative free space.

However, that may fail when dealing with huge sizes that need to be
saturated to MAX_AU, so this floors the free space by zero.

Testing: New crashtest
Fixes: #37312

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
2025-06-10 09:05:09 +00:00
Nico Burns
1b5a10a55f
CSS Grid: percentage sizing fixes (#34948)
This applies some fixes for CSS Grid percentage sizing. These fixes are
mostly within Taffy, but there are some changes in Servo to allow it to
communicate whether an item is replaced to Taffy.

It also updates Taffy to v0.8.0. Taffy has switched to a tagged pointer
representation of length/size styles. Much of the diff here is updating
Servo's type conversion code to use the new representation.

---
<!-- Thank you for contributing to Servo! Please replace each `[ ]` by
`[X]` when the step is complete, and replace `___` with appropriate
data: -->
- [x] `./mach build -d` does not report any errors
- [x] `./mach test-tidy` does not report any errors
- [x] There are tests for these changes OR

---------

Signed-off-by: Nico Burns <nico@nicoburns.com>
2025-06-08 15:17:10 +00:00
Oriol Brufau
8540b0f6e3
layout: Force outside ::marker to establish a BFC (#37252)
Even though we were continuing the parent BFC, we weren't updating the
SequentialLayoutState to have the correct containing block info. That
caused problem in the presence of floats.

This patch establishes an independent BFC, which avoids the problem.
This seems reasonable since outside markers are out-of-flow-ish, and it
matches Firefox. Blink implements them as inline-blocks, so they should
also establish a BFC.

Testing: Adding new tests. Some still fail because of a different issue.
Also, adding an expectation for several existing tests that were missing
it.
Fixes: #37222

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
2025-06-06 16:01:27 +00:00
webbeef
a1f43ab06d
Revert "Implement Input UA Shadow DOM (#37065)" (#37296)
This reverts commit 5580704438.

Let's re-land that fix when a working solution is found. Keeping that
regression makes it hard to evaluate other potential improvements.

Signed-off-by: webbeef <me@webbeef.org>
2025-06-06 15:23:08 +00:00
Oriol Brufau
de2da3b1e1
layout: Split overflow calculation after fragment tree construction (#37203)
Instead of computing scrollable overflow while constructing the fragment
tree, we will now do it later. In the future this will also allow to
only recalculate the overflow without rebuilding the tree when transform
properties change, but that's left for a follow-up.

Stylo PR: https://github.com/servo/stylo/pull/194

Testing: One test is now passing (more investigation is needed), but
otherwise this isn't expected to have any effect.

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
Co-authored-by: Martin Robinson <mrobinson@igalia.com>
2025-05-30 19:41:05 +00:00
Steven Novaryo
5580704438
Implement Input type=text UA Shadow DOM (#37065)
Implement Shadow Tree construction for input `type=text`, adding a text
control inner editor container and placeholder container. Subsequently,
due to the changes of the DOM tree structure, the changes will add a new
NodeFlag `IS_TEXT_CONTROL_INNER_EDITOR` to handle the following cases.
- If a mouse click button event hits a text control inner editor, it
will redirect the focus target to its shadow host.
- In text run's construction, the text control inner editor container
queries the selection from its shadow host. This is later used to
resolve caret and selection painting in the display list.

This will be the first step of fixing input `type=text` and other
single-line text input element widgets. Such as, implementing
`::placeholder` selector.



Testing: Existing WPT test and new Servo specific appearance WPT.
Fixes: #36307

---------

Signed-off-by: stevennovaryo <steven.novaryo@gmail.com>
2025-05-30 12:02:10 +00:00
Fuguo
1f315e6c9c
Add a user agent style for the <slot> element (#37174)
In Chromium, the slot user agent stylesheet is located in
[html.css](https://source.chromium.org/chromium/chromium/src/+/main:third_party/blink/renderer/core/html/resources/html.css;l=1654).

Testing: This change fixes
`tests/wpt/meta/shadow-dom/directionality-001.tentative.html.ini`.

Signed-off-by: kongbai1996 <1782765876@qq.com>
2025-05-29 08:20:01 +00:00
Oriol Brufau
ac06b1cfcf
layout: Fix logic for transforms with non-invertible matrix (#37147)
When the the current transformation matrix of a box isn't invertible,
the box and its content shouldn't be displayed.

However, the logic was broken:
- It was only checking the `transform` property, but not individual
transform properties like `scale`.
- It was treating matrices with m₁₁=0 or m₂₂=0 and non-invertible, even
when they can still be invertible and have a visible outcome.
- When m₁₁=0 or m₂₂=0 weren't caused by `transform`, it was replacing
the matrix with the identity.

Testing: Adding new WPT
Fixes: #37146

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
2025-05-27 18:36:33 +00:00
Mukilan Thiyagarajan
8a20e42de4
Add support for static SVG images using resvg crate (#36721)
This change adds support for rendering static SVG images using the
`resvg` crate, allowing svg sources in the `img` tag and in CSS
`background` and `content` properties. There are some limitations in
using resvg:

1. There is no support for animations or interactivity as these would
require implementing the full DOM layer of SVG specification.
2. Only system fonts can be used for text rendering. There is some
mechanism to provide a custom font resolver to usvg, but that is not
explored in this change.
3. resvg's handling of certain edge cases involving lack of explicit
`width` and `height` on the root svg element deviates from what the
specification expects from browsers. For example, resvg uses the values
in `viewBox` to derive the missing width or height dimension, but
without scaling that dimension to preserve the aspect ratio. It also
doesn't allow overriding this behavior.

Demo screenshot:
![servo - resvg
img](https://github.com/user-attachments/assets/8ecb2de2-ab7c-48e2-9f08-2d09d2cb8791)

<details>
<summary>Source</summary>

```
<style>
 #svg1 {
   border: 1px solid red;
 }

 #svg2 {
   border: 1px solid red;
   width: 300px;
 }
 #svg3 {
   border: 1px solid red;
   width: 300px;
   height: 200px;
   object-fit: contain;
 }
 #svg4 {
   border: 1px solid red;
   width: 300px;
   height: 200px;
   object-fit: cover;
 }
 #svg5 {
   border: 1px solid red;
   width: 300px;
   height: 200px;
   object-fit: fill;
 }
 #svg6 {
   border: 1px solid red;
   width: 300px;
   height: 200px;
   object-fit: none;
 }
</style>
</head>
<body>
        <div>
          <img id="svg1" src="https://raw.githubusercontent.com/servo/servo/refs/heads/main/resources/servo.svg" alt="Servo logo">
        </div>
        <div>
          <img id="svg2" src="https://raw.githubusercontent.com/servo/servo/refs/heads/main/resources/servo.svg" alt="Servo logo">
          <img id="svg3" src="https://raw.githubusercontent.com/servo/servo/refs/heads/main/resources/servo.svg" alt="Servo logo">
          <img id="svg4" src="https://raw.githubusercontent.com/servo/servo/refs/heads/main/resources/servo.svg" alt="Servo logo">
        </div>
        <div>
          <img id="svg5" src="https://raw.githubusercontent.com/servo/servo/refs/heads/main/resources/servo.svg" alt="Servo logo">
          <img id="svg6" src="https://raw.githubusercontent.com/servo/servo/refs/heads/main/resources/servo.svg" alt="Servo logo">
        </div>
</body>
```

</details>

---------

Signed-off-by: Mukilan Thiyagarajan <mukilan@igalia.com>
Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Martin Robinson <mrobinson@igalia.com>
2025-05-27 11:02:40 +00:00
Martin Robinson
d3e57a513c
constellation: Pass system theme to new Pipelines (#37132)
Previously, when the theme was set it was only set on currently active
`Window`s. This change makes setting the `Theme` stateful. Now the
`Constellation` tracks what theme is applied to a `WebView` and properly
passes that value to new `Pipeline`s when they are constructed. In
addition, the value is passed to layout when that is constructed as
well.

Testing: this change adds a unit test.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
2025-05-26 12:05:38 +00:00
Martin Robinson
57b99d641e
layout: Use the viewport size as the background-attachment: fixed positioning area (#37097)
This fixes the combination of `background-attachment: fixed` and
`no-repeat`. The positioning of the background should be relative to the
viewport, so using an infinite rectangle breaks things like `center`.

I'm not sure what the original motivation of using an infinite rectangle
here
and it doesn't seem to break any tests to stop using it.

Testing: This fixes `/css/CSS2/backgrounds/background-bg-pos-206.xht`.
Fixes #37082.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
2025-05-24 09:45:53 +00:00
Oriol Brufau
d18000fee8
Add another incremental layout that starts at stacking tree construction (#37088)
This allows to skip rebuilding the box tree when it's only necessary to
rebuild the stacking context tree.
Bumps Stylo to https://github.com/servo/stylo/pull/187

Testing: Unneeded (no behavior change). Just improving performance.
However, this adds a new test for dynamic changes of `z-index`, which we
were breaking in an earlier iteration of this patch.

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
Co-authored-by: Martin Robinson <mrobinson@igalia.com>
2025-05-23 23:40:02 +00:00
Martin Robinson
9c0c1cf30f
layout: Regardless of restyle damage, always reflow when viewport changes (#37099)
This fixes an issue where a viewport change did not trigger a reflow,
when the restyle damage was was otherwise REPAINT. Viewport changes
mean changes to the initial containing block, which is one of the main
inputs to layout. This should trigger a reflow always.

Testing: Unfortunately, our testing infrastructure is not good enough
yet
to test changes to layout when resizing the `WebView`, so it is quite
difficult to write tests for this change.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
2025-05-23 13:42:45 +00:00
Narfinger
8788248fec
Removing unused dependencies in crates. (#37096)
Removed unused dependencies in various crates using cargo-machete, grep
and cargo-udeps.

Testing: The CI tests if any dependencies were used that are removed.

Signed-off-by: Narfinger <Narfinger@users.noreply.github.com>
2025-05-23 12:58:00 +00:00
TIN TUN AUNG
23ce7b31ac
Animation: update image active frame when update the rendering (#36286)
When no CSS animation exist, register timer for image animation, update
animated image active image frame as part of update_the_rendering, mark
node as dirty if the corresponding image need update. Added unit test to
test ImageAnimationState.

Part of https://github.com/servo/servo/issues/36057, the last step to
let the Animated Image "Move".

Testing: Introduced new WPT RefTest for animated image, but fail because
of https://github.com/servo/servo/issues/36931. New unit test for
`ImageAnimationState`.
Fixes: https://github.com/servo/servo/issues/22903
https://github.com/servo/servo/issues/36057

[Try](https://github.com/rayguo17/servo/actions/runs/14724729664)

---------

Signed-off-by: rayguo17 <rayguo17@gmail.com>
2025-05-23 03:13:35 +00:00
Martin Robinson
7f0cebd442
layout: Support wavy and double for text-decoration-line (#37079)
- Add support for `text-decoration-line: double`: Line drawing is done
similar to how it works in Firefox and Chromium. A gap of half of line
thickness is added between each line.
- Fix support for `text-decoration-line: wavy`: Wavy lines rectangles
were not calcualted properly, which meant they were rendered as solid
lines. Now the amplitude of the wave is 1.5 times line thickness.

Testing: A manual test is updated `tests/html/text_deco_simple.html`
to cover more cases. In general, rendering of text-decorations is
difficult
to test via reftesting.
Fixes #17887.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
2025-05-22 17:42:50 +00:00
Martin Robinson
9781f1241a
layout: Move text decoration propagation to stacking context tree construction (#37069)
Text decorations have a special kind of propagation. Instead of
propating these during box tree construction, move propagation to
stacking context tree construction. This will allow for using a very
easy type of incremental layout when text decorations change. For
instance, when a link changes color during hovering over it, we can skip
all of box and fragment tree construction.

In addition, propagation works a bit better now and color and style
properly move down from their originating `Fragment`s.

This introduces three new failures, because now we are drawing the
text-decoration with the correct color in more places, which exposes an
issue we have with text-decorations not being drawn in relation to the
baseline (taking into account `vertical-align`).

Testing: There are tests for these changes.
Fixes #31736.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Oriol Brufau <obrufau@igalia.com>
2025-05-21 16:38:29 +00:00
Martin Robinson
856ffa6ecb
layout: When there is no restyle damage, do not re-layout (#37048)
When the computed restyle damage is empty, do not do a layout. Instead,
just rebuild the display list. In the future, even that can be omitted,
but that requires changes to the compositor.

These kind of relayouts commonly happen when the cursor is moving around
the page and no style rules cause changes to :hover.

Testing: This is covered existing WPT tests and should only have
performance
impacts. Unfortunately there are currently no performance tests.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Oriol Brufau <obrufau@igalia.com>
2025-05-21 15:52:11 +00:00
Oriol Brufau
3a527d784b
layout: Fix min-content inline size of multi-line row flex container (#37011)
`min_content_main_size_for_multiline_container` was initialized to an
outer size, but then it could be clamped by inner sizes.

This patch ensures that it's clamped by outer sizes, and refactors
`FlexItemBoxInlineContentSizesInfo`.

Testing: Covered by WPT
Fixes: #37008

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
2025-05-21 06:57:50 +00:00
Martin Robinson
d8294fa423
layout: Split stacking context and display list construction (#37047)
Previously, after a layout was finished (or skipped in the case of
repaint-only layout), both the stacking context tree and display list
were built. In the case of repaint-only layout, we should be able to
skip the reconstruction of the stacking context tree and only do display
list building.

This change does that, also generally cleaning and up and clarifying the
data structure used during this phase of layout. This opens up the
possibility of a new kind of incremental layout that does both repaint
and a rebuild of the stacking context tree.

On the blaster.html test case[^1], this reduces tightly-measured layout
time from ~45-50 milliseconds to ~25-30 milliseconds on my M3.

[^1]: https://gist.github.com/mrobinson/44ec87d028c0198917a7715a06dd98a0

Testing: There are currently no performance tests for layout. :( This
should
not modify the results of WPT tests.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Oriol Brufau <obrufau@igalia.com>
2025-05-20 13:42:39 +00:00
Martin Robinson
573663d502
layout: Correct damage propagation and style repair for repaint-only layout (#37004)
When making last-minute changes to the repaint-only layout pass, damage
propagation was broken, meaning that full layout was always done. This
change fixes that, meaning that times in the `blaster.html` test case
now reflect those described in the original commit message from #36978.

In addition, some style repair is now fixed:
- `InlineFormattingContext`s now keep a `SharedInlineStyles` for the
root of the IFC
    which is updated during style repair.
 - `BlockFormattingContext`s now properly update their style.

These changes are verified by turning on repaint only layout for more
properties
in Stylo via servo/stylo#183.

Testing: Manual performance testing via `blaster.html`.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
2025-05-19 10:17:49 +00:00
Oriol Brufau
78f3f455dc
layout: Fix align-content on stretched row flex containers (#37024)
Fixes a regression from #36973, which didn't take into account that
stretching flex items affects their final block size when the cross axis
is the block axis.

Testing: Adding new test
Fixes: #37023

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
2025-05-16 19:15:16 +00:00
Simon Wülker
b100a98e1d
Fully support <input type=color> (#36992)
This change adds a shadow-tree widget for `<input type=color>` elements.
It also involves some changes to the way layout interacts with the DOM,
because currently all `input` and `textarea` elements are rendered as
plain text and their descendants are ignored. This obviously doesn't
work for `<input type={color, date, range, etc}>`.


![image](https://github.com/user-attachments/assets/4f16c3b0-1f79-4095-b19d-1153f5853dd5)

<details><summary>HTML used for the screenshot above</summary>

```html
<input type=color>
```

</details>



Testing: I doubt that this affects WPT tests, because the appearance and
behaviour of the widget is almost entirely unspecified.

---------

Signed-off-by: Simon Wülker <simon.wuelker@arcor.de>
2025-05-15 17:30:38 +00:00
Oriol Brufau
cd0dbb9afb
layout: Obey intrinsic min/max block sizes on flex containers (#36973)
Intrinsic sizing keywords weren't working correctly on the min and max
block sizes of a flex container, because we weren't setting the
`CacheableLayoutResult::content_block_size` to the right value. This
also ensures that `align-content` aligns within the final size of the
container.

Note it's not very clear what to do for single-line containers, they are
being discussed in https://github.com/w3c/csswg-drafts/issues/12123

Testing: Adding new WPT tests. There are still some failures, but most
subtests would fail without this change.
Fixes: #36981

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
2025-05-15 07:57:07 +00:00
Oriol Brufau
1cceb5f6a0
layout: Inform child layout about final block size (#36980)
Before this patch it wasn't possibly to simultaneously support intrinsic
min/max sizes and content alignment in the block axis. For example,
block containers only support the former, and flex containers only the
latter.

The reason is that the final block size was decided by the parent
formatting context *after* performing layout, while content alignment is
performed *during* layout.

To address the problem, this introduces the struct `LazySize`, which
contains the data to resolve the final size, except for the intrinsic
size. Thus the parent formatting context can first create a `LazySize`,
then pass it to the child layout so that (if necessary) it can compute
the final size once the intrinsic one is known, and after layout the
parent formatting context uses it to actually size the child.

This PR just provides the functionality that will be used by follow-ups,
but at this point no layout is using the `LazySize` provided by the
parent, so there shouldn't be any behavior change yet.

Testing: Unnecessary (no behavior change)
This is part of #36981 and #36982

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
2025-05-14 20:35:49 +00:00
Steven Novaryo
a572bf1191
layout: Propagate specified info for flex item (#36993)
We should propagate specified info for flex items. This will prevent the
loss of it for boxes that have this info (e.g. table or grid).

Testing: Adding new WPT tests

---------

Signed-off-by: stevennovaryo <steven.novaryo@gmail.com>
Signed-off-by: Oriol Brufau <obrufau@igalia.com>
Co-authored-by: Oriol Brufau <obrufau@igalia.com>
2025-05-13 21:10:40 +00:00
Martin Robinson
8808f9a468
layout: Add a repaint-only incremental layout mode (#36978)
This change adds the simplest kind of incremental layout. When Servo
detects that all style changes only require a repaint, only run stacking
context tree and WebRender display list generation. This means that
these kind of restyles do not need a re-layout. Instead, the existing
box and fragment trees will be used and the styles of damaged nodes will
be updated in their box and fragment tree nodes.

This requires a new style repair DOM traversal for nodes that have had
their style damaged. In addition, careful accounting of all the places
where we store style must happen in order ot update those styles.

Testing: This is covered by existing WPT tests as it should not change
observable behavior.

We have created a test case which shows a 50% speedup when run
in Servo, even though there still a long way to go to match the speed
of other browsers:
https://gist.github.com/mrobinson/44ec87d028c0198917a7715a06dd98a0

Co-authored-by: Oriol Brufau <obrufau@igalia.com>
Signed-off-by: Martin Robinson <mrobinson@igalia.com>

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Oriol Brufau <obrufau@igalia.com>
2025-05-12 17:03:50 +00:00
Oriol Brufau
51fa6cdcb6
layout: Split AbsoluteAxisSolver::solve() into different methods (#36970)
Abspos layout used to solve sizing and margins simultaneously. This
patch refactors the logic to solve them separately, resulting in simpler
code.

Testing: Unneeded (no change in behavior)

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
2025-05-12 16:30:53 +00:00
Martin Robinson
a0dd2c1beb
layout: Share styles to inline box children via SharedInlineStyles (#36896)
`TextRun`s use their parent style to render. Previously, these styles
were cloned and stored directly in the box tree `TextRun` and resulting
`TextFragment`s. This presents a problem for incremental layout.
Wrapping the style in another layer of shared ownership and mutability
will allow updating all `TextFragment`s during repaint-only incremental
layout by simply updating the box tree styles of the original text
parents.

This adds a new set of borrows when accessing text styles, but also
makes it so that during box tree block construction
`InlineFormattingContext`s are created lazily and now
`InlineFormattingContextBuilder::finish` consumes the builder, making
the API make a bit more sense. This should also improve performance of
box tree block construction slightly.

Testing: This should not change observable behavior and thus is covered
by existing WPT tests.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Oriol Brufau <obrufau@igalia.com>
2025-05-12 09:38:50 +00:00
Martin Robinson
53be79a5b5
layout: Resolve canvas background properties during painting (#36917)
Instead of resolving the canvas background properties (essentially
keeping a possible reference to the `<body>`'s style) during fragment
tree construction, wait until painting to possibly find the style on an
appropriate `<body>` fragment. This is possible now because `Fragment`
keeps a list of flags with relevant information about the root and
`<body>` elements.

A benefit of this approach is that styles aren't cached in the fragment
tree, which would be problematic for incremental layout. In addition,
the old code was making an effort to transform the `<body>`'s background
by the root element's transform. Only Safari does this and there was
a resolution the WG that this should not happen in
https://github.com/w3c/csswg-drafts/issues/6683.

Testing:
 - `/css/css-transforms/transform-translate-background-001.html`
 - `/css/css-transforms/transform-translate-background-002.html`
 - `/css/CSS2/floats/float-root.html`
 
Fixes: #30475.
Closes: #30569.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Oriol Brufau <obrufau@igalia.com>
2025-05-09 10:36:53 +00:00
Martin Robinson
348eede37b
layout: Store shared styles for table backgrounds in SharedBackgroundStyle (#36893)
Table cells share background styles with their track and track group
boxes. When a track and track group style is repaired, this new data
structure will allow reparing the style of the cell `Fragment`s without
having to lay the table out again or walk through `Fragment`s and
individually repair their background styles.

Testing: This doesn't change behavior and is thus tested by existing
WPT tests.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Oriol Brufau <obrufau@igalia.com>
2025-05-07 11:44:59 +00:00
Josh Matthews
ba8f923201
Various memory measurement improvements (#36834)
The two significant changes here are 1) a commit that frees memory used
to perform memory reporting once the reporting is complete, 2) memory
reporting for the system font service. There are various other commits
that remove `#[ignore_malloc_size_of]` attributes for data that we are
now able to measure, but they do not significantly change our
measurements when testing servo.org.

Testing: Comparing the output of about:memory on servo.org.

---------

Signed-off-by: Josh Matthews <josh@joshmatthews.net>
2025-05-07 04:00:12 +00:00
Martin Robinson
d5e008fd6a
layout: Use ServoLayoutNode directly instead of a generic impl (#36876)
This makes it so that layout is no longer generic on the node type,
depending directly on `script`'s `ServoLayoutNode`. In addition to
greatly simplifying layout, this is necessary because incremental layout
needs to be able to create pseudo-element styles without having a handle
on the original `impl LayoutNode`. We feel this is a reasonable
tradeoff.

Testing: No functional changes, so covered by existing WPT tests.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Oriol Brufau <obrufau@igalia.com>
2025-05-06 14:27:51 +00:00