1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-25 23:07:35 +00:00
Commit graph

570 commits

Author SHA1 Message Date
Aliaksandr Kalenik
d1e542999c LibWeb: Ensure preceding offset is non-negative in float_box()
When calculating the edge offset of the next floating item based on the
offset of the preceding floating item, we need to ensure that the
preceding offset is always > 0. This isn't explicitly written in the
spec, but all other popular engines do that.

Fixes https://github.com/SerenityOS/serenity/issues/21023
2023-09-12 12:11:53 +02:00
Aliaksandr Kalenik
81ddad3fcf LibWeb: Allow block level boxes to be floated and have clearance
Before, we completely ignored clearance for block-level boxes if they
were floated. This was incorrect because it is valid for a block-level
box to be floated and still have clearance. However, unlike clearance
on normal flow boxes, clearance on floating boxes does not affect the
y-position of subsequent normal flow boxes. Instead, it pushes the
box's position to the very beginning of an edge.

Work towards https://github.com/SerenityOS/serenity/issues/21023
2023-09-12 12:11:53 +02:00
Sam Atkins
489f9c3151 LibWeb: Implement text-transform: math-auto
This is a simple mapping of some code-points to others.

I was going to use a ref test for this, but without knowing that the
font contains the code-points (which SerenitySans does not) we'd be
comparing a series of replacement characters to a series of replacement
characters, which doesn't tell you if they're the right code-points
underneath.
2023-09-11 17:03:22 +01:00
Sam Atkins
f7209fb9d4 LibWeb: Implement font-size: math
This is a MathML extension, basically a big hack to make parts of
equations smaller, such as sub/superscripts. The important thing is, it
works. :^)
2023-09-11 17:03:22 +01:00
Sam Atkins
6476dea898 LibWeb: Implement the math-depth CSS property
This one is a bit fun because it can be `add(<integer>)` or `auto-add`,
but children have to inherit the computed value not the specified one.
We also have to compute it before computing the font-size, because of
`font-size: math` which will be implemented later.
2023-09-11 17:03:22 +01:00
Sam Atkins
3b0980c89f LibWeb: Stop allowing invalid tokens in display values
Previously we were overly generous in what we accepted for `display`.
For example, we accepted:
- Multiple outside or inside identifiers
- Unrecognized identifiers
- Non-identifier tokens

Now, we reject all these cases. This makes us stop accepting the
`display: block math;` declaration in `MathML/Default.css`, and so the
one layout test we have containing MathML elements has changed to
reflect that.
2023-09-11 17:03:22 +01:00
Aliaksandr Kalenik
40dea272d2 LibWeb: Add boxes for before/after pseudos post button layout tweak
When a button should use flex for alignment and also has ::before
and/or ::after, we previously did the following:
1. Prepended/appended the button's children with boxes for
   pseudo-elements.
2. Replaced the button's direct children with a flex container that
   contains its children.
As a result, the generated boxes for ::before/::after ended up as
children of the generated flex item, instead of being direct children
of the button layout box as they were supposed to be.

This change reverses these steps, ensuring that boxes for
pseudo-elements are generated only after modifications inside the
button layout are completed.
2023-09-11 15:19:56 +02:00
Aliaksandr Kalenik
0160d921e9 LibWeb: Set children of button layout box to be non-inline
When modifying the button layout during tree building to use flex for
vertical alignment, let's explicitly set the button box's children to
be non-inline. It doesn't make sense to layout the button as an IFC
when its only child is a flex container.
2023-09-11 15:19:56 +02:00
Aliaksandr Kalenik
df2bc8187c LibWeb: Use actual line height to calculate float y in IFC
Before, we were using the line height from NodeWithStyle::line_height()
 to calculate the y offset for floats inside the IFC. However, this
value doesn't always correspond to the actual height of a line box. For
instance, adding a fragment for an inline-block might change the height
of the line box. With this change, we recalculate the height of the
line box after adding a new fragment and use this recalculated height
value to determine the y position for floats.

