Commit graph

125 commits

Author SHA1 Message Date
Sam Atkins
ffa1dba96a LibWeb: Generate pseudo-element code from JSON
Initially, this generates the enum and to/from-string functions. The
JSON itself contains more data than that, but it's unused for now.
2025-03-24 09:49:50 +00:00
Sam Atkins
0ed2e71801 LibWeb/CSS: Move and rename PseudoElement types to prep for code gen
The upcoming generated types will match those for pseudo-classes: A
PseudoElementSelector type, that then holds a PseudoElement enum
defining what it is. That enum will be at the top level in the Web::CSS
namespace.

In order to keep the diffs clearer, this commit renames and moves the
types, and then a following one will replace the handwritten enum with
a generated one.
2025-03-24 09:49:50 +00:00
Noah
add380d6e2 LibWeb: Update Element::directionality() for bdi elements to match spec
Some checks are pending
CI / Lagom (arm64, Sanitizer_CI, false, macos-15, macOS, Clang) (push) Waiting to run
CI / Lagom (x86_64, Fuzzers_CI, false, ubuntu-24.04, Linux, Clang) (push) Waiting to run
CI / Lagom (x86_64, Sanitizer_CI, false, ubuntu-24.04, Linux, GNU) (push) Waiting to run
CI / Lagom (x86_64, Sanitizer_CI, true, ubuntu-24.04, Linux, Clang) (push) Waiting to run
Package the js repl as a binary artifact / build-and-package (macos-14, macOS, macOS-universal2) (push) Waiting to run
Package the js repl as a binary artifact / build-and-package (ubuntu-24.04, Linux, Linux-x86_64) (push) Waiting to run
Run test262 and test-wasm / run_and_update_results (push) Waiting to run
Lint Code / lint (push) Waiting to run
Label PRs with merge conflicts / auto-labeler (push) Waiting to run
Push notes / build (push) Waiting to run
This fixes three WPT test cases at html/dom/elements/global-attributes/dir-assorted.window.html

Update test expectations for Tests/LibWeb/Text/expected/wpt-import/css/selectors/dir-pseudo-on-bdi-element.txt
2025-03-23 09:58:42 +01:00
Andreas Kling
f0abf5a43b LibWeb: Avoid allocating DOMRect objects for internal engine use
Some checks failed
CI / Lagom (arm64, Sanitizer_CI, false, macos-15, macOS, Clang) (push) Waiting to run
CI / Lagom (x86_64, Fuzzers_CI, false, ubuntu-24.04, Linux, Clang) (push) Waiting to run
CI / Lagom (x86_64, Sanitizer_CI, false, ubuntu-24.04, Linux, GNU) (push) Waiting to run
CI / Lagom (x86_64, Sanitizer_CI, true, ubuntu-24.04, Linux, Clang) (push) Waiting to run
Package the js repl as a binary artifact / build-and-package (macos-14, macOS, macOS-universal2) (push) Waiting to run
Package the js repl as a binary artifact / build-and-package (ubuntu-24.04, Linux, Linux-x86_64) (push) Waiting to run
Run test262 and test-wasm / run_and_update_results (push) Waiting to run
Lint Code / lint (push) Waiting to run
Label PRs with merge conflicts / auto-labeler (push) Waiting to run
Push notes / build (push) Waiting to run
Build Dev Container Image / build (push) Has been cancelled
Instead of bothering the GC heap with a bunch of DOMRect allocations,
we can just pass around CSSPixelRect internally in many cases.

Before this change, we were generating so much DOMRect garbage that
we had to do a garbage collection *every frame* on the Immich demo.
This was due to the large number of intersection observers checked.

We still need to relax way more when idle, but for comparison, before
this change, when doing nothing for 10 seconds on Immich, we'd spend
2.5 seconds updating intersection observers. After this change, we now
spend 600 ms.
2025-03-22 14:33:59 -05:00
Sam Atkins
2d220a8bbc LibWeb: Return CSSStyleProperties as a GC::Ref 2025-03-19 13:53:00 +00:00
Sam Atkins
83bb92c4e0 LibWeb/CSS: Merge style declaration subclasses into CSSStyleProperties
We previously had PropertyOwningCSSStyleDeclaration and
ResolvedCSSStyleDeclaration, representing the current style properties
and resolved style respectively. Both of these were the
CSSStyleDeclaration type in the CSSOM. (We also had
ElementInlineCSSStyleDeclaration but I removed that in a previous
commit.)

