Previously, we set the "needs style update" flag to false at the
beginning of recomputing the style. This meant that if any code within
the cascade set this flag to true, then we would end style computation
thinking the element still needed its style updating. This could occur
when starting a transition, and would make TreeBuilder crash.
By ensuring that we always set the flag to false at the very end of
style computation, this is avoided, along with any similar issues - I
noticed a comment in `Animation::cancel()` which sounds like a
workaround was needed for a similar problem previously.
(cherry picked from commit 8c79edac085ee164aca5ca7cf287e68e93e03217)
I believe this is slightly less confusing, since what the function does
is trigger a full layout tree *rebuild*, not just a relayout.
(cherry picked from commit aa8f17aea4d1aa1950a66969fc8b5c431fbc1b7c)
I previously believed there was no way a detached document should have
layout information, but it turns out there is a way: getComputedStyle().
So we need to account for cases where we have a layout node, but no
navigable, since that is a state we can get into at this moment.
Fixes#354
(cherry picked from commit 1e7b17f15024d0618f1a1e17e3e927856febde28)
When setting an element attribute to the value it already had, we don't
need to update style or invalidate anything that depends on the DOM
version counter.
This was a source of much pointless busywork.
(cherry picked from commit 7df4365e405410bff267644e0a5c1d7b3d76faac)
You can now build with STYLE_INVALIDATION_DEBUG and get a debug stream
of reasons why style invalidations are happening and where.
I've rewritten this code many times, so instead of throwing it away once
again, I figured we should at least have it behind a flag.
(cherry picked from commit ddbfac38b0074819470766846fca08fd78630eb0;
minorly amended for conflicts in AK/Debug.h.in and
Meta/CMake/all_the_debug_macros.cmake due to us having more debug
macros. Also, downstream got alphabetical order for
STYLE_INVALIDATION_DEBUG wrong.)
Before this change, we would go through every known pseudo element and
compute style for it whenever recomputing the style of an element.
This led to disastrous performance on pages with selectors like
`::selection` or `::placeholder`, as they'd effectively match every
single element and thus we'd compute multiple additional styles for
every element in the DOM.
The fix is simple: only recompute `before` and `after` pseudo element
styles, since those are the only two pseudo elements that generate
*new* nodes -- other pseudo elements refer to (possibly) existing
nodes or concepts within the DOM (or internal shadow DOM).
This makes style updates take ~40ms on our GitHub repo instead of
~220ms. It's still slower than it should be, but a huge improvement.
(cherry picked from commit 62083bf586a816eea61db4a09a60cc6474585444)
This also fixes a bug where task IDs were being deallocated from the
wrong IDAllocator. I don't know if it was actually possible to cause any
real trouble with that mistake, nor do I know how to write a test for
it, but this makes the bug go away.
(cherry picked from commit 08d60d7521915b4f73fd3bb40a1aa159f4f31eb1)
For a long time, we've used two terms, inconsistently:
- "Identifier" is a spec term, but refers to a sequence of alphanumeric
characters, which may or may not be a keyword. (Keywords are a
subset of all identifiers.)
- "ValueID" is entirely non-spec, and is directly called a "keyword" in
the CSS specs.
So to avoid confusion as much as possible, let's align with the spec
terminology. I've attempted to change variable names as well, but
obviously we use Keywords in a lot of places in LibWeb and so I may
have missed some.
One exception is that I've not renamed "valid-identifiers" in
Properties.json... I'd like to combine that and the "valid-types" array
together eventually, so there's no benefit to doing an extra rename
now.
(cherry picked from commit 6a74b0164423d63904cf5a5b594772b595f57600;
very minorly amended to fix conflict in GenerateCSSKeyword.cpp caused
by #22870, and in libweb_generators.cmake due to us not having
https://github.com/LadybirdBrowser/ladybird/pull/741)
This also now uses the cached computed style for them, instead of
computing it fresh each time.
(cherry picked from commit 4ec39681784d6225c5d58655a978b3b08171c7ba)
If a DOM node is an element with pseudo-elements, but it has no child
DOM nodes and is not a shadow host, then the code that serializes its
pseudo-elements would get skipped, making them not show up in the
inspector.
(cherry picked from commit 173daec9db357cc2a16be0238d371e0b7660cd4c)
We were already guaranteed to return a NodeWithStyle from
`create_layout_node_for_display_type()`, so make use of that knowledge.
(cherry picked from commit 521cd161a8317fadc932cb9ad1fe5d8d137c6079)
Previously, pseudo-elements had their style computed while the layout
tree was being built. Instead, do so inside Element::recompute_style(),
using the same invalidation mechanism that the element itself uses.
This also has the effect of invalidating the layout much less often.
(cherry picked from commit 3abd3ef5e2b7c35068058a58034f70ae843cec45)
Pseudo-elements' style is only computed while building the layout tree.
This meant that previously, they would not have their style recomputed
in some cases. (Such as when :hover is applied to an ancestor.)
Now, when recomputing an element's style, we also return a full
invalidation if one or more pseudo-elements would exist either before or
after style recomputation.
This heuristic produces some false positives, but no false negatives.
Because pseudo-elements' style is computed during layout building, any
computation done here is then thrown away. So this approach minimises
the amount of wasted style computation. Plus it's simple, until we have
data on what approach would be faster.
This fixes the Acid2 nose becoming blue when the .nose div is hovered.
(cherry picked from commit 7daf5cdaff0fa1bba211ad40eadca5a0a52437ad)
Rather than maintain two dynamically-allocated arrays of data for
pseudo-elements, put them in a single array, which is easier to manage.
(cherry picked from commit f23f0721bd878977f6c1f5974983596fe8944b36)
We were saving to source declarations for *every* property, even though
we only ever looked it up for animation-name.
This patch gets rid of the per-property source pointer and we now keep
a single pointer to the animation-name source only.
This shrinks StyleProperties from 6512 bytes to 4368 bytes per instance.
(cherry picked from commit c288bfb40453d4abe95af694dfc7c2175cd04a14)
These control the state of CSS counters.
Parsing code for `reversed(counter-name)` is implemented, but disabled
for now until we are able to resolve values for those.
(cherry picked from commit 017d6c3314d57d4e351764f328c1d25dbc9d033a)
This represents each element's set of CSS counters.
https://drafts.csswg.org/css-lists-3/#css-counters-set
Counters are resolved while building the tree. Most elements will not
have any counters to keep track of, so as an optimization, we don't
create a CountersSet object until the element actually needs one.
In order to properly support counters on pseudo-elements, the
CountersSet needs to go somewhere else. However, my experiments with
placing it on the Layout::Node kept hitting a wall. For now, this is
fairly simple at least.
(cherry picked from commit 708f49d906389f8875f006894e2aacf2305834bf)
The :host family of pseudo class selectors select the shadow host
element when matching against a rule from within the element's shadow
tree.
This is a bit convoluted due to the fact that the document-level
StyleComputer keeps track of *all* style rules, and not just the
document-level ones.
In the future, we should refactor style storage so that shadow roots
have their own style scope, and we can simplify a lot of this.
(cherry picked from commit 4c326fc5f6f64797764e7f32a9789b74665f2fec)
Previously, if a document had any element with a name attribute that
was set to the empty string, then `document.getElementsByName("")` and
`element.getElementsByName("")` would return a collection including
those elements.
(cherry picked from commit e40352b6b59e99a9f3fd922142c2abafd9840e6c)
Previously, `document.getElementsByClassName("")` would return a
collection containing all elements in the given document.
(cherry picked from commit 0fceede029e6af0cab98e86f20367d8835008472)
Previously, we had two implementations of the same function in
`Document` and `Element`, which had inadvertantly diverged.
(cherry picked from commit faf64bfb41393a59e958e21545aa556c9bb9d6a8)
Previously, if a document had an element whose id was the empty string,
then `document.getElementById("")` and `element.getElementById("")`
would return that element.
(cherry picked from commit f666d967d6bac289346cf19f833f81bdc22adbdb)
The main intention of this change is to have a consistent look and
behavior across all scrollbars, including elements with
`overflow: scroll` and `overflow: auto`, iframes, and a page.
Before:
- Page's scrollbar is painted by Browser (Qt/AppKit) using the
corresponding UI framework style,
- Both WebContent and Browser know the scroll position offset.
- WebContent uses did_request_scroll_to() IPC call to send updates.
- Browser uses set_viewport_rect() to send updates.
After:
- Page's scrollbar is painted on WebContent side using the same style as
currently used for elements with `overflow: scroll` and
`overflow: auto`. A nice side effects: scrollbars are now painted for
iframes, and page's scrollbar respects scrollbar-width CSS property.
- Only WebContent knows scroll position offset.
- did_request_scroll_to() is no longer used.
- set_viewport_rect() is changed to set_viewport_size().
(cherry picked from commit 5285e22f2aa09152365179865f135e7bc5d254a5)
Co-authored-by: Jamie Mansfield <jmansfield@cadixdev.org>
Co-authored-by: Nico Weber <thakis@chromium.org>
Both Element's and ShadowRoot's setHTMLUnsafe, and Document's static
parseHTMLUnsafe methods are implemented.
(cherry picked from commit ce8d3d17c4f2fcca8fac0ff4a832c8f50a011fc7)
Multiple APIs have moved from the DOM Parsing and Serialization spec to
HTML.
Updates spec URLs and comments.
Delete InnerHTML file:
- Make parse_fragment a member of Element, matching serialize_fragment
on Node.
- Move inner_html_setter inline into Element and ShadowRoot as per the
spec.
Add FIXME to Range.idl for Trusted Types createContextualFragment
(cherry picked from commit 9171c3518358cd2d146ffbd7582e4c1247a1daa7)
And let the old shadow_root(), which was only supposed to be used by
bindings, be called shadow_root_for_bindings() instead.
This makes it much easier to read DOM code, and we don't have to worry
about when to use shadow_root_internal() or why.
(cherry picked from commit f4bdf562127c12a7af18029777a88d4260af82d3)
The bulk of this function is moved to a new "attach a shadow root"
helper, designed to be used both from here and the HTML parser.
(cherry picked from commit 043ad0eb7644a529c1ffbd4de9a4b89771808c84,
and amended to make `is_valid_shadow_host_name()` static.
Previously, we always cast to a HTMLInputElement when getting the value
of an auto directionality form associated element. This caused
undefined behavior when determining the directionality of an element
that wasn't a HTMLInputElement.