Fixes https://github.com/SerenityOS/serenity/issues/20982
2023-09-09 17:05:22 +02:00
Sam Atkins
b1a569c1c5 LibWeb: Stop crashing when textarea element is modified before insertion
If an element is created from JS, it might have its contents modified
before it is inserted into the document. In this case, we don't have a
shadow tree yet and so trying to set m_text_node's text content would
cause a null dereference. So let's not do that. :^)

That case also means that by the time we do create the shadow tree, we
have the text content already, so we can set it there.

Added a test to verify that we don't crash, and that the text content
appears in the textarea whether it was inserted by JS or by the HTML
parser.
2023-09-09 13:52:01 +01:00
Shannon Booth
f991e40d7f LibWeb: Support [Reflect] on IDL String attributes that may return null
This change allows IDL interfaces to be compiled using new AK String
which have a attribute in the interface that may return null.

Without this change we would run into a compile error from code such as
the following example:

```
auto retval = impl->deprecated_attribute(HTML::AttributeNames::ref);

if (!retval.has_value()) {
    return JS::js_null();
 }
 return JS::PrimitiveString::create(vm, retval.release_value());
```

As `deprecated_attribute` returns a `DeprecatedString` instead of an
`Optional<String>`. Fix that by using the non-deprecated attribute
implementation, and falling back to the empty string for where we cannot
return null.

Also add a test here to cover a regression I almost introduced here
which was not previously covered by our test suite.

Ideally, all of this should actually just be calling
Element::get_attribute_value, but I'm not entirely sure at this stage
what the behavioral change would be to test for here. Since this
implementation preserves the previous behavior, stick with it, and add a
FIXME for now.
2023-09-05 20:36:09 -04:00
Bastiaan van der Plaat
f1742ae1b9 LibWeb: Add DOMMatrix flipX and flipY 2023-09-05 20:30:36 +02:00
Bastiaan van der Plaat
fc380bf516 LibWeb: Add DOMMatrix skewX and skewY 2023-09-05 20:30:36 +02:00
Zaggy1024
98926b487c LibWeb: Perform rounding when dividing CSSPixels
This should allow us to produce results that more closely match old
layouts when divisions were done in floating-point.
2023-09-05 14:50:45 +02:00
Zaggy1024
bd85e1b30b LibWeb: Entirely and exactly distribute grids' extra space to tracks
Previously, the code assumed that in dividing up the space in the
affected tracks there would never be an overshoot. Instead, we can
check for each track how much extra space is left and never consume any
extra.

In the same way, we can ensure that all extra space is consumed by
distributing all remaining extra space starting from the first track.
Thus, if there is no growth limit, the space distribution should always
consume all the extra space.
2023-09-05 14:50:45 +02:00
Zaggy1024
eb7c2ee307 LibWeb: Limit affected size of grid tracks instead of only increase
The spec says that the sum of affected size + item-incurred increase
should reach the limit, rather than just the item-incurred increase.

This seems to improve layout on the testcase `row-span-2-with-gaps`.
The extra line of space at the bottom of the left div
(`div.grid-item.item-span-two`) is not present anymore, matching other
browsers' layout much more closely.
2023-09-05 14:50:45 +02:00
Sam Atkins
07039af982 LibWeb: Implement attr() types :^)
Support the optional `<attr-type>` parameter to the `attr()` function,
which allows parsing the attribute's value as a variety of types,
instead of always as a string.
2023-09-05 14:27:23 +02:00
Sam Atkins
bf8aa33b68 LibWeb: Add tests for basic attr() behavior and fallback values 2023-09-05 14:27:23 +02:00
Andreas Kling
e013306df8 LibWeb: Allow font-size: 0
Zero is a valid font-size value, and should result in no text being
visible. We now match the behavior of other engines.
2023-09-05 14:23:35 +02:00
Andreas Kling
589a1e9325 LibWeb: Propagate font-size & line-height into generated table boxes
The final used values for these properties is stored in the layout node,
so we need to make sure they are propagated there as well when doing
table box fixup.
2023-09-05 14:23:35 +02:00
Zaggy1024
e3f693ca7c LibWeb: Resolve replaced element size constraints using aspect ratios
Some replaced elements can have intrinsic aspect ratios but no
intrinsic size. In these cases, the tentative sizes are undefined, and
can therefore sometimes be zero. However, when resolving the size
constraints, we are already guaranteed to have an intrinsic aspect
ratio, so let's use that instead to calculate the resolved sizes.
2023-09-04 12:40:17 +02:00
Zaggy1024
34c5043cbe LibWeb: Use CSSPixelFraction to represent aspect ratios
This allows us to retain perfect precision for aspect ratios derived
from either the intrinsic sizes of replaced elements, or the
`aspect-ratio` CSS property.
2023-09-04 12:40:17 +02:00
Andreas Kling
50d72f0d8c LibWeb: Handle case where abspos flex child position depends on height
There's a particularly awkward case where the static position of an
abspos child of a flex container is dependent on its height. This can
happen when `align-items: center` is in effect, as we have to adjust
the abspos child's Y position by half of its height.

