Commit graph

278 commits

Author SHA1 Message Date
Callum Law
52192a308b LibWeb: Update absolutize to take a ComputationContext struct
This struct will in the future hold information other than a length
resolution context (e.g. context for tree counting functions) and a
single struct is easier to work with than multiple parameters.
2025-10-07 10:50:01 +01:00
Callum Law
47ffffb775 LibWeb: Absolutize value at start of compute_value_of_property
This saves us having to do it in various places later on.
2025-10-07 10:50:01 +01:00
Sam Atkins
b3ad4be90c LibWeb/CSS: Ensure properties can be computed from "basic" StyleValues
This commit modifies the `compute_foo()` code for `font-style` and
`math-depth`. They previously assumed that their StyleValue was always
a special kind: FontStyleStyleValue or MathDepthStyleValue. This was
always true, because that's how we parse them, but it stops being true
once StylePropertyMap is involved: An author can set font-style to a
CSSKeywordValue of "italic", and this should work.

There are multiple ways that we could solve this, but the simplest and
easiest to maintain seems to be to handle those more basic StyleValues
in this computation code. Going forward, we'll have to be aware that
similar properties could have a basic StyleValue from the typed-OM
instead of the property-specific one we'd expect.
2025-10-04 22:57:00 +02:00
Sam Atkins
c0ef7f09e4 LibWeb/CSS: Use PropertyNameAndID instead of old Variant 2025-10-02 13:46:04 +01:00
luizgfc
13748a8c19 LibWeb: Make Custom Properties cascading consider !important
Make so that !important properties are always applied last, prioritizing
them over normal properties
2025-09-30 09:54:10 +01:00
Pascal Pomper
5b1eba7ac8 LibWeb: Position absolute block-level boxes below previous siblings
Whether an absbox is positioned below or to the right of its previous
sibling in an `InlineFormattingContext` is determined by the
display-outside value before blockification, so we store the
pre-blockification `display` value in `ComputedValues` to access it in
`InlineFormattingContext` and position the box accordingly.
2025-09-29 18:37:53 +02:00
Tim Ledbetter
fda5ea8277 LibWeb: Correctly resolve position-area computed value 2025-09-29 12:48:13 +02:00
Tim Ledbetter
83ad5ce8a2 LibWeb: Don't deduplicate font-variation-settings values at parse time
We now only deduplicate and sort the computed value of the
`font-variation-settings` property.
2025-09-26 11:20:54 +01:00
Tim Ledbetter
6cb0f0fbcd LibWeb: Ensure large animation progress values don't overflow 2025-09-26 11:20:54 +01:00
Callum Law
43dd0f2dda LibWeb: Properly clamp interpolated opacity values
Opacity values are unique in that the range which calculated and
interpolated values should be clamped to [0,1] is different from the
range of allowed values [-∞,∞].