In the meantime, the spec has changed so that these should now be a new
CSSStyleProperties type in the CSSOM. Also, we need to subclass
CSSStyleDeclaration for things like CSSFontFaceRule's list of
descriptors, which means it wouldn't hold style properties.

So, this commit does the fairly messy work of combining these two types
into a new CSSStyleProperties class. A lot of what previously was done
as separate methods in the two classes, now follows the spec steps of
"if the readonly flag is set, do X" instead, which is hopefully easier
to follow too.

There is still some functionality in CSSStyleDeclaration that belongs in
CSSStyleProperties, but I'll do that next. To avoid a huge diff for
"CSSStyleDeclaration-all-supported-properties-and-default-values.txt"
both here and in the following commit, we don't apply the (currently
empty) CSSStyleProperties prototype yet.
2025-03-19 13:53:00 +00:00
Sam Atkins
687d32b712 LibWeb: Remove ElementInlineCSSStyleDeclaration entirely
All of its behavior has now been moved up into its parent classes.
2025-03-19 13:53:00 +00:00
Sam Atkins
50455c2f5e LibWeb: Stop constructing temporary ElementInlineCSSStyleDeclarations
Previously, parse_css_style_attribute() would parse the string, extract
the properties, add them to a newly-created
ElementInlineCSSStyleDeclarations, and then user code would take the
properties back out of it again and throw it away. Instead, just return
the list of properties, and the caller can create an EICSD if it needs
one.
2025-03-19 13:53:00 +00:00
Kevin Mas Ruiz
fa950a5727 LibWeb: Invalidate element with CSS custom props on attribute changes
Element styles should be invalidated when they depend on CSS variables
defined in one of their ancesors or when one of their ancestors change
their class, due to the possibility of adding new CSS variables in
scope.
2025-03-13 19:20:37 +01:00
Aliaksandr Kalenik
84ecaaa75c LibWeb: Limit sibling style invalidation by max distance
If an element is affected only by selectors using the direct sibling
combinator `+`, we can calculate the maximum invalidation distance and
use it to limit style invalidation. For example, the selector
`.a + .b + .c` has a maximum invalidation distance of 2, meaning we can
skip invalidating any element affected by this selector if it's more
than two siblings away from the element that triggered the style
invalidation.

This change results in visible performance improvement when hovering
PR list on GitHub.
2025-03-10 18:56:55 +01:00
Andreas Kling
c333042e63 LibWeb: Add opt-in tracing of update_layout() calls with reason 2025-03-08 03:37:38 +01:00
Andreas Kling
02a642b87b LibWeb: Prevent infinitely growing font size due to rem units in root
A font-size with rem units need to resolve against the default font
metrics for the root element, otherwise every time we compute style,
the reference value for rem units grows.

This fixes an issue where text on some web pages would grow every time
there was a relayout. This was very noticeable on https://proton.me/

Fixes #339
2025-03-05 22:46:06 +01:00
Aliaksandr Kalenik
b92a8553c7 LibWeb: Cancel animations when element is moved in display none subtree
We already have logic to play or cancel animations in an element's
subtree when the display property changes to or from none. However,
this was not sufficient to cover the case when an element starts/stops
being nested in display none after insertion.
2025-03-04 18:06:46 +01:00
Sam Atkins
f148af0a93 LibWeb: Move XMLSerializer into HTML directory
The DOMParsing spec is in the process of being merged into the HTML one,
gradually. The linked spec change moves XMLSerializer, but many of the
algorithms are still in the DOMParsing spec so I've left the links to
those alone.

I've done my best to update the GN build but since I'm not actually
using it, I might have done that wrong.

