Commit graph

2347 commits

Author SHA1 Message Date
Aliaksandr Kalenik
22b8380e37 LibWeb: Include system emoji font in a font cascade list
Adds emoji rendering support on macOS and linux (if it has "Noto Color
Emoji" font).
2024-09-06 08:30:30 -04:00
Aliaksandr Kalenik
67fe8d66b2 LibWeb: Skip font if it doesn't contain needed glyph in FontCascadeList
Before this change, we were only checking for actual glyph containment
in a font if unicode ranges were specified. However that is not
sufficient for emoji support, where we want to continue searching for
a font until one containing emojis is found.
2024-09-06 08:30:30 -04:00
Sam Atkins
a50da405e9 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
2024-09-06 07:49:55 +02:00
Sam Atkins
cbb4be3e5e LibWeb/CSS: Replace style-rule iteration methods with a generic one
I didn't want to add another set of boilerplatey tree-walking methods,
so here's a general-purpose one. :^)

`for_each_effective_rule()` walks the tree of effective style rules, and
runs the callback on each one, in either pre- or postorder.  The
previous `for_each_effective_style/keyframes_rule()` methods of
`CSSStyleSheet` are then reimplemented in terms of
`for_each_effective_rule()`, and we can get rid of their equivalents
elsewhere.
2024-09-06 07:49:55 +02:00
Sam Atkins
4c98906e2c LibWeb/CSS: Parse @layer rules
This causes us to pass all of
http://wpt.live/css/css-cascade/parsing/layer.html :^)
2024-09-06 07:49:55 +02:00
Sam Atkins
1c6133aa52 LibWeb/CSS: Add CSSOM types for @layer rules
Depending on usage, `@layer` has two forms, with two different CSSOM
types. One simply lists layer names and the other defines a layer with
its contained rules.
2024-09-06 07:49:55 +02:00
BenJilks
7e38e12bb0 LibWeb: Use transform-box for resolving percentage transform values
Factor out computing the transform box rect into its own method. Then
use it when resolving the transformation matrix, to compute percentage
values.
2024-09-05 19:22:26 +02:00
Aliaksandr Kalenik
a9d5a99568 LibGfx+LibWeb: Replace remaining OpenType implementation with Skia
This change should move us forward toward emoji support, as we are no
longer limited by our own OpenType implementation, which was failing
to parse the TrueType Collection format used to store emoji fonts
(at least on macOS).
2024-09-05 19:21:52 +02:00
Aliaksandr Kalenik
db74244fb2 LibWeb: Read header to check if a blob without mime type is WOFF/WOFF2
Currently we rely on parser returning an error if encoded data cannot be
parsed into a valid WOFF or WOFF2 font, which is not going to be true
after switching to Skia that sometimes does not fail even if a data does
not represent a valid font.
2024-09-05 19:21:52 +02:00
Colin Reeder
45e4ab69d6 LibWeb: Add background color to input fields 2024-09-03 10:16:13 +01:00
Sam Atkins
49b2eb5f51 LibWeb: Add Document::get_style_sheet_source()
This returns the source text of the specified style sheet. StyleComputer
now exposes user agent style sheets so that these can also be requested.
2024-09-03 10:12:07 +01:00
Sam Atkins
51a426cc05 LibWeb: Add method for listing all style sheets on a page
This will be used by the inspector, for showing style sheet contents.

Identifying a specific style sheet is a bit tricky. Depending on where
it came from, a style sheet may have a URL, it might be associated with
a DOM element, both, or neither. This varied information is wrapped in
a new StyleSheetIdentifier struct.
2024-09-03 10:12:07 +01:00
Sam Atkins
dd3b011f15 LibWeb: Keep track of each CSSStyleSheet's CSSImportRules
This will be used to gather up a list of all loaded style sheets for the
inspector.
2024-09-03 10:12:07 +01:00
Sam Atkins
b00137df38 LibWeb/CSS: Store the style sheet's source text on the CSSStyleSheet
This is to enable the inspector to show this source.

There's a fairly hefty FIXME here because duplicating the source text is
a significant waste of memory. But I don't want to get too sidetracked.
2024-09-03 10:12:07 +01:00
Sam Atkins
8cbc211616 Meta: Make embed_as_string_view.py produce Strings instead
This is only used for CSS style sheets. One case wants it as a String,
and the others don't care, but will in future also want to have the
source as a String.
2024-09-03 10:12:07 +01:00
Sam Atkins
240b58e90f LibWeb/CSS: Set @import as the owner rule of their loaded style sheet 2024-09-03 10:12:07 +01:00
Sam Atkins
4e18fce3a5 LibWeb: Set the location URL for @import-ed/<link>-ed style sheets
The spec text had changed for the value of `<link>`'s location, so I've
updated that.
2024-09-03 10:12:07 +01:00
Sam Atkins
c29f4f69ef LibWeb: Rename Document::for_each_css_style_sheet for clarity
This only iterates style sheets that are in use, so make this clear by
renaming it to `for_each_active_css_style_sheet()`.
2024-09-03 10:12:07 +01:00
Adam Harald Jørgensen
3e92ec80f3 LibWeb: Set correct longhand values when using grid-placement shorthand
According to https://www.w3.org/TR/css-grid-2/#placement-shorthands
when setting the 'grid-row' and 'grid-column' shorthand property to a
single <custom-ident> value, both 'grid-row-start'/'grid-column-start'
and 'grid-row-end'/'grid-column-end' should be set to that
<custom_ident>.
2024-08-29 07:00:00 +02:00
Samuel Fry
c42679597a LibWeb: Support parsing columns 2024-08-26 08:26:22 +01: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
84ab8bf797 LibWeb: Make CSS :hover selector match shadow-inclusive ancestors
Before this change, :hover wouldn't match anything outside the shadow
boundary when hovering elements inside a shadow tree. This was most
noticeable when hovering the text inside an input element and hover
styles disappearing from the hosting input element itself.
2024-08-25 12:53:08 +02:00
Sam Atkins
5bd585d446 LibWeb/CSS: Add dump method to CalculatedStyleValue
The individual nodes all have dump methods, but there was no way of
calling them from the outside. So now there is.
2024-08-21 10:51:48 +01:00
Sam Atkins
3af6a69f1e LibWeb: Introduce color-function-specific style values
Instead of CSSColorValue holding a Gfx::Color, make it an abstract class
with subclasses for each different color function, to match the Typed-OM
spec. This means moving the color calculations from the parsing code to
the `to_color()` method on the style value.

This lets us have calc() inside a color function, instead of having to
fully resolve the color at parse time. The canvas fillStyle tests have
been updated to reflect this.

The other test change is Screenshot/css-color-functions.html: previously
we produced slightly different colors for an alpha of 0.5 and one of
50%, and this incorrect behavior was baked into the test. So now it's
more correct. :^)
2024-08-21 10:51:48 +01:00
Sam Atkins
27be8678c9 LibWeb/CSS: Introduce helper methods for parsing numeric values
"Parse a style value for <foo>", where we don't care if it's a literal
<foo> or a calculated one, is a really common thing that we previously
didn't have methods for.

