Commit graph

1921 commits

Author SHA1 Message Date
Aliaksandr Kalenik
623e358d7a LibWeb: Remove box argument from FormattingContext::run()
Root formatting context box is passed into constructor and saved in FC,
so it's possible to access it from there instead of passing the same
box into run().
2024-09-11 07:59:52 +02:00
Gingeh
4a3a9e6ec4 LibWeb: Implement justify-*: left/right 2024-09-10 10:40:07 +01:00
Aliaksandr Kalenik
ee41dbfec3 LibWeb: Fix wrong assumption that repeat() is always first track [GFC]
Fixes crashing in
https://wpt.live/css/css-grid/grid-definition/grid-auto-fit-columns-001.html
2024-09-09 22:05:30 +02:00
Aliaksandr Kalenik
68fcc37531 LibWeb: Return used values for grid tracks in getComputedStyle()
That's awkward, but getComputedStyle needs to return used track values
for gridTemplateColumns and gridTemplateRows properties. This change
implements it by saving style values with used values into layout state,
so it could be assigned to paintables during LayoutState::commit() and
later accessed by style_value_for_property().

I haven't seen it used in the wild, but WPT grid tests extensively use
it. For example this change helps to go from 0/10 to 8/10 on this test:
https://wpt.live/css/css-grid/layout-algorithm/grid-fit-content-percentage.html
2024-09-09 12:48:06 +02:00
Aliaksandr Kalenik
4ba38c55d6 LibWeb: Remove unnecessary copying of UsedValues in BFC 2024-09-09 11:41:36 +02:00
Aliaksandr Kalenik
07aa25ce50 LibWeb: Clamp growth limit after adding planned increase in GFC
Fixes implementation of the following line from the spec:
"However, limit the growth of any fit-content() tracks by their
fit-content() argument."

Now we correctly apply a limit to increased growth limit rather than to
the planned increase.

Change in "Tests/LibWeb/Layout/input/grid/fit-content-2.html" is a
progression and "Item as wide as the content." is actually as wide as a
content.
2024-09-09 11:41:10 +02:00
Aliaksandr Kalenik
ec315667f0 LibGfx+LibWeb: Remove DrawEmoji variant in GlyphRun
It was needed to support bitmap emoji rendering but no longer used after
switching to Skia+HarfBuzz for text rendering.
2024-09-06 08:30:30 -04:00
BenJilks
ef037b4152 LibWeb: Use the correct dimension when computing the max grid size
When deciding if the grid containers min size should be limited by a
max size. Check for a max height or width depending on the dimension,
instead of just always checking for a max width.
2024-09-04 22:41:15 +02:00
Andreas Kling
8a6c8a1c27 LibWeb: Propagate text-decoration-* properties to anonymous wrappers
Fixes an issue where old prices were not displayed with strike-through
text on the PlayStation store. :^)
2024-09-03 17:41:05 +02:00
Aliaksandr Kalenik
415ea4ec0c LibWeb: Resolve "position: sticky" insets relative to scrollport
Reading of https://drafts.csswg.org/css-position revealed I was wrong
assuming sticky insets need to be resolved relative to containing block.
2024-09-03 11:34:31 +02:00
BenJilks
46649fbe1b LibWeb: Add support for flex-wrap: wrap-reverse
Reverse the order of flex lines, when the `flex-wrap` property is set to
`wrap-reverse`. This will also swap the cross-start and cross-end
directions.
2024-09-02 17:42:11 +02:00
BenJilks
e2c1fe7255 LibWeb: Only reverse each line of a reverse flex-direction
When a flex container with a reverse `flex-direction` is wrapped. Only
each line should be reversed, not all items.
2024-09-02 17:42:11 +02:00
BenJilks
11e7d72686 LibWeb: Layout text chunks based on their Unicode direction
Append text chunks to either the start or end of the text fragment,
depending on the text direction. The direction is determined by what
script its code points are from.
2024-08-31 11:49:47 +02:00
Aliaksandr Kalenik
7b2042571b LibWeb: Implement missing step in GFC fr size calculation
Implements:
"If the product of the hypothetical fr size and a flexible track’s flex
factor is less than the track’s base size, restart this algorithm
treating all such tracks as inflexible."

Fixes https://github.com/LadybirdBrowser/ladybird/issues/1211
2024-08-31 07:47:20 +02:00
Aliaksandr Kalenik
30b636e90b LibWeb: Add "position: sticky" support
Sticky positioning is implemented by modifying the algorithm for
assigning and refreshing scroll frames. Now, elements with
"position: sticky" are assigned their own scroll frame, and their
position is refreshed independently from regular scroll boxes.
Refreshing the scroll offsets for sticky boxes does not require display
list invalidation.