This fixes 28 WPT tests that were regressed in #6112
2025-09-24 12:01:52 +01:00
Callum Law
ce4a24eec5 LibWeb: Store animation-name in ComputedProperties in computed form 2025-09-24 11:58:20 +01:00
Callum Law
030e6d7c9b LibWeb: Parse animation-* properties as comma separated lists
We are yet to actually support having more than one value but this gets
us closer and gains us some WPT tests in the process.
2025-09-24 11:58:20 +01:00
Callum Law
4fd57f90b3 LibWeb: Apply animations after computing property values
We were unnecessarily computing property values within
`collect_animation_into` which we can avoid by ensuring that all calls
to `collect_animation_into` happen after property values are computed.
2025-09-24 11:58:20 +01:00
Callum Law
af32413dec LibWeb: Store line-height in ComputedProperties in computed form
We now fail a few more tests in properties-value-inherit-001.txt as we
no longer overwrite the non-animated value of `line-height` with the
animated value, this is in line with other major browsers.
2025-09-23 15:57:32 +01:00
Callum Law
3b15c303f6 LibWeb: Use computed line-height for FontMetrics
We were already doing this within `compute_property_values` where
we resolved most relative lengths but the remainder was instead
incorrectly using the font's line-spacing
2025-09-23 15:57:32 +01:00
Callum Law
e8ad657589 LibWeb: Don't override value of font-style when computing keyframes
We don't actually rely on this being in computed form yet so this is a
non-functional change for now.
2025-09-23 15:57:32 +01:00
Tim Ledbetter
e502f19fa7 LibWeb: Implement the animation-composition property 2025-09-19 10:10:05 +01:00
Callum Law
dc41d045d8 LibWeb: Store font-style in ComputedProperties in computed form 2025-09-19 10:06:33 +01:00
Callum Law
10793aef56 LibWeb: Move to_font_slope from StyleValue to FontStyleStyleValue
This method only operated on `FontStyleStyleValue`s anyway so this is a
better place to have it
2025-09-19 10:06:33 +01:00
Callum Law
335c8c7ffb LibWeb: Store font-width in ComputedProperties in computed form 2025-09-19 10:06:33 +01:00
Callum Law
44eaa7ad98 LibWeb: Avoid overwriting non-animated font-weight when computing font
Previously if we would overwrite the non-animated font-size with the
animated font-size if it was set.

Loses us 2 WPT tests but this is in line with other browsers
2025-09-19 10:06:33 +01:00
Callum Law
39484e2027 LibWeb: Store font-weight in ComputedProperties in computed form
We now also more closely follow the spec when computing values for
font-weight and we now:
 - Support relative lengths in `calc()`s
 - Properly clamp `calc()`s
 - Support relative keywords (e.g. lighter, bolder)
 - Respect that font-weight can be a non-integer number.

This does expose a few false positives in the font-weight-computed.html
WPT test. This is because we don't recompute non-inherited font-weight
within `recompute_inherited_style` which means that relative keyword
values can fall out of sync with their parent's value. These previously
passed as we treated `bolder` and `lighter` as aliases for `bold` and
`normal` respectively.
2025-09-19 10:06:33 +01:00
Callum Law
cfbe0244d4 LibWeb: Use computed value of font-size in keyframes
Remaining test failures in font-size-interpolation-00* are either:
 - Rounding of font-size to CSSPixels when setting the expected value
 - Not clamping negative values from the point of view of
   getComputedStyle (used values are still clamped)
2025-09-19 10:06:33 +01:00
Callum Law
64d2f0d55a LibWeb: Avoid overwriting non-animated font-size when computing font
Previously if we would overwrite the non-animated font-size with the
animated font-size if it was set.

Gains us 8 WPT tests and means we now fail 9 others in line with other
browsers.
2025-09-19 10:06:33 +01:00
Callum Law
c6049e6853 LibWeb: Remove StyleComputer::root_element_font_metrics_for_element
This method is now unused so can be removed
2025-09-19 10:06:33 +01:00
Callum Law
e9faf056f1 LibWeb: Decouple font-size computation from compute_font_for_syle_values
There are other places we want to convert font-size into it's computed
form than just when we are loading the font (e.g. computing keyframes).