This patch solves the issue by reordering operations in the abspos
height resolution algorithm, to make sure that height is resolved
before the static position is calculated.
2023-09-03 15:44:47 +02:00
Bastiaan van der Plaat
5cd35b633a LibWeb: Add DOMMatrix translate 2023-09-03 15:05:41 +02:00
Bastiaan van der Plaat
61c063f7b3 LibWeb: Add DOMMatrix multiply 2023-09-03 15:05:41 +02:00
Bastiaan van der Plaat
ff1bcc694d LibWeb: Add DOMMatrix and DOMMatrixReadOnly fromMatrix 2023-09-03 15:05:41 +02:00
Aliaksandr Kalenik
ed0dc2ff72 LibWeb: Use flex layout for button content alignment
Using flex layout inside button solves the issue with wrongly calculated
height when it has: pseudo element and whitespaces inside.

Also using flex instead of a table layout allows for the same vertical
alignment but with fewer layout nodes: a flex container and anonymous
wrapper for content instead of a table wrapper, table, row, and cell.
2023-09-03 12:33:10 +02:00
Bastiaan van der Plaat
b4ae719664 LibWeb: Add DOMPoint matrixTransform and DOMMatrix transformPoint 2023-09-01 20:58:13 +02:00
Andreas Kling
ef9b6c25fa LibWeb: Consolidate consecutive inlines in a single anonymous flex item
Before this change, we were creating a new anonymous flex item for every
inline-level child of a flex container, even when we had a sequence of
inline-level children.

The fix here is to simply keep putting things in the last child of the
flex container, if that child is already an anonymous flex item.
2023-09-01 12:45:38 +02:00
Zaggy1024
50bb785306 Tests/LibWeb: Add a test for clipping text with CSS clip 2023-09-01 09:40:14 +02:00
Aliaksandr Kalenik
a482166087 LibWeb: Bring html element height calculation closer to the spec
Previously we always set the height of the HTML element equal to the
viewport height but now this will only happen in quirks mode as it is
intended. Otherwise the html element height will be computed as auto.
2023-08-31 21:43:58 +02:00
MacDue
720c27efbd LibWeb: Ensure transform of SVG <use> updates with x and y attributes
Rather than modify the transform of the parent (which could change
independently), this adds a new override element_transform() where
element specific tranfroms can be applied. This will always stay in
sync with the attributes.

A ref test comparing a .svg and .html version of the same file is
added as due to differences in attribute parsing order, the .svg version
was previously drawn incorrectly.

Fixes #20859
2023-08-31 11:10:30 +02:00
Shannon Booth
cb4c279e90 AK: Percent encode URL fragments when parsed
This fixes URL fragments containing characters in the fragment encoding
set that were not being correctly percent encoded.
2023-08-31 11:02:18 +02:00
Shannon Booth
4eab37f391 LibWeb/Tests: Also include URL hash in test results
None of the existing tests contain a URL which has a fragment in them,
but this does verify that the URL parser does not actually find any!
Also, this should let us verify the correctness of URLs which actually
do contain fragments.
2023-08-31 11:02:18 +02:00
Shannon Booth
23e82114b4 AK: Do not consider port of 0 as a null port
This fixes an issue where if a port number of 0 was given for a non
special scheme the port number was being dropped.
2023-08-31 11:02:18 +02:00
MacDue
e8342a5b79 Tests/LibWeb: Add ref test for border-radius shrink of zero sized box 2023-08-30 20:36:27 +02:00
Aliaksandr Kalenik
0fb571c1c2 LibWeb: Add Length::resolved() overload for CSSPixels
Since we always pass the px value as an argument to resolved(), we can
pass it directly as CSSPixels instead of wrapping it in Length. This
approach allows us to avoid converting to a double, resulting in fewer
precision issues.
2023-08-30 20:09:15 +02:00
Andi Gallo
fab4d543f6 LibWeb: Set line height for table boxes generated during fixup 2023-08-30 07:57:56 +02:00
Andreas Kling
6d7a2f5cc9 LibWeb: Prune old paintable pointers from layout tree after relayout
When text paintables shift around in the tree due to line wrapping,
we may end up in a situation where some text node does not generate
a paintable (due to being all whitespace, for example), even though
in the previous layout pass, it *did* generate a paintable.

