Commit Graph

639 Commits

Author SHA1 Message Date
Tim Ledbetter
7dade36d96 LibWeb: Ensure SVG image element respects viewBox
Previously, any active viewBox was ignored by SVG image elements.
2025-09-01 13:28:35 +01:00
Callum Law
6fcaceedd9 LibWeb: Clamp negative computed values for padding-* properties
Interpolation can leave `padding-*` values as negative - this should be
handled by interpolation clamping it to the allowed range of values
but we don't yet do that. As a stop gap we can clamp this before setting
it in ComputedValues.

This fixes 3 crashes and gains us 11 passes in the imported WPT tests
2025-09-01 12:28:53 +01:00
Jelle Raaijmakers
a0b7d0542c LibWeb: Misc. code cleanup of LayoutState
No functional changes.
2025-09-01 11:20:43 +01:00
Jelle Raaijmakers
64093f7d26 LibWeb: Detach paint tree from layout tree in one go
We used to only walk the paintable root tree from the layout root and
detach paintables from there. In some cases, this could leave paintables
behind, so we added another loop that iterates over all layout nodes and
detaches their paintables, if any remained.

Instead of traversing two trees like this, just traverse the layout tree
once and detach the inclusive descendant's paintables, similar to how we
deal with the DOM tree immediately after that.
2025-09-01 11:20:43 +01:00
Jelle Raaijmakers
f122e1f78a LibWeb: Let PaintableBox be const for longer in LayoutState
Makes it clearer where we're modifying it. No functional changes.
2025-09-01 11:20:43 +01:00
Aliaksandr Kalenik
0ef61ad813 LibWeb: Skip flexible tracks expansion if there's no any of them [GFC]
We could skip calculating fr unit size if we know there's no flexible
tracks.
2025-08-31 19:13:14 +02:00
Aliaksandr Kalenik
7b1a97c109 LibWeb: Skip calculating item's min-content size if possible [GFC]
We could skip doing item's intrinsic min-content layout if we know for
sure that there's no tracks with intrinsic sizing function to distribute
the min-content size to.
2025-08-31 19:13:14 +02:00
Aliaksandr Kalenik
87c7fb1d63 LibWeb: Use 0 as min-content size for items with overflow:hidden [GFC]
This behavior is not specified but required to match other browsers.

Fixes https://github.com/LadybirdBrowser/ladybird/issues/5907
2025-08-30 15:57:45 +02:00
Erik Kurzinger
42339be999 LibWeb: Use intrinsic size for current_image_bitmap
Currently, ImageProvider::current_image_bitmap takes a Gfx::IntSize
argument which determines the size of the returned bitmap. The default
value of this argument is 0x0 which causes the function to return
nullptr. This behavior is evidently unintuitive enough that it has lead
to incorrect usage in multiple places. For example, the 2D canvas
drawImage method will never actually draw anything because it calls
current_image_bitmap with no arguments. And the naturalWidth and
naturalHeight of an image will always return 0 (even after the image has
loaded) for the same reason.

To correct this and hopefully avoid similar issues in the future,
ImageProvider::current_image_bitmap will be renamed to
current_image_bitmap_sized, and the default value for the size argument
will be removed. For consistency, a similar change will be made to
SVGImageElement::default_image_bitmap.

The existing current_image_bitmap function will no longer take a size
argument. Instead it will always return a bitmap of the image's
intrinsic size. This seems to be what most existing callers had already
assumed was the function's behavior.
2025-08-30 15:49:11 +02:00
Luke Wilde
b17783bb10 Everywhere: Change west consts caught by clang-format-21 to east consts 2025-08-29 18:18:55 +01:00
Tim Ledbetter
5eff541804 LibWeb: Construct filter chain at paint time
This allows us to use style and box metrics when applying filters.
2025-08-29 10:15:24 +01:00
Jelle Raaijmakers
d87b3030a7 LibWeb: Prevent creation of new UsedValues for nested inline nodes
In LayoutState, used_values_per_layout_node should not be modified in
order to determine inline nodes' dimensions - all the required values
should already be in there. In 2585f2da0d
we did accidentally create new values, causing the code further down to
try and get a PaintableBox from an anonymous container and crashing.