Gains us 36 WPT passes as we now correctly clamp negative calc values.
2025-09-19 10:06:33 +01:00
Callum Law
d6754307f9 LibWeb: Separate relative sizes from absolute_size_mapping
Having relative sizes handled in this function was misleading
2025-09-19 10:06:33 +01:00
Callum Law
b80e6a4d30 LibWeb: Rename get_inherit_value to get_non_animated_inherit_value
This more acurately represents what it does.
2025-09-19 10:06:33 +01:00
Tim Ledbetter
9b15517052 LibWeb: Apply composite operator to keyframe effects 2025-09-18 16:46:06 +01:00
Sam Atkins
95aceb6ec9 LibWeb: Store custom properties in an OrderedHashMap
We are expected to preserve their order within a style declaration, so
let's do that. Passes 1 tracked WPT subtest.
2025-09-18 14:59:14 +02:00
Marcos Del Sol Vives
40792aa85d LibWeb/CSS: Fix compilation with CSS_TRANSITIONS_DEBUG
A new parameter was added to Web::CSS::StyleValue::to_string() in
PR #2820 but this debug message was never updated. If
CSS_TRANSITIONS_DEBUG was enabled, compilation would fail.
2025-09-13 23:33:57 +02:00
Callum Law
858450922b LibWeb: Parse and compute text-underline-offset property 2025-09-12 07:07:15 +01:00
Sam Atkins
524a161a51 LibWeb: Take AbstractElement in start_a_transition() 2025-09-11 18:45:35 +02:00
Sam Atkins
e6bb0ab000 LibWeb/CSS: Take AbstractElement in compute_transitioned_properties() 2025-09-11 18:45:35 +02:00
Sam Atkins
77f1057992 LibWeb/CSS: Take AbstractElement in cascade_custom_properties() 2025-09-11 18:45:35 +02:00
Sam Atkins
b49d00996b LibWeb/CSS: Take AbstractElement in compute_text_align() 2025-09-11 18:45:35 +02:00
Sam Atkins
fa790e5095 LibWeb/CSS: Take AbstractElement in for_each_matching_rules() 2025-09-11 18:45:35 +02:00
Sam Atkins
cdc4f7c989 LibWeb/CSS: Take AbstractElement to compute alias mapping contexts 2025-09-11 18:45:35 +02:00
Sam Atkins
cdbaa73576 LibWeb/CSS: Take AbstractElement in box-type transformation functions 2025-09-11 18:45:35 +02:00
Sam Atkins
44e70d9087 LibWeb/CSS: Take AbstractElement in compute_cascaded_values() 2025-09-11 18:45:35 +02:00
Sam Atkins
82d194ba99 LibWeb/CSS: Take AbstractElement in start_needed_transitions() 2025-09-11 18:45:35 +02:00
Sam Atkins
acb211174d LibWeb/CSS: Take AbstractElement in MatchingRule collection 2025-09-11 18:45:35 +02:00
Sam Atkins
50c0b4549c LibWeb/CSS: Take AbstractElement in collect_animation_into() 2025-09-11 18:45:35 +02:00
Sam Atkins
b2ee4a9444 LibWeb/CSS: Take AbstractElement in StyleComputer::compute_properties()
As noted, the chunk of this method that deals with animations could do
with some helpers on AbstractElement, but I'm leaving that until it's
clearer how animations and pseudo-elements should interact.
2025-09-11 18:45:35 +02:00
Sam Atkins
0293176429 LibWeb/CSS: Take AbstractElement in StyleComputer::get_*_inherit_value() 2025-09-11 18:45:35 +02:00
Sam Atkins
64c3319147 LibWeb/CSS: Take AbstractElement in font computation methods 2025-09-11 18:45:35 +02:00
Sam Atkins
263c51f6ac LibWeb/CSS: Take AbstractElement in compute_pe_style_if_needed() 2025-09-11 18:45:35 +02:00
Sam Atkins
cee84d22a0 LibWeb/CSS: Take AbstractElement in cascade_declarations() 2025-09-11 18:45:35 +02:00
Sam Atkins
8706a6165d LibWeb: Take AbstractElement in compute_style_impl() 2025-09-11 18:45:35 +02:00
Sam Atkins
27aab90e66 LibWeb: Take AbstractElement in StyleComputer::compute_style() 2025-09-11 18:45:35 +02:00
Sam Atkins
916e24de30 LibWeb/CSS: Take AbstractElement in resolve_unresolved_properties() 2025-09-11 18:45:35 +02:00
Sam Atkins
83aee2c7fc LibWeb: Take AbstractElement in resolve_unresolved_style_value() 2025-09-11 18:45:35 +02:00
Sam Atkins
b3e32445d3 LibWeb/CSS: Use generated FooUnit types instead of Foo::Type
I've also renamed the `m_type` and `type()` members to be `m_unit` and
`unit()` instead, to match what they actually are.
2025-09-11 17:06:44 +01:00
Callum Law
a46453f234 LibWeb: Map logical alias transition properties to physical counterparts
Transitions apply after logical properties are mapped to their physical
counterparts so we should apply this mapping to `transition` properties

