Commit graph

244 commits

Author SHA1 Message Date
Shannon Booth
0695236408 LibWeb: Use cached element name and id where possible
Instead of looking up in the named node map, we can simply use the
cached name and ID on the element.
2024-01-13 12:05:36 +01:00
Andreas Kling
bc3a16396e LibWeb: Move font list from NodeWithStyle to ComputedValues
Same here, no need for this to live in NodeWithStyle. Inheritance
behavior for free in ComputedValues.
2024-01-12 17:26:16 +01:00
Andreas Kling
c82d517447 LibWeb: Move line-height from NodeWithStyle to ComputedValues
There's no need for this to live in the NodeWithStyle anymore. By moving
it to ComputedValues we get all the right inheritance behavior for free.
2024-01-12 17:26:16 +01:00
Andreas Kling
e7de5cb4d2 LibWeb: Bring CSS line-height closer to other engines
This patch makes a few changes to the way we calculate line-height:

- `line-height: normal` is now resolved using metrics from the used
  font (specifically, round(A + D + lineGap)).

- `line-height: calc(...)` is now resolved at style compute time.

- `line-height` values are now absolutized at style compute time.

As a consequence of the above, we no longer need to walk the DOM
ancestor chain looking for line-heights during style computation.
Instead, values are inherited, resolved and absolutized locally.

This is not only much faster, but also makes our line-height metrics
match those of other engines like Gecko and Blink.
2024-01-12 15:04:06 +01:00
Andreas Kling
4a35693dd7 LibWeb: Improve style propagation to anonymous wrappers
- We now propagate changes in font and line-height to anonymous wrappers
  when doing a partial style update after invalidation.

- We no longer (incorrectly) propagate style from table wrapper boxes
  to the table root, since inheritance works in the other direction.

Fixes #22395
2024-01-07 14:24:38 +01:00
Ali Mohammad Pur
5e1499d104 Everywhere: Rename {Deprecated => Byte}String
This commit un-deprecates DeprecatedString, and repurposes it as a byte
string.
As the null state has already been removed, there are no other
particularly hairy blockers in repurposing this type as a byte string
(what it _really_ is).

This commit is auto-generated:
  $ xs=$(ack -l \bDeprecatedString\b\|deprecated_string AK Userland \
    Meta Ports Ladybird Tests Kernel)
  $ perl -pie 's/\bDeprecatedString\b/ByteString/g;
    s/deprecated_string/byte_string/g' $xs
  $ clang-format --style=file -i \
    $(git diff --name-only | grep \.cpp\|\.h)
  $ gn format $(git ls-files '*.gn' '*.gni')
2023-12-17 18:25:10 +03:30
Andreas Kling
7c95ebc302 LibWeb: Make Document::page() return a Page&
Now that Document always has a Page, and always keeps it alive, we can
make this return a Page&, exposing various unnecessary null checks.
2023-12-15 22:04:46 +01:00
Aliaksandr Kalenik
2cb0039a13 LibGfx+LibWeb: Produce font cascade list in CSS font matching algorithm
According to the CSS font matching algorithm specification, it is
supposed to be executed for each glyph instead of each text run, as is
currently done. This change partially implements this by having the
font matching algorithm produce a list of fonts against which each
glyph will be tested to find its suitable font.

Now, it becomes possible to have per-glyph fallback fonts: if the
needed glyph is not present in a font, we can check the subsequent
fonts in the list.
2023-12-10 17:32:04 +01:00
Aliaksandr Kalenik
a738c2b120 LibWeb: Remove default font assignment in NodeWithStyle constructor
It is not needed because font matching algorithms adds fallback font
anyway.
2023-12-09 19:04:36 +01:00
Tobias Christiansen
6602b1ddb1 LibWeb: Rename "position" enum to "positioning"
The postitioning enum values are used by the position CSS property.
Unfortunately, the prior naming clashes with the CSS Values-4 type
named position, which will be implemented in a later commit.
2023-10-30 10:40:30 +00:00
Aliaksandr Kalenik
7803dcfcf9 LibWeb: Resolve backdrop filter length in apply_style()
Instead of resolving lengths used in the backdrop-filter during
painting, we can do that earlier in apply_style().

This change moves us a bit closer to the point when the stacking
context tree will be completely separated from the layout tree :)
2023-10-12 07:38:48 +02:00
MacDue
479451498b LibWeb: Implement mask-type CSS property
This property allows specifying if a mask is an alpha or luminance mask.

See: https://drafts.fxtf.org/css-masking/#the-mask-type
2023-10-09 07:28:18 +02:00
Shannon Booth
50350fb79c LibWeb: Add a non-DeprecatedString version of Element::get_attribute
Renaming the DeprecatedString version of this function to
Element::get_deprecated_attribute.

While performing this rename, port over functions where it is trivial to
do so to the Optional<String> version of this function.
2023-10-03 09:41:20 +02:00
Sam Atkins
9e99368694 LibWeb: Track quote-nesting level while building the layout tree
This makes multiple levels of quote actually use different quotation
marks, instead of always the first available pair of them.

