Commit graph

328 commits

Author SHA1 Message Date
Callum Law
b8f2989ccb LibWeb: Reduce recompilation from editing CascadedProperties.h
This reduces the recompilation of editing `Properties.json` from ~1429
to ~158
2026-02-19 11:27:06 +00:00
Callum Law
3d3d0a50b6 LibWeb: Add generic Length::from_style_value method 2026-02-16 12:09:23 +00:00
Callum Law
33e590dddb LibWeb: Ensure that computation context cache is always cleared
Previously we didn't clear the computation context caches after:
 - Recomputing inherited style
 - Computing keyframe values

We now clear the caches in those two cases and verify it has been
cleared before using it.

Fixes #7959
2026-02-15 17:52:11 +01:00
Andreas Kling
2b6e6e4ea2 LibWeb: Fix crash in style inheritance for pseudo-element slots
Elements in internal shadow trees that represent CSS pseudo-elements
(e.g. the DetailsContent slot in <details>) store their cascaded
properties on the host element's pseudo-element data, not on the
element itself. This meant that when slotted elements walked the
inheritance chain and encountered such a slot, they would dereference
null cascaded properties and crash.

Fix this by copying the cascaded properties onto the slot element
itself after computing its style, keeping both cascaded and computed
properties accessible in the same place.
2026-02-14 14:36:21 -05:00
Callum Law
498e501ea3 LibWeb: Mark StyleComputer cache members as mutable
This avoids some ugly `const_cast`s
2026-02-14 14:35:30 -05:00
Callum Law
daf8d90579 LibWeb: Only set property flags when required in compute_properties
When we initialize `ComputedProperties` all flags are initially set to
false so we only need to update them if they are true
2026-02-13 21:54:06 +01:00
Callum Law
08ef225d0f LibWeb: Only compute inheritance parent once in compute_properties
Previously we were doing this multiple times per property which was
quite expensive
2026-02-13 21:54:06 +01:00
Callum Law
b949fe087a LibWeb: Cache the computed value of corner-*-*-shape initial value 2026-02-13 21:54:06 +01:00
Callum Law
63584321fe LibWeb: Skip property computation in some cases
There are cases where we can skip the property value computation process
because we know that the computed value will be equal to the specified
value
2026-02-13 21:54:06 +01:00
Callum Law
9195f26003 LibWeb: Immediately compute property values in compute_properties
We can avoid some overhead by computing the values immediately instead
of setting them within `ComputedProperties` and then calling
`compute_property_values`
2026-02-13 21:54:06 +01:00
Callum Law
f490227ee0 LibWeb: Set "display before box type transformation" in relevant place
In a future commit we will update `compute_properties` to avoid calling
`compute_property_values` but we still need to store this value
2026-02-13 21:54:06 +01:00
Callum Law
0ced4b5bb8 LibWeb: Don't coordinate background-image with itself
This is always a no-op
2026-02-13 21:54:06 +01:00
Callum Law
32da7edf5e LibWeb: Compute font properties the same as other properties
Previously we computed font properties separately from other properties
for two reasons:
  1) These font properties were computed using a different length
     resolution context than the rest of the properties.
  2) These properties were required to be computed before creating the
     length resolution context for the rest of the properties.

The first issue was solved in the previous commit by introducing a
generic method to get the computation context for a property, and
the second is solved in this commit by computing properties in the
required order.

This simplifies the code a bit and opens up some opportunities for
optimization.
2026-02-13 21:54:06 +01:00
Callum Law
5b635a2135 LibWeb: Don't number steps in compute_properties comments
Having these numbered doesn't add anything and makes diffs ugly when we
add/remove a step
2026-02-13 21:54:06 +01:00
Callum Law
f1e7743989 LibWeb: Add generic method to get computation context for property
The computation context used is the main thing distinguishing the
computation of font/non-font properties so having a generic method to
handle this will allow us to consolidate logic between the two.
2026-02-13 21:54:06 +01:00
Andreas Kling
9e8e568b43 LibWeb: Use structural sharing for CSS custom properties
Replace per-element OrderedHashMap storage for custom properties with
a RefCounted chain (CustomPropertyData) that enables structural
sharing. Each chain node stores only the properties declared directly
on its element, with a parent pointer to the inherited chain.

Elements that don't override any custom properties share the parent's
data directly (just a RefPtr copy). During cascade, only entries that
actually differ from the parent are stored in own_values - the rest
are inherited through the chain. During var() resolution, resolved
values are compared against the parent's and matching entries are
dropped, enabling further sharing.

The chain uses a depth limit (max 32) with flattening, plus
absorption of small parent nodes (threshold 8) to keep lookups fast.

