Commit Graph

105 Commits

Author SHA1 Message Date
Tim Ledbetter
30e505a630 LibWeb: Match attribute selectors case insensitively in XML documents
The values of attribute selectors are now compared case insensitively
by default if the attribute's document is not a HTML document, or the
element is not in the HTML namespace.

(cherry picked from commit 00f03f3e900d6f5c0196db9a9d7eb352ec516b44)
2024-11-07 22:42:20 -05:00
Sam Atkins
87e74c6c0c LibWeb: Start transitions when affected properties change
Co-authored-by: Matthew Olsson <matthewcolsson@gmail.com>
(cherry picked from commit a1fca1a7f3f70e4acf15052014d5b180197df9fd)
2024-11-04 13:15:58 -05:00
Tim Ledbetter
610873368a 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.

(cherry picked from commit 2c5d626b2125ffea49e06735e2f93279d0dfa0e1)
2024-11-02 07:50:34 -04:00
Annya
265c942698 LibWeb/CSS: Implement revert-layer
With the introduction of the cascade layer, the 5th CSS-wide keyword,
`revert-layer`, has been added.

(cherry picked from commit bea7eec5183a816a100d190e409a622f429d7405)
2024-10-31 21:51:50 -04:00
Nico Weber
6f09a68baf LibWeb: Parse stroke-{linejoin,miterlimit} attributes
Similar to LadybirdBrowser/ladybird#1714.

We don't implement the linejoin values `miter-clip` and `arcs`, because
according to the SVG 2 spec:

> The values miter-clip and arcs of the stroke-linejoin property are at
> risk. There are no known browser implementations. See issue Github
> issue w3c/svgwg#592.

Nothing uses this yet. The next step is to change
SVGPathPaintable::paint() to read `graphics_element.stroke_linejoin()`
and `graphics_element.stroke_miterlimit()` when painting.

(cherry picked from commit 421cf8d9bf276cff61acdc32dc55d978d37fb671;
amended to resolve conflict on `height:` in
getComputedStyle-print-all.txt)
2024-10-29 21:42:09 -04:00
Kostya Farber
0b90c18afb LibWeb: Parse the word-break css property
(cherry picked from commit 44b1c4f2b59563cf29f6af81bb86645f2fa89155)
2024-10-27 20:06:44 -04:00
Sam Atkins
9d869b3afc LibWeb: Add coverage test for calc() usage
Ignoring the fact that we should serialize a simplified form of calc()
expressions, the following are wrong:

- grid-auto-columns
- grid-auto-rows
- grid-template-columns
- grid-template-rows
- transform-origin