To prevent holding on to old paintables in such cases, we now do a
pass in LayoutState::commit() where we explicitly detach all old
paintables from the layout tree.
2023-08-29 17:05:16 +02:00
Aliaksandr Kalenik
2495302991 LibWeb: Reset auto_placement_cursor_x after adding new column in GFC
We need to start looking from the beginning of current row if adding
new implicit column track made enough space to accomodate spanning item

This fixes placement for spanning grid items when `grid-auto-flow` is
specified to `column`.
2023-08-29 12:35:21 +02:00
Andi Gallo
4a124333c8 LibWeb: Add back undistributable space when adjusting table width
If the table used width has to be adjusted because of a cell with
percentage width, add back the undistributable space due to border
spacing. This is consistent with the width distribution algorithm, which
sets aside the undistributable space and the behavior of other browsers.
2023-08-29 09:19:55 +02:00
Andreas Kling
2a86bd8c91 LibWeb: Fire the fail callback on SharedImageRequest when they fail
This fixes an issue where failed image loads would delay the document
load event forever.
2023-08-28 10:19:46 +02:00
Andi Gallo
8e0320626d LibWeb: Move line breaking test 2023-08-28 10:09:07 +02:00
Aliaksandr Kalenik
b66f65dc9e LibWeb: Define if identifier represent area or line during layout [GFC]
This fixes regression introduced in
c03e025a32 by assuming that it is
possible to determine whether identifier stands for line or area
during parsing.
2023-08-28 09:19:41 +02:00
Luke Wilde
af2886449a LibWeb: Implement PerformanceObserver 2023-08-27 23:27:44 +02:00
Aliaksandr Kalenik
e4dd4808c4 Tests/LibWeb: Split "grid/named-tracks.html" into smaller layout tests
The file grid/named-tracks.html contained multiple subtests. Splitting
them into individual files will make it simpler to identify where is
the issue.
2023-08-27 14:51:44 +02:00
Aliaksandr Kalenik
d3d67857b2 LibWeb: Use containing block width to measure fit-content width in GFC
When the grid layout gets to
`resolve_items_box_metrics(GridDimension::Column)`, we've already
determined the width of each column. However, the widths of the
individual grid items themselves haven't been set. Rather than using
`get_available_space_for_item()`, which returns an indefinite size if
an item's width/height hasn't been set, we should use the already
known track width as the available size to calculate the fit-content
width.
2023-08-27 05:11:55 +02:00
MacDue
360c0eb509 LibWeb: Remove implicit conversion from float and double to CSSPixels
In general it is not safe to convert any arbitrary floating-point value
to CSSPixels. CSSPixels has a resolution of 0.015625, which for small
values (e.g. scale factors between 0 and 1), can produce bad results
if converted to CSSPixels then scaled back up. In the worst case values
can underflow to zero and produce incorrect results.
2023-08-26 23:53:45 +02:00
Aliaksandr Kalenik
0060fe3095 LibWeb: Account for float intrusions in list marker x offset 2023-08-26 19:07:56 +02:00
Sam Atkins
240ec9aeed LibWeb: Treat invalid StyleValues that included var() as unset
This means StyleComputer::resolve_unresolved_style_value() always
returns a value, so we can change its return type.

However, it does still return an UnresolvedStyleValue sometimes, so we
can't remove those checks from the user code.
2023-08-26 15:33:45 +01:00