Fixes #6015.
2025-08-28 22:38:15 +02:00
Tim Ledbetter
ea41aba6c7 LibWeb: Move common SVGViewport code into an SVGFitToViewBox class
Special handling for SVGClipPathElement and SVGMaskElement, which use a
a ViewBox and PreserveAspectRatio value internally, has been moved to
`SVGFormattingContext`.
2025-08-28 15:42:56 +02:00
Jelle Raaijmakers
c8d24d4966 LibWeb: Correctly position absolute inline boxes in last line
If we were calculating the static position for an absolutely positioned
inline box that resides in the last line of its containing block, we
would not have yet provided the fragments in that line with their
final positions. Additionally, we would always move the box beneath the
fragment, which was incorrect.

Fixes #5867.
2025-08-28 13:45:37 +02:00
Jelle Raaijmakers
349fdd9f47 LibWeb: Explicitly update LineBuilder's last line at end of IFC run
Currently we're relying on LineBuilder's destructor to handle updating
the last line, if required. In order to fix an issue with our absolute
positioning code, we need to be able to update the last line earlier
than that. Remove the destructor and replace it with an explicit call to
LineBuilder::update_last_line().

No functional changes.
2025-08-28 13:45:37 +02:00
Jelle Raaijmakers
90bc805cb0 LibWeb: Simplify UsedValues::static_position()
No functional changes.
2025-08-28 13:45:37 +02:00
Tim Ledbetter
a87a9156d5 LibWeb/CSS: Parse the paint-order property 2025-08-28 10:31:09 +01:00
Callum Law
1052ee20b0 LibWeb: Move snap_a_length_as_a_border_width to StyleComputer.cpp
All users are in this file so it makes more sense to have it here
2025-08-28 09:29:46 +01:00
Callum Law
0ce6cc38b7 LibWeb: Store outline-width in computed form in ComputedProperties
We now also store `outline-width` in ComputedValues as a `CSSPixels`
since we know it's an absolute length at `apply_style` time - this saves
us some work in converting to CSSPixels during layout.

Gains us 46 new passes since we now interpolate keywords (thick, thin,
etc) correctly.

Also loses us 4 WPT tests as we longer clamp negative values produced by
interpolation from the point of view of getComputedStyle (although the
'used' value is still clamped).
2025-08-28 09:29:46 +01:00
Callum Law
6eae92511f LibWeb: Store border-*-width in computed form in ComputedProperties
Gains us 112 new passes since we now interpolate keywords (thick, thin,
etc) correctly.

Also loses us 4 WPT tests as we longer clamp negative values produced by
interpolation from the point of view of getComputedStyle (although the
'used' value is still clamped).
2025-08-28 09:29:46 +01:00
Jelle Raaijmakers
2585f2da0d LibWeb: Apply nested inline margin box sizes to inline layout nodes
When committing the layout state, we now take nested inlines' margin,
border and padding sizes into account.

Fixes #3491.
2025-08-28 00:05:28 +02:00
Jelle Raaijmakers
22ccae7e68 LibWeb: Make node argument to UsedValues::set_node() const
No functional changes.
2025-08-28 00:05:28 +02:00
Tim Ledbetter
cb1a1a5cb5 LibWeb: Replace is<T>() with as_if<T>() where possible 2025-08-25 18:45:00 +02:00
Andreas Kling
3d97251da3 LibWeb: Wrap out-of-flow table children in anonymous table cells
This fixes an issue where floating children of a table box would not get
laid out at all if they were surrounded by nothing but whitespace.
2025-08-25 14:55:19 +02:00
norbiros
92b560edce LibWeb/CSS: Fix basic absolute positioning inside grid containers
Now elements with position `absolute` properly resolve their position
inside parent elements with `grid`. I also imported some WPT tests
related to that topic.

Part 2 of resolving issues on https://hack4krak.pl
2025-08-25 14:09:12 +02:00
Andreas Kling
0d2800e411 LibWeb: Don't relocate fragments across atomic inline boundary
All fragments inside an atomic inline box should stay within that box,
otherwise we'll screw up the paint order and paint them behind things
that they're supposed to be on top of.