A couple of methods we had have been extended to parse calc(), and the
others have been filled in.

The method for parsing the `flex` property's value is renamed
`parse_flex_shorthand_value()` as it conflicted.
2024-08-21 10:51:48 +01:00
Sam Atkins
79bd942dd1 LibWeb/CSS: Inline number/integer parsing
For simplicity in user code, the `parse_foo_value()` methods should
parse anything that is a `<foo>`. In these cases, that means a
number/integer or calculation that resolves to them.

These uses in parse_css_value_for_properties() specifically only want a
literal IntegerStyleValue/NumberStyleValue, as calc-parsing is done
elsewhere. So, do the parsing for them locally.
2024-08-21 10:51:48 +01:00
Sam Atkins
9bc71ab1fe LibWeb/CSS: Stop using parse_color()
Parsing a `Gfx::Color` no longer makes sense, as CSS has many ways of
defining a color, often in a dynamic way where the color value isn't
known until later. This is a small preparatory change before a much
larger color rewrite.
2024-08-21 10:51:48 +01:00
Sam Atkins
37ea4e3b5f LibWeb: Rename CSSColorValue::create() to create_from_color()
Soon, CSSColorValue will be an abstract class, and we'll instead create
a CSSRGB, CSSHSL, or other specific color type from the Typed-OM spec.
However, it's still useful to have an easy "just give me a style value
for this color" method. So change the name to distinguish this from the
usual StyleValue::create() methods.
2024-08-21 10:51:48 +01:00
Sam Atkins
4e48afd9a7 LibWeb: Store ShadowStyleValue's color as a StyleValue
Colors can be specified in a way that `Gfx::Color` can't represent, such
as named system colors, `currentColor`, or functions involving `calc()`.
2024-08-21 10:51:48 +01:00
Sam Atkins
581d00293c LibWeb: Rename ColorStyleValue -> CSSColorValue
This matches the name in the CSS Typed OM spec.
https://drafts.css-houdini.org/css-typed-om-1/#csscolorvalue