Corresponds to 2edb8cc7ee
2025-03-04 16:44:41 +00:00
Andreas Kling
12f5e9c5f8 LibWeb: Only put connected elements into document's by-name-or-id cache
This fixes an issue where disconnected elements were incorrectly
accessible as named properties on the document.
2025-03-04 00:51:50 +01:00
Glenn Skrzypczak
0750513993 LibWeb: Support reversed ordered lists
Some checks are pending
CI / Lagom (false, NO_FUZZ, macos-15, macOS, Clang) (push) Waiting to run
CI / Lagom (false, NO_FUZZ, ubuntu-24.04, Linux, GNU) (push) Waiting to run
CI / Lagom (true, NO_FUZZ, ubuntu-24.04, Linux, Clang) (push) Waiting to run
CI / Lagom (false, FUZZ, ubuntu-24.04, Linux, Clang) (push) Waiting to run
Package the js repl as a binary artifact / build-and-package (macos-14, macOS, macOS-universal2) (push) Waiting to run
Package the js repl as a binary artifact / build-and-package (ubuntu-24.04, Linux, Linux-x86_64) (push) Waiting to run
Run test262 and test-wasm / run_and_update_results (push) Waiting to run
Lint Code / lint (push) Waiting to run
Label PRs with merge conflicts / auto-labeler (push) Waiting to run
Push notes / build (push) Waiting to run
This PR adds support for the `reversed` attribute of
ordered lists.
2025-02-21 04:23:28 +00:00
Piotr
c9edb6ffc4 LibWeb: Support for Content-Language HTTP header 2025-02-19 10:53:31 +00:00
Aliaksandr Kalenik
93253e993b LibWeb: Fix invalidations calculation for values with relative units
...in inherited style update. Instead of comparing old absolutized value
with new non-absolutized value, we should wait until
`absolutize_values()` and then compare old and new values, when both are
absolutized.

Improves performance on pages with GitHub action logs where previously
we had to invalidate layout after hover style recalculation, because
there was `margin-left: 1rem`.
2025-02-18 00:24:45 +01:00
Aliaksandr Kalenik
1e07227e98 LibWeb: Early return when invalidations=none in inherited style update
This allows to skip a bunch of unnecessary work performed by
`apply_style()`.
2025-02-18 00:24:45 +01:00
Aliaksandr Kalenik
e5b4fe2c65 LibWeb: Fix wrong invalidations calculation in inherited style update
We were incorrectly comparing new value against itself instead of the
old value to determine required set of invalidations.
2025-02-18 00:24:45 +01:00
Gingeh
bc0729f5d2 LibWeb: Create a BlockContainer for 'block ruby' elements
Prevents the layout engine from crashing.
(and unlocks ~200 new subtests)
2025-02-16 19:40:07 +00:00
Aliaksandr Kalenik
327dc8e82a LibWeb: Avoid full tree traversal for non-subject :has() invalidation
Instead of checking all elements in a document for containment in
`:has()` invalidation set, we could narrow this down to ancestors and
ancestor siblings, like we already do for subject `:has()` invalidation.

This change brings great improvement on GitHub that has selectors with
non-subject `:has()` and sibling combinators (e.g., `.a:has(.b) ~ .c`)
which prior to this change meant style invalidation for whole document.
2025-02-13 16:24:51 +01:00
Sam Atkins
29d5eda02d LibWeb/DOM: Add container option to scrollIntoView options
Corresponds to https://github.com/w3c/csswg-drafts/pull/11673 , with the
addition of the fixes in https://github.com/w3c/csswg-drafts/pull/11701
2025-02-12 22:08:17 +01:00
Sam Atkins
49b505e4ae LibWeb/DOM: Cache computed style for ::marker
This allows us to inspect its properties. To avoid wasted work, we only
compute and cache the properties if the originating element was, or is,
displaying as a list item.
2025-02-12 13:48:53 +00:00
Aliaksandr Kalenik
adc17c3576 LibWeb: Deduplicate code for pseudo class selector matching
Moves pseudo class matching helpers into Element methods, so they don't
have to be duplicated between SelectorEngine and function that checks if
element is included in invalidation set.
2025-02-10 01:26:47 +01:00
Andreas Kling
5f10f8c54c LibWeb: Do includes_properties_from_invalidation_set() for :link & co
Fixes #3511.
2025-02-09 15:20:53 +01:00
Aliaksandr Kalenik
a6bea99959 LibWeb: Use invalidation sets for :defined style invalidation 2025-02-06 20:07:11 +01:00
Aliaksandr Kalenik
61c952fb43 LibWeb: Optimize style invalidation caused by DOM structural changes
With this change, siblings of an inserted node are no longer invalidated
unless the insertion could potentially affect their style. By
"potentially affected," we mean elements that are evaluated against the
following selectors during matching:
- Sibling combinators (+ or ~)
- Pseudo-classes :first-child and :last-child
- Pseudo-classes :nth-child, :nth-last-child, :nth-of-type, and
  :nth-last-of-type