Gains us 20 WPT tests.
2025-09-11 06:08:07 +01:00
Callum Law
62176391dd LibWeb: Include z-index in transition: all
Gains us 37 WPT tests.
2025-09-11 06:08:07 +01:00
Callum Law
0209e502cf LibWeb: Use expanded longhands when computing transition properties
Using longhands rather than expanded longhands meant for instance that
we wouldn't transition `border-top-width` if we had `border` as the
transition property.
2025-09-11 06:08:07 +01:00
Tim Ledbetter
bd7348949a LibWeb: Make word-spacing and letter-spacing default value compute to 0 2025-09-10 16:12:29 +01:00
Callum Law
a7e5ded188 LibWeb: Add generic logic for parsing "positional-value-list-shorthands"
Continues the work started in #5386 to simplify handling of positional
value list shorthand properties.

Previously we would parse these as `StyleValueList`s and then rely on
`StyleComputer::for_each_property_expanding_shorthands` to expand them
into longhands.

This required a bit of work to handle `ShorthandStyleValue`s for the
`@page` `margin` descriptor.
2025-09-09 11:45:47 +02:00
Callum Law
5a7eaf6f73 LibWeb: Store flood-opacity in computed form in ComputedProperties 2025-09-08 11:03:32 +01:00
Callum Law
91e88ad6e8 LibWeb: Store stroke-opacity in computed form in ComputedProperties 2025-09-08 11:03:32 +01:00
Callum Law
c045969234 LibWeb: Store stop-opacity in computed form in ComputedProperties 2025-09-08 11:03:32 +01:00
Callum Law
9434b08bed LibWeb: Store fill-opacity in computed form in ComputedProperties 2025-09-08 11:03:32 +01:00
Callum Law
1ba84de4f6 LibWeb: Store opacity in computed form in ComputedProperties 2025-09-08 11:03:32 +01:00
Aliaksandr Kalenik
4c7da460dc LibWeb: Add ::slotted() pseudo-element support
Implements `::slotted()` to enough extent we could pass the imported WPT
test and make substantial layout correctness improvement on
https://www.rottentomatoes.com/
2025-09-04 09:51:34 +01:00
Callum Law
56c4e8199b LibWeb: Clamp negative font-size when loading font
`font-size` can end up with a negative value - either due to `calc`
being resolved using the old method which doesn't clamp the value, or
interpolation - in this case we should clamp negative values to zero.

Gains us 36 new WPT passes and fixes crashes in the three imported
tests.
2025-09-01 12:28:53 +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
Callum Law
d4aa40a9fe LibWeb: Use computed not just absolutized value when computing keyframes
No functionality changes as we don't yet implement computing any
property values using this method.
2025-08-28 09:29:46 +01:00
Callum Law
f9e5332d16 LibWeb: Initial work to store ComputedProperties in computed form
`StyleValue`s stored within `ComputedProperties` should be in their
computed forms, this is for various reasons including:
 - Inheritance should be of computed values
 - Animations should work on computed values
 - Triggering transitions should work on computed values

Currently we store `StyleValue`s in an absolutized version of the
specified value - this is equivalent to the computed form in many cases
which is why this hasn't been causing significant issues but there are
some cases - such as `border-*-width` keywords where this is not the
case.

No functionality change as we are yet to implement any properties
2025-08-28 09:29:46 +01:00
Callum Law
ede80ccdfb LibWeb: Allow UseInitial in keyframes when updating animated style
This removes the AnimationRefresh argument from `collect_animation_into`
which was added in a9b8840 - it's only effect was disallowing
`UseInitial`s within keyframes when we were doing animated style
updates which I believe is unintentional.