This fixes an issue with inline-block content not appearing on sites
like Google Docs and Reddit, among others.
2025-08-24 21:00:08 +02:00
ayeteadoe
3df8e00d91 LibWeb: Enable EXPLICIT_SYMBOL_EXPORT 2025-08-23 16:04:36 -06:00
Aliaksandr Kalenik
025011d8e0 LibWeb: Fix algorithm that distributes space beyond limits [GFC]
Fixes bug when we didn't use `tracks_to_grow_beyond_limits` and instead
distributed extra space to all affected tracks. Also implements missing
"when accommodating max-content" part.
2025-08-23 23:16:18 +02:00
Tim Ledbetter
aadd563592 LibWeb: Replace usages of dynamic_cast with as and as_if 2025-08-22 20:26:09 +02:00
Timothy Flynn
047f521c4c LibGfx+LibWeb: Add some extra fields to glyph run data
We currently have a mixup in LibWeb between code unit offset and glyph
offset during hit testing. These extra fields will allow us to correct
this discrepency.
2025-08-22 14:06:46 +02:00
Jelle Raaijmakers
a83815360c LibWeb: Use unchecked appends and simplify code in GFC track handling
No functional changes.
2025-08-19 21:53:46 +02:00
Jelle Raaijmakers
9e29d0c040 LibWeb: Make button layout wrappers inherit styles correctly
There are some nuances to creating these wrappers, such as manually
propagating certain text styles that are not inherited by default. We
already have the logic for this in
`NodeWithStyle::create_anonymous_wrapper()`, so reuse that method in our
implementation of the button layout.

Fixes applying certain text styles (such as `text-decoration`) to the
text of a `<button>`.
2025-08-19 11:12:23 +02:00
Tim Ledbetter
1d745884be LibWeb: Parse the shape-rendering property 2025-08-19 09:47:28 +01:00
Aliaksandr Kalenik
d94b33e205 LibWeb: Handle correctly case when abspos and relpos GFC is interleaved
...by another GFC. When searching for grid item that contains an
abspos box positioned relative to GFC, it's incorrect to assume that the
closest ancestor box whose parent establishes GFC is always the one we
are looking for, because there may be non-positioned GFC in between.

Fixes regression introduced in 80c8e78.
2025-08-19 09:28:45 +02:00
Tim Ledbetter
b81d3e813c LibWeb: Eagerly create stacking context if will-change set for property
If `will-change` is set to a property value where that property could
create a stacking context, then we create a stacking context regardless
of the current value of that property.
2025-08-18 12:36:37 +01:00
Tim Ledbetter
4f663ca6e7 LibWeb: Parse the will-change property
This property provides a hint to the rendering engine about properties
that are likely to change in the near future, allowing for early
optimizations to be applied.
2025-08-18 12:36:37 +01:00
Timothy Flynn
0e4fb9ae73 LibWeb: Ensure up/down arrow navigation is grapheme-aware
Previously, it was possible for an up/down arrow press to place the
cursor in the middle of a multi-code point grapheme cluster. We want to
prevent this in a way that matches the behavior of other browsers.

Both Chrome and Firefox will map the starting position to a visually
equivalent position in the target line with harfbuzz and ICU segmenters.
The need for this is explained in a code comment. The result is a much
more natural feeling of text navigation.
2025-08-18 13:17:28 +02:00
Jelle Raaijmakers
087601832a LibWeb: Set fit-content width for buttons in used values, not computed
For button layouts, we were overriding the computed `width` value with
`fit-content` in `TreeBuilder::wrap_in_button_layout_if_needed()`. But
the spec asks us to set the _used value_ instead, so we now actually
calculate the fit-content width and set the box' content width to it.

Fixes #2516.
2025-08-18 11:04:34 +01:00
Jelle Raaijmakers
ff5f80a196 LibWeb: Add HTMLElement::uses_button_layout()
This suits the spec a bit better, and exposes the fact that we were
allowing `::ImageButton` to use the button layout although it is never
specified that it should do so. Tests were rebaselined for this.
2025-08-18 11:04:34 +01:00
Callum Law
027c9f53be LibWeb: Handle text-overflow: ellipsis with trailing whitespace
We should calculate whether we need to truncate text with an ellipsis
exclusive of any trailing collapsible whitespace.