This is not (yet) the same as the CSSColorValue, but one step at a time.
2024-08-21 10:51:48 +01:00
Sam Atkins
8952764267 LibWeb/CSS: Introduce CSSNumericValue and CSSUnitValue type stubs
CSS-Typed-OM has the following hierarchy:

CSSStyleValue
- CSSNumericValue
  - CSSUnitValue
  - CSSMathValue
    - ...various math functions...

Somewhat unintuitively, numbers are also stored using CSSUnitValue with
`unit = "number"`.

There are no distinct classes for LengthStyleValue, etc in the spec, but
they're convenient for us, so they are implemented as subclasses of
CSSUnitValue, at least for now.
2024-08-21 10:51:48 +01:00
Aliaksandr Kalenik
bc20e3ac6c LibWeb: Do not allocate mask bitmap for CSS "clip-path" property
Instead, it could be applied directly as a clip path in Skia painter.

As a side bonus, we get rid of some DeprecatedPath and
AntiAliasingPainter usage.
2024-08-20 20:00:56 +02:00
Andreas Kling
4bc3055c0f LibWeb: Only invalidate shadow root when style sheet inside changes
We don't have to invalidate style for the entire document when a style
sheet changes inside of a shadow root.

To make this possible, StyleSheetList now keeps track of which
Document-or-ShadowRoot it corresponds to, instead of just tracking the
containing Document.

This avoids a lot of style recomputation on pages with lots of shadow
DOM content (like GitHub).
2024-08-20 16:10:33 +02:00
Andreas Kling
c8f09312f7 LibGfx: Rename Path => DeprecatedPath 2024-08-20 09:30:05 +02:00
Aliaksandr Kalenik
69c6e07139 LibWeb: Move m_needs_repaint and record_display_list() in Document
Let's make document responsible for display list invalidation,
considering it already takes care of style and layout.
2024-08-19 18:57:20 +02:00
Tim Ledbetter
00f03f3e90 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.
2024-08-19 09:03:22 +02:00
Sam Atkins
f518811f73 LibWeb: Use CSSKeywordValue for CSS-wide keywords
We previously had 4 single-instance StyleValues for these keywords.
CSS-Typed-OM expects them keywords to be exposed as CSSKeywordValue, so
it's simpler to treat them the same. The single-instance behaviour is
kept by having StyleValue::create() use a cached instance for each of
these.
2024-08-15 13:58:38 +01: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
Sam Atkins
2e1f62681c LibWeb/CSS: Flatten ENUMERATE_STYLE_VALUE_TYPES macros
Being constrained by this macro is going to make it more difficult to
refactor our StyleValue types to match the Typed-OM spec, so let's
reintroduce the boilerplate for now.

No functional 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
Colin Reeder
b92abe5c26 LibWeb: Avoid calling matches before evaluate 2024-08-13 14:12:55 +02:00
Sam Atkins
80a20be176 LibWeb/CSS: Bring previous CSSRule parsing up to standard
GCPtrs instead of raw pointers, and logging when the media rule is
invalid.
2024-08-10 10:36:39 +02:00
Sam Atkins
9de73bf89b LibWeb/CSS: Parse gradient functions with TokenStream
They already used TokenStream for parsing the function parameters, but
this makes the `parse_foo_gradient()` functions themselves take a
TokenStream.
2024-08-10 10:36:39 +02:00
Sam Atkins
29d7aa9fc9 LibWeb/CSS: Parse url() functions with TokenStream 2024-08-10 10:36:39 +02:00
Sam Atkins
d5f3a610ac LibWeb/CSS: Split out @keyframes parsing code
Changes are very minimal, this is just a code move.
2024-08-10 10:36:39 +02:00
Sam Atkins
e5737232c0 LibWeb/CSS: Split out @supports parsing code 2024-08-10 10:36:39 +02:00