Each Layout::Node remembers what the quote-nesting level was before its
content was evaluated, so that we can re-use this number in
`apply_style()`. This is a bit hacky, since we end up converting the
`content` value into a string twice.

`StyleProperties::content()` now takes an initial quote-nesting level,
and returns the final level after that content.
2023-09-28 14:49:10 +02:00
Aliaksandr Kalenik
32be413f4e LibWeb: Add missing visit_edges() for ImageStyleValue
ImageStyleValue has a visit_edges() method, although it is not a
GC-allocated object. This is necessary because it owns a GC-allocated
ImageRequest that we want to visit, instead of using JS::Handle, to
avoid leaks. In the future, we might want to make StyleValue be
GC-allocated.

For now, this change adds missing visit_edges() calls for objects that
own ImageStyleValue.
2023-09-28 06:11:17 +02:00
Andreas Kling
51caa14381 LibWeb: Remove FrameLoader
This class is no longer used, now that we've moved to navigables.
2023-09-20 18:29:17 +02:00
MacDue
dc58b5f418 LibWeb: Add CSS mask property and make it form a stacking context 2023-09-19 10:46:05 +02:00
Andreas Kling
1f69e9cddf LibWeb: Remove Layout::Node::m_visible and compute it on the fly
This fixes an issue where the value would be out of sync with reality
in anonymous wrapper block boxes, since we forgot to compute m_visible
after assigning the computed values to them.

Fixes #21106
2023-09-18 14:45:20 +02:00
Sam Atkins
dc7a52957e LibWeb: Parse and compute CSS quotes property 2023-09-17 15:45:52 -06:00
Aliaksandr Kalenik
65eb0f32ad LibWeb: Add missing visit Node::m_pseudo_element_generator 2023-09-16 19:44:55 -06:00
Aliaksandr Kalenik
dd7bba66ed LibWeb: Change viewport ownership from BrowsingContext to Navigable 2023-09-16 16:53:32 +02: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
6045143d39 LibWeb: Parse the math-shift and math-style CSS properties
Currently these have no effect, but they're simple, and `math-style`
influences `math-depth` which is coming next.
2023-09-11 17:03:22 +01:00
Sam Atkins
125d161b3f LibWeb: Move <display-foo> definitions into Enums.json
This eliminates a fair bit of boilerplate.
2023-09-11 17:03:22 +01:00
Zaggy1024
607a398917 LibWeb: Store computed CSS font size as CSSPixels
The value is originally set using a `CSSPixels` value converted to
double, then when it is used it is always converted back to a
`CSSPixels` again. Let's just store it as that instead.
2023-09-09 13:03:11 +02:00
Aliaksandr Kalenik
0f75d0611f LibWeb: Implement support for parsing CSS column-count property 2023-09-07 20:16:33 +02:00
MacDue
71baa8c31a LibWeb: Add CSSPixels::nearest_value_for(FloatingPoint)
This is intended to annotate conversions from unknown floating-point
values to CSSPixels, and make it more obvious the fp value will be
rounded to the nearest fixed-point value.
2023-08-26 23:53:45 +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
Andreas Kling
703c2bb06e LibWeb: Add support for parsing grid-auto-flow CSS property
Co-Authored-By: Aliaksandr Kalenik <kalenik.aliaksandr@gmail.com>
2023-08-20 15:36:18 +02:00
Andreas Kling
dea91afba7 LibWeb: Make HTMLElement.offset{Left,Top} work on inline elements
Before this change, we were returning (0, 0) for inline elements, due to
a bogus paintable type check in box_type_agnostic_position().
2023-08-15 16:37:11 +02:00
Andi Gallo
97512d0c76 LibWeb: Add table-layout CSS property 2023-08-09 08:33:02 +01:00
Aliaksandr Kalenik
b6ea4b002b LibWeb: Add info about pseudo element type in Layout::Node 2023-08-07 05:23:31 +02:00
Sam Atkins
73fa58da34 LibWeb: Implement the CSS outline-offset property
This allows you to push the outline a certain distance away from the
border (or inside it, if the offset is negative).
2023-08-03 05:25:48 +02:00
Sam Atkins
fe7e797483 LibWeb: Implement the CSS outline property :^)
...along with `outline-color`, `outline-style`, and `outline-width`.

This re-uses the existing border-painting code, which seems to work well
enough!

This replaces the previous code for drawing focus-outlines, with generic
outline painting for any elements that want it. Focus outlines are now
instead supported by this code in Default.css:

```css
:focus-visible {
    outline: auto;
}
```
2023-08-03 05:25:48 +02:00
Sam Atkins
6038e36250 LibWeb: Add and use the "snap a length as a border width" algorithm
Previously, we always rounded border-widths up when converting them to
device pixels. However, the spec asks us to follow a specific algorithm
to "snap" these values, so that the computed value is snapped.