Gains us 214 WPT tests.
2025-08-27 14:50:58 +02:00
Callum Law
d69e62425e LibWeb: Resolve CSS-wide keywords in keyframe properties
Also resolves the `revert` keyword against longhand properties rather
than potential shorthands as this could cause a crash.

Gains us 20 WPT tests.
2025-08-27 14:50:58 +02:00
Callum Law
912ffc3f84 LibWeb: Remove unnecessary ComputedProperties::maybe_null_property
We know that all (longhand) properties have a value so this is
unnecessary.
2025-08-26 12:17:55 +02:00
Callum Law
1ba64a1d7e LibWeb: Remove StyleComputer as friend of ComputedProperties
Everything we need to do with ComputedProperties in StyleComputer can be
done via the public APIs
2025-08-26 12:17:55 +02:00
Callum Law
ed947940d7 LibWeb: Simplify conversion of percentage line-height to absolute length
We can take advantage of the fact that we already do this in
`compute_line_height`.
2025-08-26 12:17:55 +02:00
Callum Law
1a3da3d825 LibWeb: Don't store separate computed value for font_size
The StyleValue stored in m_property_values is already in it's computed
form and it's trivial to pull the underlying value out so there is no
need to store this separately.

Also removes unnecessary handling of percentage values in
`absolutize_values` - this is already handled within `compute_font`.
2025-08-26 12:17:55 +02:00
Callum Law
fba4187c8f LibWeb: Add a constant for the number of longhand properties
We use this in multiple places (and will in more places in the future)
so it's worth having as a constant from a clarity point of view
2025-08-26 12:17:55 +02:00
Tim Ledbetter
cb1a1a5cb5 LibWeb: Replace is<T>() with as_if<T>() where possible 2025-08-25 18:45:00 +02:00
Callum Law
6373ab68ee LibWeb: Use inherited value of math-style when computing math-depth
The spec calls for us to use the inherited value but we were using our
own value.
2025-08-22 09:48:52 +02:00
Callum Law
4efbd0dc4d LibWeb: Support relative lengths in math-depth calcs
As this is computed before font-size we use the parent's length
resolution context.
2025-08-22 09:48:52 +02:00
Callum Law
944b985929 LibWeb: Remove handling of invalid values in compute_math_depth
This was unnecessary as the parser will never produce values other than
MathDepthStyleValue
2025-08-22 09:48:52 +02:00
Callum Law
a2c9ab9c9a LibWeb: Return AbstractElement from element_to_inherit_style_from
No functional changes.
2025-08-22 09:48:52 +02:00
Callum Law
9122d0d014 LibWeb: Remove compute_defaulted_{values|property_value}
These functions are unused.
2025-08-21 13:49:21 +02:00
Callum Law
ce0fef7c45 LibWeb: Initialize properties before calling compute_{math_depth|font}
`StyleComputer::create_document_style` was the only place this wasn't
the case so we can remove the calls to
`compute_defaulted_property_value`. The call to
`compute_defaulted_values` in `create_document_style` is now redundant
so has been removed`
2025-08-21 13:49:21 +02:00
Callum Law
b267012ba7 LibWeb: Handle color: currentcolor in compute_properties
This was the last thing that `compute_defaulted_values` was doing when
called from here.

It also comes with the added benefit of us correctly inheriting animated
colors.
2025-08-21 13:49:21 +02:00
Callum Law
48832972b1 LibWeb: Handle -libweb-inherit-or-center in compute_text_align
This seems like a more natural place to handle this
2025-08-21 13:49:21 +02:00
Callum Law
ca9cb42ed4 LibWeb: Handle unset immediately in compute_properties
Previously we would hand off to `compute_defaulted_properties` to
resolve these values but there is no need as we can just resolve them
immediately.
2025-08-21 13:49:21 +02:00
Callum Law
9330bf4b72 LibWeb: Propagate animated values in recompute_inherited_style
As `recompute_inherited_style` works in-place rather than building
ComputedProperties from scratch we need to keep track of which animated
properties are inherited to know whether we should remove them when we
have no more inherited value.
2025-08-21 10:46:55 +01:00
Callum Law
9a8c6ff8c3 LibWeb: Inherit animated CSS property values separately
When starting transitions we compute the after-change style, for any
inherited properties this should include the non-animated value.

Previously we were only inheriting the animated value and treating it as
non-animated so were instead including the animated value.

This commit fixes that by inheriting both the animated and non-animated
values (with the former being stored in `m_animated_property_values`,
and the latter in `m_property_values`).

This gains us 12 new WPT passes.

This brings with it 252 new WPT fails from the various 'events' tests in
css/css-transitions/properties-value-inherit-001.html, however these
also fail in other browsers (Chrome, Edge and Firefox) and the behaviour
that causes these failures is specifically mentioned in the spec.
2025-08-18 11:18:34 +01:00
Callum Law
84fb0b458f LibWeb: Properly initialize KeyframeEffect contained in CSSTransition
This commit updates the CSSTransition constructor to:
 - Leave the KeyframeEffect start time unresolved
 - Set the KeyframeEffect start delay

Gains us 14 WPT passes but exposes one false positive in
properties-value-inherit-001.html
2025-08-18 11:18:34 +01:00
Andreas Kling
efd4f63454 LibWeb: Allow blockification across display: contents boundary
Flex/grid items are always blockified (have their CSS display forced
into "block") by style computation.

We were doing this by looking at the CSS display of the parent. However,
if the parent has `display: contents`, we must look at the *grandparent*
instead.

This corrects the layout of buttons underneath Reddit article cards.
2025-08-17 19:09:50 +02:00
Andreas Kling
9208a54b0b LibWeb: Allow style inheritance through slots
When a subtree is projected through a slot, its root now inherits style
from the slot's parent, rather than the parent of the unprojected root.

This fixes a ton of subtle issues, and is very noticeable on Reddit.
2025-08-16 21:03:31 +02:00
Sam Atkins
6cad3f1921 LibWeb/CSS: Rename CSSColorValue -> ColorStyleValue
The typed-om class will be a separate thing.
2025-08-08 15:19:03 +01: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
Callum Law
9db3c66a85 LibWeb: Use correct font size when absolutizing animated properties 2025-08-06 17:44:12 +01:00
Andreas Kling
c4b13589e9 LibWeb: Make StyleComputer and FontLoader GC-allocated
This allows them to keep style sheets alive while loading fonts for
them. Fixes some GC crashes seen on the WPT WOFF2 tests after
66a19b8550 stopped FetchRecord leaks from
keeping various other things alive.
2025-07-30 16:35:08 +02:00
Aliaksandr Kalenik
d1fbb7b51e LibWeb: Invalidate less elements affected by CSS custom properties
Before this change, whenever element's attributes changed, we would add
a flag to "pending invalidation", indicating that all descendants whose
style uses CSS custom properties needed to be recomputed. This resulted
in severe overinvalidation, because we would run invalidation regardless
of whether any custom property on affected element actually changed.

This change takes another approach, and now we decide whether
descendant's style needs to be recomputed based on whether ancestor's
style recomputation results in a change of custom properties, though
this approach adds a little overhead to style computation as now we have
to compare old vs new hashmap of custom properties.

This brings substantial improvement on discord and x.com where, before
this change, advantage of using invalidation sets was lost and we had
to recompute all descendants, because almost all of them use custom
properties.
2025-07-30 11:06:05 +02:00
Jelle Raaijmakers
73967ee90c Everywhere: Use HashMap::update() where applicable 2025-07-25 16:22:06 +02:00
aplefull
34f0ac15fd LibWeb: Resolve calculated time values in animations and transitions
This lets us play animations and transitions when time values are
stored in the form of calculated values, such as `calc(1s + 500ms)`.
2025-07-23 15:21:23 +01:00