Commit graph

347 commits

Author SHA1 Message Date
Sam Atkins
385c3d273a LibWeb/CSS: Update CalculatedOr API to use CalculationResolutionContext
To be properly compatible with calc(), the resolved() methods all need:
- A length resolution context
- To return an Optional, as the calculation might not be resolvable

A bonus of this is that we can get rid of the overloads of `resolved()`
as they now all behave the same way.

A downside is a scattering of `value_or()` wherever these are used. It
might be the case that all unresolvable calculations have been rejected
before this point, but I'm not confident, and so I'll leave it like
this for now.
2025-01-30 19:31:54 +01:00
Sam Atkins
1d71662f31 LibWeb/CSS: Wrap calc()-resolution data in a struct
Initially I added this to the existing CalculationContext, but in
reality, we have some data at parse-time and different data at
resolve-time, so it made more sense to keep those separate.

Instead of needing a variety of methods for resolving a Foo, depending
on whether we have a Layout::Node available, or a percentage basis, or
a length resolution context... put those in a
CalculationResolutionContext, and just pass that one thing to these
methods. This also removes the need for separate resolve_*_percentage()
methods, because we can just pass the percentage basis in to the regular
resolve_foo() method.

This also corrects the issue that *any* calculation may need to resolve
lengths, but we previously only passed a length resolution context to
specific types in some situations. Now, they can all have one available,
though it's up to the caller to provide it.
2025-01-30 19:31:54 +01:00
Andreas Kling
ad9d9bb684 LibWeb: Ensure size constraints apply to non-BFC-root abspos boxes
BFC roots behave differently in that their height is computed twice,
before and after inside layout, since automatic height depends on the
results of inside layout. Other formatting contexts only require the
"before" pass, and so we can treat their content sizes as definite
before proceeding with inside layout.

This makes https://play.tailwind.com/ look beautiful. :^)
2025-01-30 19:31:07 +01:00
Psychpsyo
67ed676831 LibWeb: Implement CSS 'contain' property 2025-01-28 11:24:40 +00:00
Jelle Raaijmakers
e8bc6e9e8e LibWeb: Set float Y offset using margin box bottom instead of height
When positioning floats against an edge, we are taking all current
relevant floats at that side into account to determine the Y offset at
which to place the new float. However, we were using the margin box
height instead of the absolute bottom position, which disregards the
current float's Y-position within the root, and we were setting the Y
offset to that height, instead of taking the new float's Y position
inside of the root into account.

The new code determines the lowest margin bottom value within the root
of the current floats, and adds the difference between that value and
the new float's Y position to the Y offset.
2025-01-28 01:12:23 +01:00
Jelle Raaijmakers
0cfc7f2c8a LibWeb: Move LayoutState::set_content_* methods inline
I see no good reason to keep them out of line, and having the methods
named differently than the property they're updating caused me some
confusion initially.
2025-01-28 01:12:23 +01:00
Jelle Raaijmakers
336684bc5c LibWeb: Support inserting non-inline elements into inline elements
Our layout tree requires that all containers either have inline or
non-inline children. In order to support the layout of non-inline
elements inside inline elements, we need to do a bit of tree
restructuring. It effectively simulates temporarily closing all inline
nodes, appending the block element, and resumes appending to the last
open inline node.

The acid1.txt expectation needed to be updated to reflect the fact that
we now hoist its <p> elements out of the inline <form> they were in.
Visually, the before and after situations for acid1.html are identical.
2025-01-23 09:33:10 +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
Gingeh
f3f1db7725 LibWeb: Cache the margin box rect for floating boxes 2025-01-21 21:06:55 +01:00
Timothy Flynn
85b424464a AK+Everywhere: Rename verify_cast to as
Follow-up to fc20e61e72.
2025-01-21 11:34:06 -05:00
InvalidUsernameException
de71eb9b13 LibWeb: Accept TableWrapper as containing block for abspos items
When an element is displayed as table, an anonymous table wrapper box
needs to be created for it. Among others, the position property of the
table element is then applied to the anonymous table wrapper box
instead. If the table happens to be positioned absolutely, the table
wrapper box may become the containing block for absolutely positioned
elements inside the table.

In the original code however, anonymous layout nodes were excluded from
becoming the containing block for an absolutely positioned element.
Because of this, the containing block was calculated to be the first
suitable parent block of the table wrapper box.

This incorrect containing block would result in a crash later on when
trying to size the absolutely positioned element inside the table. To
prevent this crash, the anonymous table wrapper box is now allowed to
become the containing block for absolutely positioned elements inside
a table.