Generated in part with this python script (though I've since iterated on
the output repeatedly so it's quite different):

```py
import json
properties_file = open("./Userland/Libraries/LibWeb/CSS/Properties.json")
properties = json.load(properties_file)
for (key, value) in properties.items():
    if not 'valid-types' in value:
        continue
    if 'longhands' in value:
        continue
    valid_types = value['valid-types']
    for type_string in valid_types:
        name, *suffix = type_string.split(None, 1)
        match name:
            case 'integer' | 'number':
                print(f'{key}: calc(2 * var(--n));')
            case 'angle':
                print(f'{key}: calc(2deg * var(--n));')
            case 'flex':
                print(f'{key}: calc(2fr * var(--n));')
            case 'frequency':
                print(f'{key}: calc(2hz * var(--n));')
            case 'length':
                print(f'{key}: calc(2px * var(--n));')
            case 'percentage':
                print(f'{key}: calc(2% * var(--n));')
            case 'resolution':
                print(f'{key}: calc(2x * var(--n));')
            case 'time':
                print(f'{key}: calc(2s * var(--n));')
```

(cherry picked from commit 301502a3a12b86e218f477f06d2d5271aee8e017;
amended to include `Well, hello friends  ` in
expected/css/calc-coverage.txt because we don't have
LadybirdBrowser/ladybird#1603 yet)
2024-10-27 16:58:12 -04:00
Sam Atkins
bcbb7b19cd LibWeb/CSS: Serialize empty grid-template-* values correctly
Previously we would serialize these as the empty string. eg, this:

```
<div style="grid-auto-columns: auto"></div>
```

would have a computed `grid-auto-columns` value of ``.

(cherry picked from commit 7c2680b7efd2588cf2c5e595f7a60813dabf3b92)
2024-10-27 16:58:12 -04:00
Sam Atkins
07bc7de068 LibWeb/CSS: Mark grid-[gap, column-gap, row-gap] properties as aliases
These are legacy name aliases for the properties without the 'grid-'
prefix. See https://drafts.csswg.org/css-align-3/#gap-legacy

(cherry picked from commit c79f261bec40a61373d45508c1935f839454c95d)
2024-10-26 10:46:49 -04:00
Sam Atkins
d29d44951d LibWeb: Serialize more @font-face descriptors
Adapt the existing `font-face-src-local-serialization.html` test into a
more general test for these.

(cherry picked from commit c497e5f850a5c7f43d6f216d9fd74a58ddefd9a0)
2024-10-26 09:29:16 -04:00
Sam Atkins
f8a66c346e LibWeb/CSS: Parse and propagate font-feature-settings property
(cherry picked from commit 95c17dfab51fefdd5ca364652e8571827d9693b1)
2024-10-26 09:29:16 -04:00
Sam Atkins
7b35ed0c66 LibWeb/CSS: Parse and propagate font-variation-settings property
(cherry picked from commit 55812aaed20ce8f7aeea233a47bcab73b60edd5e;
amended to include AK/QuickSort.h in Parser.cpp to fix a compile
error, and to update height: in getComputedStyle-print-all.txt)
2024-10-26 09:29:16 -04:00
Kostya Farber
8718238254 LibWeb/CSS: Parse the tab-size property
(cherry picked from commit 68a28ff33abe29376cea009e24c406d3a23d4890;
amended to update `height:` line in getComputedStyle-print-all.txt)
2024-10-25 21:11:16 -04:00
Sam Atkins
ee3710f681 LibWeb/CSS: Parse and propagate the font-language-override property
(cherry picked from commit 1d8867d9ae9de1312fe6624bf9040dde12bfa9df;
amended to fix `height:` line in getComputedStyle-print-all.txt)
2024-10-21 09:36:47 -04:00
Sam Atkins
a627165df9 LibWeb/CSS: Make font-stretch a legacy alias for new font-width
CSS Fonts level 4 renames font-stretch to font-width, with font-stretch
being left as a legacy alias. Unfortunately the other specs have not yet
been updated, so both terms are used in different places.

(cherry picked from commit 4a67b28600437901e6d8a366c56a5ddd8665deb1)
2024-10-21 09:36:47 -04:00
Sam Atkins
536fb5a0bc LibWeb/CSS: Implement cascade layers (aka @layer)
This is done quite simply for now, there are certainly optimizations
that can and should be made later.

With this we now pass:
- http://wpt.live/css/css-cascade/layer-basic.html
- http://wpt.live/css/css-cascade/layer-important.html
- http://wpt.live/css/css-cascade/layer-statement-copy-crash.html
- http://wpt.live/css/css-cascade/layer-stylesheet-sharing-important.html
- http://wpt.live/css/css-cascade/layer-stylesheet-sharing.html
- http://wpt.live/css/css-cascade/layer-vs-inline-style.html

(cherry picked from commit a50da405e9c350266edfc89e5d27f7acddbee422)
2024-10-20 21:09:21 -04:00
Sam Atkins
d76b7744fd LibWeb/CSS: Implement legacy name aliases for properties
When a property is a "legacy name alias", any time it is used in CSS or
via the CSSOM its aliased name is used instead.
(See https://drafts.csswg.org/css-cascade-5/#legacy-name-alias)

This means we only care about the alias when parsing a string as a
PropertyID - and we can just return the PropertyID it is an alias for.
No need for a distinct PropertyID for it, and no need for LibWeb to
care about it at all.

Previously, we had a bunch of these properties, which misused our code
for "logical aliases", some of which I've discovered were not even
fully implemented. But with this change, all that code can go away, and
making a legacy alias is just a case of putting it in the JSON. This
also shrinks `StyleProperties` as it doesn't need to contain data for
these aliases, and removes a whole load of `-webkit-*` spam from the
style inspector.

(cherry picked from commit fdcece2e88b91b9ec6cf63c3466525fb77540316;
amended to:
* resolve a conflict on height: in getComputedStyle-print-all.txt
* run prettier on CSSGeneratedFiles.md)
2024-10-20 10:29:44 -04:00
Andreas Kling
49c488c3eb LibWeb: Make CSS::is_inherited_property(PropertyID) go fast
Instead of switching on the PropertyID and doing a boatload of
comparisons, we reorder the PropertyID enum so that all inherited
properties are in two contiguous ranges (one for shorthands,
one for longhands).

This replaces the switch statement with two simple range checks.

Note that the property order change is observable via
window.getComputedStyle(), but the order of those properties is
implementation defined anyway.

Removes a 1.5% item from the profile when loading https://hemnet.se/

(cherry picked from commit 1f5c49f40d0383ef1f91d6e4d838230f04dfb738;
amended for stroke-linecap in getComputedStyle-print-all.txt)
2024-10-20 01:32:53 -04:00
Nico Weber
052f35da64 LibWeb: Add stroke-linecap attribute and plumb it to SVGGraphicsElement
SVGGraphicsElement then goes ahead and does nothing with it for now.

(cherry picked from commit cc0cfd044b3a04c021f8810f7e96d98a05f7146a;
amended to fix minor conflict in getComputedStyle-print-all.txt)
2024-10-14 22:34:19 -04:00
Samuel Fry
6bed0011e1 LibWeb: Support parsing column-span
(cherry picked from commit 23b4367c9c8c074e72d52ac8633e5d02302053ca)
2024-10-11 10:12:44 -04:00
Samuel Fry
40d4b58deb LibWeb: Support parsing column-width
(cherry picked from commit c113d3fae9aec35a6314a06466fbb6bfbe2a4de3)
2024-10-11 10:12:44 -04:00
Khaled Lakehal
cc4ba18bed LibWeb/CSS: Add support for unicode-bidi property
(cherry picked from commit 77761e123d61ff792efe78a06ca863925a1f5f98)
2024-10-11 09:27:42 -04:00
Tobias Christiansen
f1ad1d3d6b 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.

(cherry picked from commit da7f0897d1eace887d75d966ffed6adde0e65196,
amended to make `available_width` a float to fix -Wdouble-promotion
from gcc. Everything `available_width` touches is float too.)
2024-10-10 06:07:37 -04:00
BenJilks
1741fee83f 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`.

(cherry picked from commit 1537d589ca4908c3631dc38e66c97fd37fa2f526)
2024-09-29 08:03:58 -04:00
Sam Atkins
2660c80a98 LibWeb: Implement getComputedStyle() pseudoElement parameter
Right now, we deviate from the CSSOM spec regarding our
CSSStyleDeclaration classes, so this is not as close to the spec as I'd
like. But it works, which means we'll be able to test pseudo-element
styling a lot more easily. :^)

(cherry picked from commit 14611de362d1d41429688dc02ffaf037a32e2e5d)
2024-09-28 14:14:28 -04:00
Sam Atkins
383aa48e73 LibWeb: Invalidate layout if pseudo-element style changes
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)
2024-09-27 23:21:05 -04:00
Andreas Kling
d4e86f10ac LibWeb: Don't crash on CSS all: revert
Not every value in a StyleProperties will be non-null by the time we
perform `revert`, so let's make a specialized function for reverting a
property instead of using the path that requires the value to be
non-null.

(cherry picked from commit a10610a1cad56294089fc9457e713eb7083312cd)
2024-09-27 22:18:42 -04:00
Sam Atkins
94674c6999 LibWeb/CSS: Parse custom-idents more consistently
These have a few rules that we didn't follow in most cases:
- CSS-wide keywords are not allowed. (inherit, initial, etc)
- `default` is not allowed.
- The above and any other disallowed identifiers must be tested
  case-insensitively.

This introduces a `parse_custom_ident_value()` method, which takes a
list of disallowed identifier names, and handles the above rules.

(cherry picked from commit 6ae2b8c3d901d8a7255046a4517fddd8b0fa84c4)
2024-07-28 20:21:39 -04:00
Sam Atkins
1bc896fa60 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.

(cherry picked from commit 017d6c3314d57d4e351764f328c1d25dbc9d033a)
2024-07-28 13:31:02 -04:00
Edwin Hoksberg
360cea781b LibWeb: Support content-visibility css
(cherry picked from commit 020b20d817d51dda9c0f9306543c69f4020891eb)
2024-07-23 21:15:27 -04:00
Colin Reeder
a745a849cf LibWeb: Add more legacy -webkit- aliases
(cherry picked from commit 5c315b532e4edc561f30dfc492db9b2dcb59d5de)
2024-07-23 21:15:27 -04:00
Colin Reeder
70388b5676 LibWeb: Add support for -webkit-text-fill-color
(cherry picked from commit 449f81bfbed8343cfb49fcef4a890c33922889e5)

Commit altered to fix cherry-pick issue

Co-Authored-By: circl <circl.lastname@gmail.com>
2024-07-23 21:15:27 -04:00
Luke Warlow
e8bcd3842d LibWeb: Implement support for scrollbar-gutter
This property is now correctly parsed.

Ladybird always uses overlay scrollbars so this property does nothing.

(cherry picked from commit 662317726549cd2dde4c7902b99f0b83397a3396)
2024-07-14 20:44:46 -04:00
Bastiaan van der Plaat
6ab28fd568 LibWeb/CSS: Serialize transform scale percentage values as numbers
(cherry picked from commit c81a640f3ed424b11830fbe9777f1a267240577f)
2024-07-14 19:34:39 -04:00
Andreas Kling
7cd1114f05 LibWeb: Remove unnecessary FIXME marker for CSSStyleDeclaration.cssFloat
(cherry picked from commit 4c94202e9734099b6e2839f5495b8280eec2ab2f)
2024-06-26 23:07:42 +02:00
Andreas Kling
99851591b5 LibWeb: Make CSSKeyframeRule.parentRule actually point to parent rule
(cherry picked from commit 19fa630fa7e8342673b2aaa23e451f221533f12c)
2024-06-26 23:07:42 +02:00
Andreas Kling
ea2876bc6f LibWeb: Implement CSSKeyframesRule.cssRuleList
To make this straightforward, CSSKeyframesRule now uses a CSSRuleList
for internal storage.

(cherry picked from commit 7f2c833a39e150c7372299dcfe4d2d5590ae779f)
2024-06-26 23:07:42 +02:00
Andreas Kling
da836c344a LibWeb: Implement CSSStyleDeclaration.parentRule
This readonly attribute returns the containing CSS rule, or null (in the
case of element inline style).

(cherry picked from commit a12d28fd3053638ce6f4215bed2d8d45cda86375)
2024-06-26 23:07:42 +02:00
Tim Ledbetter
d6297ec074 LibWeb: Cast to the correct type in Element::auto_directionality()
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.
2024-05-28 09:51:07 +02:00
Tim Ledbetter
0b0ad5c9db LibWeb: Calculate width property resolved value correctly
This means that relative width values are now correctly resolved when
calling `getComputedStyle()`.
2024-05-28 08:08:31 +02:00
Matthew Olsson
a8ef84f8c3 LibWeb: Use LengthPercentage for calc values in Transformation matrix 2024-05-25 22:19:47 +02:00
Matthew Olsson
15a8baee03 LibWeb: Save time for animationcancel event before transitioning to idle
The if statement in the dispatch implies we are in the idle state, so of
course the active time will always be undefined. If this was cancelled
via a call to cancel(), we can save the time at that point. Otherwise,
just send 0.
2024-05-24 07:25:10 +02:00
Andrew Kaster
bab546472e LibWeb: Mark FontFaceSet as a setlike IDL interface
And implement more of the constructor logic.
2024-05-23 10:57:34 +02:00
Andrew Kaster
28f728dfdb LibWeb: Implement FontFace.load() for url() based font sources 2024-05-16 08:02:43 +02:00
MacDue
6c9069fa5d LibWeb: Implement the SVG clip-rule attribute
This controls the fill rule used when rasterizing `<clipPath>` elements.
2024-05-14 23:01:18 +01:00
Andrew Kaster
60b3436ea3 LibWeb: Support loading FontFaces constructed with binary data 2024-05-14 12:31:10 -06:00
Andrew Kaster
2bc51f08d9 LibWeb: Implement or stub FontFace interface's attribute getters/setters
We only support parsing half of these, so the ones we don't recognize
get a friendly exception thrown.
2024-05-11 07:30:29 +01:00
Tim Ledbetter
57f0ea186e LibWeb: Update Element::directionality() to match current spec text
This fixes a crash that occurred when determining the directionality of
input elements.
2024-05-07 16:45:28 -06:00
Tim Ledbetter
02a8966b61 LibWeb: Serialize empty media rules with a single newline
This deviates from the CSSOM specification but all modern browsers do
this.
2024-05-01 07:21:21 +02:00
Tim Ledbetter
a2cccf9420 LibWeb: Use correct spacing when serializing media features
Previously, there was no space between the media feature name and value.
2024-05-01 07:21:21 +02:00