The difference from before, is that widths of between 0 and 1 device
pixels are rounded up to 1, and and values larger than 1 are rounded
down.
2023-07-30 22:18:26 +01:00
Sam Atkins
5ee1b7db7c LibWeb: Convert BorderData::width to CSSPixels
The `clip_shrink` optimization in `paint_background()` now also
correctly uses DevicePixels, instead of reducing a DevicePixel rect by
a CSSPixels amount.
2023-07-30 22:18:26 +01:00
Aliaksandr Kalenik
38edab09a0 LibWeb: Allow <svg> to act as a containing block
This change makes overflow clipping work correctly for children of svg
element.

Fixes following example:
```html
<!doctype html><style>
    body {
        width: 300px;
        height: 300px;
        position: relative;
        overflow: hidden;
        border: 1px solid black;
    }
    svg {
        position: absolute;
        left: 50%;
        top: 50%;
        width: 100%;
        height: 100%;
        transform: translate(-50%, -50%);
    }
</style>
<body>
<svg viewBox="0 0 100 100">
   <g>
     <rect x="0" y="0" width="100" height="100" fill="green"></rect>
   </g>
</svg>
```
2023-07-28 15:15:07 +02:00
MacDue
30277f385c LibWeb: Add an initial implementation of SVG text-anchor
This only handles very simple <text> elements, but this is enough (with
the font-size changes) to improve the badges on the GitHub README a fair
bit.
2023-07-21 11:42:30 +02:00
Aliaksandr Kalenik
f060f89220 LibWeb: Add support for justify-items property in CSS parser 2023-07-15 05:50:51 +02:00
Aliaksandr Kalenik
fedbb39e9e LibWeb: Add support for justify-self property in CSS parser 2023-07-14 15:48:58 +02:00
Andreas Kling
510dfbb7e6 LibWeb: Update anonymous wrappers when applying style changes
Anonymous wrapper boxes inherit style from their layout tree parent,
and since style data is per-layout-node, we have to manually sync them
from parent to anonymous children when something changes.

This is not very elegant or efficient, so I've left a FIXME about
solving it in a nicer way.

This fixes horizontal dog alignment on https://waffles.dog/ :^)
2023-07-03 13:37:14 +02:00
FalseHonesty
110eeb8591 LibWeb: Support calc(...) in box-shadow's values of type Length
The CSS box-shadow property takes 2-4 properties that are `<length>`s,
those being:
  - offset-x
  - offset-y
  - blur-radius
  - spread-radius

Previously these were resolved directly to concrete Lengths at parse
time, but now they will be parsed as LengthStyleValues and/or
CalculatedStyleValues and be stored that way until styles are later
resolved.
2023-06-25 10:27:08 +01:00
Andi Gallo
55f1a70577 LibWeb: Fix style updates for table box nodes
On style update, we have to preserve the invariant established when we
built the layout tree - some properties are applied to the table wrapper
and the table box values are reset to their initial values.

This also ensures that the containing block of a table box is always a
table wrapper, which isn't the case if we set absolute position on the
box instead of the wrapper.

Fixes #19452.
2023-06-23 16:40:19 +02:00
Andi Gallo
e28578363a LibWeb: Get initial values for table box from CSS::InitialValues 2023-06-23 16:40:19 +02:00
Andi Gallo
396f1a977c LibWeb: Add CSS support for border-spacing property 2023-06-16 13:57:31 +02:00
Andreas Kling
b6f3369b66 LibWeb: Fix spelling of non_anonymous_containing_block() 2023-06-14 17:08:15 +02:00
Aliaksandr Kalenik
147c3b3d97 LibWeb+WebContent: Forbid access to underlying type of CSSPixels
Although DistinctNumeric, which is supposed to abstract the underlying
type, was used to represent CSSPixels, we have a whole bunch of places
in the layout code that assume CSSPixels::value() returns a
floating-point type. This assumption makes it difficult to replace the
underlying type in CSSPixels with a non-floating type.

To make it easier to transition CSSPixels to fixed-point math, one step
we can take is to prevent access to the underlying type using value()
and instead use explicit conversions with the to_float(), to_double(),
and to_int() methods.
2023-06-13 06:08:27 +02:00
MacDue
377ff0ac26 LibWeb: Implement SVG fill-rule attribute
Previously, we did an evenodd fill for everything which while for most
SVGs works, it is not correct default (it should be nonzero), and broke
some SVGs. This fixes a few of the icons on https://shopify.com/.
2023-06-11 19:34:24 +02:00
Andi Gallo
940d9b98ae LibWeb: Add support for table caption
Adds layout support and the CSS caption-side property.
2023-06-10 07:09:11 +02:00
Sam Atkins
6fd3b39bef LibWeb: Parse aspect-ratio property
Parse it, store the result in the ComputedValues, and also expose it to
ResolvedCSSStyleDeclaration.
2023-06-09 20:37:51 +02:00