The definition of containing block for an absolutely positioned element
in the spec does not mention anything about skipping anonymous boxes.
Additionally the rules for absolute positioning of tables
(https://www.w3.org/TR/css-tables-3/#abspos-boxes-in-table-root) imply
that a table wrapper box is indeed able to be the containing block for
absolutely positioned elements.
2025-01-21 15:24:05 +01:00
Andreas Kling
7ae46bf8b7 LibWeb: Allow partial update of SVG subtrees in layout tree
We were incorrectly always appending to the nearest ancestor in the
partial update case, even when the node was eligible for replacement.
2025-01-21 00:08:25 +01:00
Andreas Kling
c01d810e5a LibWeb: Implement partial layout tree updates
DOM nodes now have two additional flags:

- Needs layout tree update
- Child needs layout tree update

These work similarly to the needs-style-update flags, but instead signal
the need to rebuild the corresponding part of the layout tree.

When a specific DOM node needs a layout tree update, we try to create
a new subtree starting at that node, and then replace the subtree in the
old layout tree with the newly created subtree.

This required some refactoring in TreeBuilder so that we can skip over
entire subtrees during a tree update.

Note that no partial updates happen yet (as of this commit) since we
always invalidate the full layout tree still. That will change in the
next commit.
2025-01-18 21:01:01 +01:00
Andreas Kling
b41a490e40 LibWeb: Don't (anonymously) wrap table boxes that are already wrapped
Instead just update the existing wrapper with computed values from the
table box, to insure that upside-down "inheritance" works as expected.

This allows table fixup to run on partially updated layout trees without
adding a new layer of unnecessary wrappers every time.
2025-01-18 21:01:01 +01:00
Sam Atkins
b3b9eea986 LibWeb/CSS: Merge RotationStyleValue into TransformationStyleValue
Same again, although rotation is more complicated: `rotate`
is "equivalent to" multiple different transform function depending on
its arguments. So we can parse as one of those instead of the full
`rotate3d()`, but then need to handle this when serializing.
2025-01-17 10:12:39 +01:00
aplefull
50445dc9ef LibWeb: Don't add extra gap when placing flex items in reverse order 2025-01-17 10:10:43 +01:00
Psychpsyo
7757df5bb5 LibWeb: Implement CSS 'isolation' property 2025-01-13 11:07:55 +00:00
Psychpsyo
9370990ff2 LibWeb: Implement user-select
This implements all values of user-select.
2025-01-08 14:37:28 +00:00
Gingeh
df70455d3f LibWeb: Implement the color-scheme meta tag name 2025-01-08 11:18:13 +00:00
Gingeh
ce5cd012b9 LibWeb/CSS: Implement the color-scheme CSS property 2025-01-08 11:18:13 +00:00
Psychpsyo
8632ce5cdd LibWeb: Hide audio element when controls is not set
When an audio element has no controls attribute,
it should not render at all and take up no space.
2025-01-04 11:47:09 +00:00
Aliaksandr Kalenik
0b8b690f92 LibWeb+LibWebView: Allow to specify default font size in FontPlugin
Instead of always assuming 12pt size for default font, explicitly pass
it as a parameter.
2025-01-02 10:47:21 +01:00
Timothy Flynn
27478ec7d4 Everywhere: Run clang-format
The following command was used to clang-format these files:

    clang-format-19 -i $(find . \
        -not \( -path "./\.*" -prune \) \
        -not \( -path "./Build/*" -prune \) \
        -not \( -path "./Toolchain/*" -prune \) \
        -type f -name "*.cpp" -o -name "*.mm" -o -name "*.h")
2024-12-28 05:39:32 -08:00
Andreas Kling
74469a0c1f LibWeb: Make CSS::ComputedProperties GC-allocated 2024-12-22 10:12:49 +01:00
Andreas Kling
c1cad8fa0e LibWeb: Rename CSS::StyleProperties => CSS::ComputedProperties
Now that StyleProperties is only used to hold computed properties, let's
name it ComputedProperties.
2024-12-22 10:12:49 +01:00
Jelle Raaijmakers
4d9f17eddf LibGfx+LibWeb: Draw glyph runs with subpixel accuracy
This improves the quality of our font rendering, especially when
animations are involved. Relevant changes:

  * Skia fonts have their subpixel flag set, which means that individual
    glyphs are rendered at subpixel offsets causing glyph runs as a
    whole to look better.

  * Fragment offsets are no longer rounded to whole device pixels, and
    instead the floating point offset is kept. This allows us to pass
    through the floating point baseline position all the way to the Skia
    calls, which already expected that to be a float position.

The `scrollable-contains-table.html` ref test needed different table
headings since they would slightly inflate the column size in the test
file, but not the reference.
2024-12-21 23:09:52 +01:00
Sam Atkins
69a0f28d04 Revert "LibWeb/CSS: Rename CalculatedStyleValue -> CSSMathValue"
This reverts commit 76daba3069.

We're going to need separate types for the JS-exposed style values, so
it doesn't make sense for us to match their names with our internal
types.
2024-12-21 18:14:28 +01:00
Lucien Fiorini
9fd1223992 LibWeb+LibGfx: Refactor CSS filters into LibGfx
CSS filters work similarly to canvas filters, so it makes sense to have
Gfx::Filter that can be used by both libraries in an analogous way
as Gfx::Color.
2024-12-18 18:54:20 +01:00
Johan Dahlin
083f4f3d08 LibWeb: Layout/Shape font-variant-* css properties 2024-12-17 19:07:13 +01:00
Manuel Zahariev
f5e01192cc LibWeb: Layout standalone SVG document with specified dimensions
Before, standalone SVG documents were stretched to fit the agent
viewport.
2024-12-13 15:02:49 +00:00
Gingeh
84150f972f LibWeb: Properly serialize position/edge style values 2024-12-13 11:35:38 +00:00
Sam Atkins
ebc91686b5 LibWeb/Layout: Add FIXMEs where we're using the wrong font
It's not clear how to address these right now, so add a FIXME to make
them easier to find and address later.
2024-12-06 02:57:34 +01:00
Sam Atkins
3782975718 LibWeb/Layout: Use GlyphRun font to measure trimmed whitespace 2024-12-06 02:57:34 +01:00
Psychpsyo
0320494c3f LibWeb: Remove non-spec condition in scrollable overflow calculation 2024-12-04 17:14:10 +00:00
Christoffer Sandberg
879af72850 LibWeb: Improve painting of nested inline elements
PaintableWithLines created from inline nodes need to examine their
children to fully compute their size and offset as nested children
might have textnodes that are placed before their parent.

Fixes #1286
2024-12-04 11:23:54 +00:00
Aliaksandr Kalenik
bfdf52701f LibWeb: Treat min{max}-height as none if available is intrinsic [GFC]
Fixes infinite recursion in following cases:
- max-height: fit-content
- max-height: min-content
- max-height: max-content
2024-12-03 23:10:08 +01:00
Milo van der Tier
2ee7e555f2 LibWeb/CSS: Do not ignore self-start/self-end alignment in flex layout
This makes these values the same as `start` and `end`. While this is not
entirely correct, it is better than centering which is what we did
previously.

This fixes misaligned images on https://nos.nl
2024-12-03 00:17:53 +01:00
stasoid
a90b7026fb LibWeb/Layout: Account for box-sizing in table width/height calculations
Fixes #1726

Fixes
wpt/css/CSS2/abspos/abspos-containing-block-initial-004c.xht
wpt/css/CSS2/abspos/abspos-containing-block-initial-004d.xht
wpt/css/CSS2/abspos/abspos-containing-block-initial-005b.xht
wpt/css/CSS2/abspos/abspos-containing-block-initial-005d.xht
2024-11-29 15:43:59 +01:00
Kostya Farber
81f8866606 LibWeb: Lay out the fieldset's rendered legend 2024-11-29 12:36:52 +00:00
Andreas Kling
a74954e145 LibWeb: Don't treat auto insets as definite for child of abspos element
This fixes an issue where the welcome screen wasn't showing up the first
time you visit https://puter.com/ :^)
2024-11-27 22:55:14 +01:00
Andreas Kling
a7b791050e LibWeb: Only negotiate NavigableContainerViewport size with objects
Size negotiation should not occur for other viewports, such as iframe,
since that would allow content inside the iframe to affect the size of
the iframe in the containing document.

300 new subtest passes on WPT. :^)
2024-11-27 14:47:05 +01:00
Andreas Kling
733c6b14ff LibWeb: Teach HTMLObjectElement to negotiate natural size with SVGs
We do this by generalizing the code previously used for SVGSVGBox into
something that can be used for NavigableViewportContainer as well.
2024-11-26 18:32:48 +01:00
Andreas Kling
dd7623eb30 LibWeb: Rename NestedBrowsingContextP => NavigableContainerViewportP
...where P is for Paintable :^)
2024-11-26 18:32:48 +01:00
Andreas Kling
11d966f3ba LibWeb: Make NavigableContainerViewport always have a NavigableContainer
Let's not limit this to only corresponding to an HTMLIFrameElement.
2024-11-26 18:32:48 +01:00
Andreas Kling
443a8539e9 LibWeb: Rename Layout::FrameBox => NavigableContainerViewport 2024-11-26 18:32:48 +01:00
Pavel Shliak
af9d855b70 LibGfx: Delete DeprecatedPath 2024-11-25 21:13:53 +01:00
Jeremia Dominguez
eafa70331d LibWeb/Layout: Simplified margin collapsing
Rather than accumulating margins into a vector, and then looping through
them when resolving the margin, it's much simpler to just update two
fields, and sum them when resolving.
2024-11-24 14:45:28 +01:00
Psychpsyo
1d44df74f7 LibWeb: Stop zero-area children from causing scrollable overflow 2024-11-24 11:10:47 +01:00
Andreas Kling
d3ee49b092 LibWeb: Avoid an infinite recursion in replaced element sizing
In the case where we had a preferred aspect ratio and a natural height
but no natural width, we'd get into ping-ponging infinite recursion by
trying to find the width to resolve the height to resolve the width to
resolve the height...
2024-11-23 16:39:45 +01:00
Psychpsyo
e2b2115722 LibWeb: Fix spec link in FlexFormattingContext 2024-11-23 01:37:32 +00:00