2025-02-06 20:07:11 +01:00
Sam Atkins
6a4d80b9b6 LibWeb/CSS: Integrate ParsingContext into the Parser
This is not really a context, but more of a set of parameters for
creating a Parser. So, treat it as such: Rename it to ParsingParams,
and store its values and methods directly in the Parser instead of
keeping the ParsingContext around.

This has a nice side-effect of not including DOM/Document.h everywhere
that needs a Parser.
2025-02-06 16:47:25 +00:00
Sam Atkins
ca5dee4c55 LibWeb/CSS: Remove an unnecessary ParsingContext constructor
Anywhere we have a Node, we have a Document. So just use that.
2025-02-06 16:47:25 +00:00
Psychpsyo
9b8120d8e8 Meta: Disallow links to single-page HTML spec 2025-02-05 16:04:50 -07:00
Sam Atkins
4cb2063577 LibWeb/CSS: Stop returning Optional for enum properties
While keyword_to_foo() does return Optional<Foo>, in practice the
invalid keywords get rejected at parse-time, so we don't have to worry
about them here. This simplifies the user code quite a bit.
2025-02-05 18:12:36 +01:00
Aliaksandr Kalenik
0cfe90b59e LibWeb: Don't allow "display: none" start CSS animations
This is both a correctness fix and a performance optimization.
2025-02-01 13:42:00 +01:00
Shannon Booth
903c8860f8 LibWeb: Add metadata to children update steps invocation
Currently, this metadata is only provided on the insertion steps,
though I believe it would be useful to extend to the other cases
as well. This metadata can aid in making optimizations for these
steps by providing extra context into the type of change which
was made on the child.
2025-01-30 13:55:40 -07:00
Aliaksandr Kalenik
d762d16938 LibWeb: Use invalidation sets for :has() invalidation
Prior to this change, we invalidated all elements in the document if it
used any selectors with :has(). This change aims to improve that by
applying a combination of techniques:
- Collect metadata for each element if it was matched against a selector
  with :has() in the subject position. This is needed to invalidate all
  elements that could be affected by selectors like `div:has(.a:empty)`
  because they are not covered by the invalidation sets.
- Use invalidation sets to invalidate elements that are affected by
  selectors with :has() in a non-subject position.

Selectors like `.a:has(.b) + .c` still cause whole-document invalidation
because invalidation sets cover only descendants, not siblings. As a
result, there is no performance improvement on github.com due to this
limitation. However, youtube.com and discord.com benefit from this
change.
2025-01-29 09:30:18 +01:00
Aliaksandr Kalenik
e33037ad52 LibWeb: Add method to check if element affected by invalidation set
...by replacing existing method to check if an element is affected by
invalidation property. It turned out there is no need to check if an
element is affected only by some specific property, so it's more
convenient to have a method that accepts the whole set.
2025-01-29 09:30:18 +01:00
Aliaksandr Kalenik
d79bb1aac2 LibWeb: Fix underinvalidation when inline style has custom properties
We have an optimization that allows us to invalidate only the style of
the element itself and mark descendants for inherited properties update
when the "style" attribute changes (unless there are any CSS rules that
use the "style" attribute, then we also invalidate all descendants that
might be affected by those rules). This optimization was not taking into
account that when the inline style has custom properties, we also need
to invalidate all descendants whose style might be affected by them.