A separate hash map is used for the scroll frames of sticky boxes. This
is necessary because a single paintable box can have two scroll frames
if it 1) has "position: sticky" and 2) contains scrollable overflow.
2024-08-30 19:03:06 +02:00
Tim Ledbetter
03bbc2b111 LibWeb/SVG: Implement SVGImageElement
This element allows images to be embedded within SVGs.
2024-08-29 06:28:44 +02:00
Andreas Kling
c22acc2551 LibWeb: Implement vertical-align: middle correctly for atomic inlines
This makes inline icons pop into the right place on https://ahrefs.com/
2024-08-26 15:49:07 +02:00
Samuel Fry
23b4367c9c LibWeb: Support parsing column-span 2024-08-26 08:26:22 +01:00
Samuel Fry
c113d3fae9 LibWeb: Support parsing column-width 2024-08-26 08:26:22 +01:00
Andreas Kling
8eacfc8f10 LibWeb: Derive SVG root's natural size from width/height attributes
We were incorrectly looking at the CSS computed values for width and
height to determine the natural size of <svg> root elements.
This meant that elements where the attribute and computed value were
different values would end up with incorrect natural size.
2024-08-22 15:29:29 +02:00
Tim Ledbetter
2c5d626b21 LibWeb: Don't crash when converting small CSS::Ratio to CSSPixelFraction
Previously, a crash would occur in the if `CSSPixelFraction` was given a
denominator value less than the resolution of `CSSPixels` (1/64).

We now divide both parts of the ratio by the denominator in this case.
2024-08-22 13:49:41 +02:00
Andreas Kling
bde2d3dc7b LibWeb: Adjust flex item intrinsic contributions through aspect ratio
When determining the intrinsic cross size contribution of a flex item
with a preferred aspect ratio, we have to account for any min/max
constraints in the main axis.
2024-08-21 13:38:39 +02:00
Andreas Kling
3ed0381a2a LibGfx: Remove unused font code dealing with left-side bearing 2024-08-20 09:30:05 +02:00
Andreas Kling
137038b185 LibWeb: Port painting to use the new Skia-backed Gfx::Path
SVG and and CSS border rendering now sits on top of SkPath instead of
the old Gfx::DeprecatedPath.

Due to an imperceptible (255, 255, 255) vs (255, 254, 255) color diff
in one ref test, I changed that test to not depend on border rendering
for a positive result, since that was incidental.
2024-08-20 09:30:05 +02:00
Andreas Kling
c8f09312f7 LibGfx: Rename Path => DeprecatedPath 2024-08-20 09:30:05 +02:00
BenJilks
0d63269cb7 LibGfx+LibWeb: Use harfbuzz for text shaping
This replaces glyph positioning system with harfbuzz's shaping
algorithm. Adding support for bidirectional encoded text.
2024-08-16 22:28:34 +02:00
Sam Atkins
6a74b01644 LibWeb: Rename "identifier" and "ValueID" to "Keyword" where correct
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.
2024-08-15 13:58:38 +01:00
Sam Atkins
9559f0f123 LibWeb: Rename IdentifierStyleValue -> CSSKeywordValue
This matches the name in the CSS Typed OM spec.
https://drafts.css-houdini.org/css-typed-om-1/#csskeywordvalue
2024-08-15 13:58:38 +01:00
Sam Atkins
0e3487b9ab LibWeb: Rename StyleValue -> CSSStyleValue
This matches the name in the CSS Typed OM spec.
https://drafts.css-houdini.org/css-typed-om-1/#cssstylevalue

No behaviour changes.
2024-08-15 13:58:38 +01:00
BenJilks
1537d589ca LibWeb: Add start and end values to text-align
The `start` and `end` value set the text alignment based on the computed
value of `direction`. The default value of `text-align` is now `start`
instead of `left`.
2024-08-13 15:19:51 +01:00
BenJilks
82989554ab LibWeb: Use reverse direction on flex containers with rtl direction
If a flex container has `direction: rtl` set, reverse the row direction.
2024-08-13 15:19:51 +01:00
Jelle Raaijmakers
7a783d3a89 LibWeb: Account for intrinsic width or height in flex base size
In calculating the base size of a flex item, we have a piece of ad-hoc
code that deals with an item that does have an instrinsic aspect ratio,
but not a cross size to resolve that ratio against. In determining the
actual flex item size however, we also take into account the minimum
content width and height, which assumes the box' intrinsic width or
height when available. This would break having an image as a flex item,
which gets stretched to its maximum size within the flex container
instead of the flex item being shrunk to the instrinsic size of the
image.