This reduces custom property memory from ~79 MB to ~5.7 MB on
cloudflare.com.
2026-02-13 14:57:15 +01:00
Chase Knowlden
b8f31179b2 LibWeb: Use dimension image source for images
Fixes tiny images on Wikipedia
2026-02-13 10:42:38 +00:00
Callum Law
61b0b20f11 LibWeb: Respect animation-timeline: none 2026-02-11 10:49:34 +01:00
Callum Law
ea2755d4f2 LibWeb: Move animation property application to CSSAnimation
In a future commit this method will be edited to use information stored
within the `CSSAnimation` and it makes more sense to have that data
private
2026-02-11 10:49:34 +01:00
Jelle Raaijmakers
726fe8284c LibWeb: Check if author rule layers are non-empty for pseudo-elements
The author_rules vector always contains at least one layer (the
unlayered entry), so checking is_empty() was always false. Instead,
check whether any layer actually contains rules.
2026-02-06 10:47:50 +00:00
Jelle Raaijmakers
ab82b0147d LibWeb: Compute styles for pseudo-elements with implicit UA styles
Some pseudo-elements have implicit UA styles that need to be computed
even when no CSS rules matched.
2026-02-06 10:47:50 +00:00
Sam Atkins
92897a1dec LibWeb/CSS: Absolutize color KeywordStyleValues
These get computed to an equivalent RGBColorStyleValue.

To support this, we now store the computed color-scheme on the
ComputationContext when computing properties that might contain a color.

This has a nice bonus of correcting the css-accent-color test's result.
2026-02-05 13:48:10 +00:00
Sam Atkins
2994a7532d LibWeb: Make shadow_including_first_ancestor_of_type() use the flat tree
Every user of this actually wants an ancestor in the flat tree - taking
things like `<slot>` into account. So rename it and adjust its behavior
to use that.
2026-02-05 11:21:08 +01:00
Callum Law
2310aaa5b3 LibWeb: Compute font-feature-settings before computing font
In a future commit we will require this to be in it's computed form
before calling `ComputedProperties::computed_font_list()`.

We will also depend on other properties (e.g. `font-kerning`,
`font-variant-*`) but these are unaffected by computation.
2026-02-02 14:11:43 +00:00
Tim Ledbetter
66246a0f3a LibWeb: Implement composition for grid track size lists 2026-01-26 03:20:08 +01:00
Callum Law
2c3ddc294f LibWeb: Compute math-depth in line with other font properties
The main change here is that we now properly absolutize values which
means we now support `random()` and `sibling-{count,index}()`

We are also more consistent with how we handle computation for the other
font properties
2026-01-15 12:03:16 +00:00
Callum Law
27dd77a538 LibWeb: Don't store resolved math depth directly
There's no need to store this twice

We also now use `set_property_without_modifying_flags` to avoid
overwriting inherited/important flags
2026-01-15 12:03:16 +00:00
Callum Law
eb5b73d3b5 LibWeb: Use existing StyleValues for math-depth
Previously we implemented an all encompassing `MathDepthStyleValue`
specifically for the `math-depth` property, this was unnecessary since
we can represent `auto-add` and `<integer>` using existing `StyleValue`
classes.

This brings the values created from parsing in line with those set via
`StylePropertyMap` which allows us to simplify computation
2026-01-15 12:03:16 +00:00
Tim Ledbetter
40d217bde2 LibWeb/CSS: Serialize shorthands with var() to original value 2026-01-15 11:50:45 +00:00
Andreas Kling
5049599594 LibWeb: Use FixedBitmap in StyleComputer to avoid malloc
Replace two uses of heap-allocated Bitmap with stack-allocated
FixedBitmap. The sizes are known at compile time, so there's no need
to hit malloc for these.
2026-01-14 11:46:23 +01:00
Callum Law
9b20fe6902 LibWeb: Promote font-style to ValueType
This means we now allow oblique angles when parsing the `font`
shorthand.

This also required us to rename the existing `FontStyle` enum to
`FontStyleKeyword`
2026-01-13 10:21:26 +00:00
Callum Law
1c1476f728 LibWeb: Don't compute font-feature-settings until compute-time
Previously we applied the computation logic (i.e. deduplication and
sorting of tags) at parse time
2026-01-13 10:21:26 +00:00
Callum Law
99c06675cf LibWeb: Combine cascaded property lookups during computation
Previously we would do two cascaded property lookups per property during
style computation - the first to get the value of the property and the
second to check whether it was marked as important. We now do this as a
single lookup to save some unnecessary work.
2026-01-11 14:10:37 +01:00
Andreas Kling
a9cc425cde LibJS+LibWeb: Add missing GC marking visits
This adds visit_edges(Cell::Visitor&) methods to various helper structs
that contain GC pointers, and makes sure they are called from owning
GC-heap-allocated objects as needed.

These were found by our Clang plugin after expanding its capabilities.
The added rules will be enforced by CI going forward.
2026-01-07 12:48:58 +01:00
Callum Law
558f034007 LibWeb: Consolidate transition computation
Previously the logic to compute transitions was split across
`ComputedProperties`, `StyleComputer`, and `Animatable` - this commit
consolidates it all in `ComputedProperties`
2026-01-05 11:35:26 +00:00
Aliaksandr Kalenik
3353ec9663 LibWeb: Add result caching for :has() pseudo-class matching
The `:has()` pseudo-class requires traversing descendants (or siblings)
to find matches.