This change fixes this bug by saving a flag in Element that indicates
whether its style depends on any custom properties and then invalidating
all descendants with this flag set when the "style" attribute changes.
Unlike font relative lengths invalidation, for elements that depend on
custom properties, we need to actually recompute the style, instead of
individual properties, because values without expanded custom properties
are gone after cascading, and it has to be done again.

The test added for this change is a version of an existing test we had
restructured such that it doesn't trigger aggressive style invalidation
caused by DOM structured changes until the last moment when test results
are printed.
2025-01-28 11:38:06 +00:00
Psychpsyo
67ed676831 LibWeb: Implement CSS 'contain' property 2025-01-28 11:24:40 +00:00
Aliaksandr Kalenik
cfe9b7a82b LibWeb: Recompute relative units in Element::recompute_inherited_style()
Properties with relative units has to be recomputed in inherited style
update as they depend on the parent's style.

Fixes https://github.com/LadybirdBrowser/ladybird/issues/3364
2025-01-26 23:10:58 +01:00
Aliaksandr Kalenik
9f75e26385 LibWeb: Add missing handler in affected_by_invalidation_property()
...for :placeholder-shown pseudo-class.
2025-01-26 00:52:38 +01:00
Andreas Kling
4bef0d0aea LibWeb: Don't rebuild rule cache so eagerly to check for :has/:defined
Instead, change the APIs from "has :foo" to "may have :foo" and return
true if we don't have a valid rule cache at the moment.

This allows us to defer the rebuilding of the rule cache until a later
time, for the cost of a wider invalidation at the moment.

Do note that if our rule cache is invalid, the whole document has
invalid style anyway! So this is actually always less work. :^)

Knocks ~1 second of loading time off of https://wpt.fyi/
2025-01-24 17:54:34 +01:00
Andreas Kling
7269fc3e52 LibWeb: Pass old parent's root to Node::removed_from()
This will allow nodes to access the root they've just been removed from.
2025-01-23 21:38:31 +01:00
Jelle Raaijmakers
7eb4f3da37 LibGfx: Add Rect::unite()
The existing `::unite_horizontally()` and `::unite_vertically()` tests
did not properly test the edge cases where left/top in the Rect were
updated, so they get re-arranged a bit.
2025-01-23 09:33:10 +01:00
Aliaksandr Kalenik
c50e89bb73 LibWeb: Don't include changed attribute twice in changed_properties
Changed attribute name is always added into this list right before
`invalidate_style()` is called.
2025-01-21 21:07:47 +01:00
Aliaksandr Kalenik
3c41bdbf92 LibWeb: Optimize style invalidation for presentational hint attributes
Use invalidation sets for presentational hint attribute invalidation
instead of falling back to full descendants and siblings invalidation.
The only difference for presentational hint attributes is that we always
have to invalidate the style of element itself.
2025-01-21 21:07:47 +01:00
Timothy Flynn
85b424464a AK+Everywhere: Rename verify_cast to as
Follow-up to fc20e61e72.
2025-01-21 11:34:06 -05:00
Aliaksandr Kalenik
e0051db62e LibWeb: Use invalidation sets for "style" attribute invalidation 2025-01-20 18:23:34 +01:00
Aliaksandr Kalenik
34bf833a0a LibWeb: Expand invalidation sets usage to any attribute change
Before this change invalidation sets were only used for "class" and "id"
attribute changes.
2025-01-19 19:54:38 +01:00
Aliaksandr Kalenik
039e0d478a LibWeb: Use invalidation sets for id attribute style invalidation 2025-01-19 19:54:38 +01:00
Aliaksandr Kalenik
c5f2a88f69 LibWeb: Use invalidation sets to reduce style recalculation
Implements idea described in
https://docs.google.com/document/d/1vEW86DaeVs4uQzNFI5R-_xS9TcS1Cs_EUsHRSgCHGu8

Invalidation sets are used to reduce the number of elements marked for
style recalculation by collecting metadata from style rules about the
dependencies between properties that could affect an element’s style.

Currently, this optimization is only applied to style invalidation
triggered by class list mutations on an element.
2025-01-19 19:54:38 +01:00