Fix this by only stretching flex items that do not have an instrinsic
width nor height set.
2024-08-09 17:01:50 +01:00
Jelle Raaijmakers
d82f8a4b16 LibWeb: Update two spec URIs
No functional changes.
2024-08-09 17:01:50 +01:00
Jelle Raaijmakers
89d21335a1 LibWeb: Remove unused includes
No functional changes.
2024-08-09 17:01:50 +01:00
Alec Murphy
b3a67ee088 LibWeb: Skip trim trailing whitespace if user is typing
This PR stops the cursor from disappearing while typing trailing spaces
in a text input box.
2024-08-09 16:57:14 +01:00
Tim Ledbetter
85863bb0ef LibWeb: Don't verify_cast where input and output types are the same 2024-08-08 17:50:59 +02:00
Aliaksandr Kalenik
fa605ef225 LibWeb: Fix OOB access in "text-overflow: ellipsis" clip
Fixes out of bound access to glyph run when `last_glyph_index` is 0.

Fixes crashing on https://github.com/LadybirdBrowser/ladybird/pulls
2024-08-03 19:45:41 +02:00
Tobias Christiansen
da7f0897d1 LibWeb: Implement "text-overflow" property
The "text-overflow" property affects text that may get clipped if it is
larger than its container and does not do any line breaks.
The ellipsis character gets added to the end and the rest of the text
gets trunctated if the property is set to "ellipsis".
This patch implements this behavior in the InlineFormattingContext. :^)

The "text-overflow" property is also added  to the
getComputedStyle-print-all test.
2024-08-03 10:04:38 +01:00
Tobias Christiansen
794069b3cf LibWeb: Add plumbing for new "text-overflow" CSS property
This patch adds the new "text-overflow" CSS property to all the
relevant places.
2024-08-03 10:04:38 +01:00
BenJilks
963cf1c2c4 LibWeb: Add additional padding to the end of the scrollable overflow
Adds additional padding to the end-side of the scrollable overflow
rectangle as necessary to enable a scroll position that satisfies
the requirements of `place-content: end` alignment.
2024-08-02 08:07:56 +02:00
Aliaksandr Kalenik
bbc89a383d LibWeb: Fix overflow clip when "complicated" CSS transform is used
Overflow clipping is currently implemented as:
1. Create clip frame for each box with hidden overflow
2. Calculate clip rect for each clip frame by intersecting padding boxes
   of all boxes with hidden overflow in containing block chain
3. Assign enclosing clip frame (closest clip frame in containing block
   chain) to each PaintableBox
4. Apply clip rect of enclosing clip frame in Paintable::before_paint()

It breaks when any CSS transform other than simple translation is lying
between box with hidden overflow and a clipped box, because clip
rectangle will be applied when transform has already changed.

The fix is implemented by relying on the following rule:
"For elements whose layout is governed by the CSS box model, any value
other than none for the transform also causes the element to establish
a containing block for all descendants."

It means everything nested into a stacking context with CSS transform
can't escape its clip, so it's safe to apply its clip for all children.
2024-08-01 12:03:13 +02:00
Sam Atkins
3abd3ef5e2 LibWeb: Compute pseudo-element style when computing element style
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.
2024-07-31 12:15:39 +02:00
Sam Atkins
9e32c9329a LibWeb: Reserve enough space for span>1 columns in BorderConflictFinder
This code previously only allocated enough space in
m_col_elements_by_index for 1 slot per column, meaning that columns
with a span > 1 would write off the end of it.
2024-07-27 20:23:14 +01:00
Sam Atkins
898e3bd898 Last: LibWeb: Add counter() and counters() functions to content property
These let you format counters' current values as strings for use in
generated content.
2024-07-26 11:04:30 +01:00
Sam Atkins
017d6c3314 LibWeb: Implement counter-[increment,reset,set] properties
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.
2024-07-26 11:04:30 +01:00
Sam Atkins
6f2f91d1f5 LibWeb: Stop computing content in NodeWithStyle::apply_style()
This seems to have been required when pseudo-elements were first
implemented, but has since become unused. It's also awkward because we
don't have access to the DOM Element and its CountersSet at this point.
So, let's remove it.

For reference, Chrome&Firefox both return the computed value for
`content: counter(foo)` as `counter(foo)`, not as the computed string.
So not computing it here seems like the intended behaviour.
2024-07-26 11:04:30 +01:00
Sam Atkins
708f49d906 LibWeb: Give DOM Elements a CountersSet
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.
2024-07-26 11:04:30 +01:00
Edwin Hoksberg
e5deaa1c07 LibWeb: Implement grid-template function fit-content() 2024-07-25 13:12:26 +02:00
Edwin Hoksberg
de84e6f93a LibWeb: Move css_clamp function to FormattingContext
Since we need it in the FlexFormattingContext and
GridFormatting context now.
2024-07-25 13:12:26 +02:00
Tim Ledbetter
4cdafea363 LibWeb: Don't crash when SVG viewbox has a width of 0
Previously, `SVGSVGBox` would have a natural aspect ratio of 0 if it
had a viewbox with zero width. This led to a division by zero, causing
a crash.

Found by Domato.
2024-07-22 09:13:25 +02:00