With this change we cache results keyed by `(Selector*, Element*)`
pairs. The cache is stored in `StyleComputer` and cleared at the start
of each style computation pass in `Document::update_style()`.

When `:has()` uses a descendant combinator and we find a match, we also
cache that all ancestors between the matching descendant and the
anchor match. For example with `div:has(.target)`:

```html
<div id="A">  <!-- checking :has(.target) here -->
  <div id="B">
    <div id="C">
      <span class="target"/>
    </div>
  </div>
</div>
```

When we find `.target` while checking `div#A`, we also cache that
`div#B` and `div#C` match `:has(.target)` since they also contain
`.target`. Later when styling these elements, we get cache hits and skip
traversal.
2026-01-04 19:36:40 +01:00
Sam Atkins
45fc72214f LibWeb/CSS: Set border-widths to 0 at used time, not computed time
...when the style is `none` or `hidden`. `outline-width` is not affected
by `outline-style: none` at all.

In our codebase, that means doing the border-width conversion when
assigning to ComputedValues.

Corresponds to:
2a3d1e4d10
09f11f2ef9
2025-12-15 21:28:19 +01:00
Sam Atkins
4ab9ac86a7 LibWeb/CSS: Implement basic ::part() matching
Matches elements with a `part` attribute, against their parent shadow
host.
2025-12-15 14:12:39 +00:00
Callum Law
69f05bd45d LibWeb: Store animation time values in abstract type
In level 2 of the web animations spec, times are no longer always
measures in milliseconds, they can also be percents when dealing with
progress-based (i.e. scroll-based) timelines.

We don't actually support percent times yet but this change will make it
easier to implement when we do.
2025-12-12 10:49:18 +00:00
Callum Law
f9df1c4eea LibWeb: Implement distinct specified timing values for AnimationEffect
Web Animations Level 2 disallows setting some `AnimationEffect` timing
values (start delay, end delay, iteration duration) directly and instead
allows authors to set the specified values which are then normalized
into the actual used values taking into account the type of the
associated timeline (i.e. progress- vs time-based)
2025-12-12 10:49:18 +00:00
Callum Law
68d07355ed LibWeb: Coordinate border-* longhands at compute time
Updates the `position-serialization.html` test to be 2-valued so that
all cases are covered.
2025-12-08 11:46:50 +00:00
Callum Law
020c4aadff LibWeb: Parse background-position as ShorthandStyleValue
This makes us consistent with how we handle this value within the
`background` shorthand and allows us to remove the special handling in
`StyleComputer::for_each_property_expanding_shorthands`
2025-12-08 11:41:13 +00:00
Callum Law
dca80ad5eb LibWeb: Account for animated values when computing font
Computing the font for an element in `compute_font` is premature since
we are yet to apply animated properties - instead we should compute the
value on the fly (with a cache to avoid unnecessary work) to ensure we
are respecting the latest values
2025-12-05 10:03:15 +00:00
Callum Law
6c236d04d8 LibWeb: Separate font computation logic from StyleComputer
Font computation and loading is distinct enough from style computation
that it makes more sense to have this in it's own class.

This will be useful later when we move the font loading process to
`ComputedProperties` in order to respect animated values.
2025-12-05 10:03:15 +00:00
Callum Law
dfa47d9ed6 LibWeb: Simplify handling of font-variation-settings
Since we resolve any relative lengths at compute time there's no need
for the value to be passed around as a `NumberOrCalculated` and we can
just resolve it within `ComputedProperties::font_variation_settings`.

The only place this is used it is used with value_or so there's no need
to return it is an `Optional`.

This is only used for loading fonts (which occurs during style
computation) so there's no need to store it in `ComputedValues`
2025-12-05 10:03:15 +00:00
Sam Atkins
d717dd64b3 LibWeb: Make Animation's owning element an AbstractElement
From the spec:
> The owning element of a transition refers to the element or
  pseudo-element to which the transition-property property was applied
  that generated the animation.

https://drafts.csswg.org/css-transitions-2/#owning-element

Previously we only stored the element.
2025-12-03 13:29:51 +01:00
Sam Atkins
b61c857c64 LibWeb/CSS: Use AbstractElement animation helpers 2025-12-03 13:29:51 +01:00
Callum Law
e935dfbf5b LibWeb: Simplify compute_style_value_list 2025-12-02 12:47:10 +00:00
Callum Law
4034ce995a LibWeb: Account for transition-{delay,duration} always being a list
This fixes the optimization implemented in 46acdbd that was no longer
working after e937f5d
2025-12-02 11:45:46 +00:00
Sam Atkins
d9abfdf2ab LibWeb/CSS: Allow non-StyleValueLists in animation properties
Reverts 51f694c6af and
b52beb5105.

The animation-* properties are in an awkward place currently, where
they *should* be lists, and a lot of our code acts as if they are, but
actually we parse them as single values. The above commits caused a few
WPT tests to crash - see link below. I've imported one of them to
prevent future regressions.
https://wpt.fyi/results/css/css-typed-om/the-stylepropertymap/properties?diff&filter=ADC&run_id=6293362870321152&run_id=5123272984494080
2025-12-02 09:48:32 +00:00