This was causing issues where an inline element was automatically sized
(e.g. min-content) as we would calculate available width exclusive of
trailing collapsible whitespace and then our text chunk would be wider,
always inserting an ellipsis.

Fixes the visual element of #4048 but we still are incorrect in how we
collapse whitespace more generally
2025-08-18 11:00:26 +01:00
Aliaksandr Kalenik
80c8e787a8 LibWeb: Fix abspos layout when box is contained by grid area
Before this change, `layout_absolutely_positioned_element()` in GFC
had an assumption that all contained by grid container abspos boxes were
also direct children of the grid container. This change adds handling
for the cases when it's not true and, in order to identify grid area
abspos box belongs to, we have to find ancestor grid item.
2025-08-17 17:58:16 +02:00
Tim Ledbetter
ad06ac0d58 LibWeb: Implement the color-interpolation property for SVG gradients
This changes the operating color space for gradient `<linearGradient>`
and `<radialGradient>` elements.
2025-08-17 10:51:05 +02:00
Aliaksandr Kalenik
4d223462a5 LibWeb: Fix cyclic percentage resolution in calculate_min_content_width
Brings back some code removed in 652a457, but this time with explanation
from https://www.w3.org/TR/css-sizing-3 spec.
2025-08-13 10:14:37 +01:00
Sam Atkins
7c8c05ee82 LibWeb/Layout: Support visibility:collapse on table-row elements
When a table row (or its group) is set to collapse, the row takes up no
vertical space in the layout.

We have to account for this in multiple places, so I've cached whether a
row is collapsed in the TableGrid::Row.
2025-08-11 11:07:47 +01:00
Aliaksandr Kalenik
652a457f52 LibWeb: Fix grid layout for replaced items with percentage max-width
CSS grid specification states that for grid items with a replaced
element and a percentage preferred size or maximum size, the percentage
should be resolved against 0 during content-based minimum size
calculation. This makes sense, as it prevents replaced items from
overshooting their grid track while intrinsic track sizes are
calculated, and allows later track size resolution steps to scale
replaced items to fit their grid track.
2025-08-10 11:07:02 +02:00
Sam Atkins
4e92ab52e3 LibWeb/CSS: Rename CSSKeywordValue -> KeywordStyleValue
The typed-om CSSKeywordValue will need to be a separate class.
2025-08-08 15:19:03 +01:00
Sam Atkins
c57975c9fd LibWeb: Move and rename CSSStyleValue to StyleValues/StyleValue.{h,cpp}
This reverts 0e3487b9ab.

Back when I made that change, I thought we could make our StyleValue
classes match the typed-om definitions directly. However, they have
different requirements. Typed-om types need to be mutable and GCed,
whereas StyleValues are immutable and ideally wouldn't require a JS VM.

While I was already making such a cataclysmic change, I've moved it into
the StyleValues directory, because it *not* being there has bothered me
for a long time. 😅
2025-08-08 15:19:03 +01:00
Aliaksandr Kalenik
564003b22a LibWeb: Mark width & height of grid item definite before inside layout
FFC expects parent formatting context to mark size as definite if that's
the case, because otherwise it cannot figure cross line size correctly.
Fixes incorrect alignment when FFC is nested in GFC.

Progress on https://web.telegram.org/a/ layout.
2025-08-07 09:34:16 +02:00
InvalidUsernameException
add3a095d8 LibWeb/CSS: Rename background-repeat related symbols to align with spec
These will be used for the mask-repeat property as well in an upcoming
commit, hence the more generic names. Also, this more closely matches
the names used in the spec.
2025-08-06 23:09:07 +01:00
Aliaksandr Kalenik
e3aa3016bf LibWeb: Correctly calculate grid item size while accommodating fr track
Implements text from grid layout specification.
Improves layout on https://cal.com/
2025-08-06 22:42:07 +02:00