Commit graph

2116 commits

Author SHA1 Message Date
Matthew Olsson
0f54d797d2 LibWeb: Handle pre-existing animations when considering animation-name
If a DOM::Element has an animation-name property, then in addition to
remembering where it came from, it will also remember the
Animations::Animation object that was created for it. This allows
StyleComputer to cancel that animation if the animation-name property
changes as well as to apply any changes required (for example, if
animation-play-state changes from "running" to "paused", it needs to
call .pause() on the animation).
2024-02-25 21:12:42 +00:00
Matthew Olsson
b235620315 LibWeb: Pause keyframe animations during creation when necessary 2024-02-25 21:12:42 +00:00
Matthew Olsson
2ee022dead LibWeb: Set KeyframeEffect's pseudo-element if applicable 2024-02-25 21:12:42 +00:00
Shannon Booth
9ce8189f21 Everywhere: Use unqualified AK::URL
Now possible in LibWeb now that there is no longer a Web::URL.
2024-02-25 08:54:31 +01:00
Matthew Olsson
b33bb0997a LibWeb: Move easing parsing code out into a dedicated function
This will be used outside of StyleComputer
2024-02-25 08:51:50 +01:00
Matthew Olsson
c8b9c137a1 LibWeb: Handle discrete properties
This also changes transform's animation-type to by-computed-value. It is
far easier to handle since we switch on StyleValue::type(), and it might
be the case that this applies to all custom animated properties and we
don't need "custom" at all, but let's wait until we get to those
properties to make that decision.
2024-02-25 08:51:50 +01:00
Matthew Olsson
9e0ff9c140 LibWeb: Expose CSS shorthand -> longhand conversion
This conversion needs to be done by KeyframEffect as well
2024-02-25 08:51:50 +01:00
Matthew Olsson
af1f0c673e LibWeb: Remove old animation-direction handling from StyleComputer
This is now handled by Web Animations, so if the animation was ever
running backwards, this logic would re-reverse it so that it played
forwards again.
2024-02-25 08:51:50 +01:00
Matthew Olsson
70ded2ef42 LibGfx: Add Oklab support to Gfx::Color
Interpolation of color on the web is done via the oklab colorspace
2024-02-25 08:51:50 +01:00
Tim Ledbetter
1d825f17c0 LibWeb: Remove first rule if no argument is given for remove_rule()
While this isn't explicitly mentioned in the specification, there is a
WPT test that checks for this behavior.
2024-02-24 21:59:28 +01:00
Tim Ledbetter
3ea318ca8b LibWeb: Implement CSSStyleSheet.addRule()
This is a legacy method that has been superseded by `insertRule()`,
although it is supported by all modern browser engines.
2024-02-24 21:59:28 +01:00
Tim Ledbetter
87b52a1816 LibWeb: Implement CSSStyleSheet.replaceSync()
This method behaves the same as `CSSStyleSheet.replace()` but the
operation is performed synchronously.
2024-02-24 21:59:28 +01:00
Tim Ledbetter
81c67d34eb LibWeb: Implement CSSStyleSheet.replace()
This method asynchronously replaces the content of the given stylesheet
with the content passed to it.

An exception is thrown if this method is used by a stylesheet not
created with the `CSSStyleSheet()` constructor.
2024-02-24 21:59:28 +01:00
Tim Ledbetter
d209d5a84f LibWeb: Ensure CSSStyleSheet::css_rules() always returns the same object
Instead of having a method that replaces the stylesheet's CSSRuleList,
we now have a method on CSSRuleList to modify it's underlying CSSRules.
2024-02-24 21:59:28 +01:00
Tim Ledbetter
811033ec19 LibWeb: Disallow inserting @import rules into a constructed stylesheet 2024-02-24 21:59:28 +01:00
Tim Ledbetter
b0f57a2785 LibWeb: Add CSSStyleSheet constructor binding 2024-02-24 21:59:28 +01:00
Tim Ledbetter
f303905875 LibWeb: Add the CSSStyleSheet.rules alias for CSSStyleSheet.cssRules 2024-02-24 21:59:28 +01:00
Tim Ledbetter
9b1ea4e2fc LibWeb: Add CSSStyleSheet.ownerRule attribute
This returns the `CSSImportRule` corresponding to the `@import` at-rule
that imported the stylesheet into the document. If the stylesheet
wasn't imported then this property is null.
2024-02-24 21:59:28 +01:00
Matthew Olsson
4e27d07ff2 LibWeb: Use initial value for animation start if it does not exist
This fixes an issue where a property could not be animated unless the
element had a specified value for that property somewhere in its
styling.
2024-02-23 20:52:37 +01:00
Matthew Olsson
ae3326a447 LibWeb: Transition StyleComputer to Web Animations
With this commit, we are finally running animations off of the web
animations spec! A lot of the work StyleComputer is doing is now done
elsewhere. For example, fill-forward animations are handled by
Animation::is_relevant() returning true in the after phase, meaning the
"active_state_if_fill_forward" map is no longer needed.
2024-02-23 20:52:37 +01:00
Matthew Olsson
ceb9d0f8dc LibWeb: Record position of Animations in global animation list
"position of an Animation in the global animation list" is a fancy way
of saying "which animation object was created first"
2024-02-21 19:52:35 +01:00
Matthew Olsson
c3b689488e LibWeb: Implement animation class-specific composite order
This is a part of determining the composite order of two animations
2024-02-21 19:52:35 +01:00
Tim Ledbetter
c5d1ec4dea LibWeb/CSS: Ensure length is absolute before converting to pixels
Previously, creating a DOMMatrix with a transform that contained
non-absolute units would cause a crash.
2024-02-21 19:38:17 +01:00
Nico Weber
24a469f521 Everywhere: Prefer {:#x} over 0x{:x} in format strings
The former automatically adapts the prefix to binary and octal
output, and is what we already use in the majority of cases.

Patch generated by:

    rg -l '0x\{' | xargs sed -i '' -e 's/0x{:/{:#/'

I ran it 4 times (until it stopped changing things) since each
invocation only converted one instance per line.

No behavior change.
2024-02-21 17:54:38 +01:00
Timothy Flynn
debb5690ce LibWeb: Begin implementing the HTMLInputElement 'image' type state
This implements enough to represent <input type=image> with its loaded
source image (or fallback to its alt text, if applicable). This does not
implement acquring coordinates from user-activated click events on the
image.
2024-02-19 11:07:30 +01:00
Tim Ledbetter
ea9bc8ed6b LibWeb: Set cursor: default for button and select elements
This prevents an IBeam cursor being shown when these elements are
moused over.
2024-02-18 15:44:49 -05:00
Matthew Olsson
faaf5b9652 LibWeb: Add the AnimationEvent IDL objects 2024-02-16 12:02:11 -07:00
Matthew Olsson
3a87c000c4 LibWeb: Add the CSSAnimation IDL object 2024-02-16 12:02:11 -07:00
Matthew Olsson
212a139292 LibWeb: Add a way to test if a CSS::PropertyID is animatable 2024-02-13 19:44:44 +01:00
Tommy van der Vorst
1c7ec9c770 LibWeb: Ignore repeat(auto-fit/auto-fill, auto) as it is not allowed 2024-02-11 17:51:50 +01:00
Aliaksandr Kalenik
7411f66fcf LibWeb/CSS: Resolve value of "height" in special way according to spec
Per spec value of height should be resolved to used value if "display"
property is not "none" or "contents".
2024-02-06 08:41:21 +01:00
Aliaksandr Kalenik
623ad94582 LibWeb: Resolve effective overflow-x and overflow-y according to spec
Implements following rule from CSS Overflow Module Level 3:
"The visible/clip values of overflow compute to auto/hidden
(respectively) if one of overflow-x or overflow-y is neither visible
nor clip."
2024-02-06 08:39:06 +01:00
MacDue
b10f58a1fe LibWeb: Support x and y attributes on nested SVGs
This allows positioning a child SVG relative to its parent SVG.

Note: These have been implemented as CSS properties as in SVG 2, these
are geometry properties that can be used in CSS (see
https://www.w3.org/TR/SVG/geometry.html), but there is not much browser
support for this. It is nicer to implement than the ad-hoc SVG
attribute parsing though, so I feel it may make sense to port the rest
of the attributes specified here (which should fix some issues with
viewport relative sizes).
2024-01-29 10:01:10 +00:00
Andreas Kling
546143e9a6 LibWeb: Fix vector OOB access when comparing some calc() values
Before comparing the elements of two vectors, we have to check that
they have the same length. :^)

Fixes a crash seen on https://chat.openai.com/
2024-01-27 17:06:43 +01:00
Andreas Kling
ad7e6878fe LibWeb: Allocate CSS::ComputedValues objects on the heap
This makes them cheap to move around, since we can store them in a
NonnullOwnPtr instead of memcopying 2584(!) bytes.

Drastically reduces the chance of stack overflow while building the
layout tree for deeply nested DOMs (since tree building was putting
these things on the stack).

This change also exposed a completely unnecessary ComputedValues deep
copy in block layout.
2024-01-27 12:27:44 +01:00
Sam Atkins
391cfdc085 LibWeb: Parse the CSS transform-box property 2024-01-27 07:46:37 +01:00
Aliaksandr Kalenik
7e2308d290 LibWeb: Treat null as empty string in CSSStyleDeclaration::internal_set
Spec defines `[LegacyNullToEmptyString]` on `value` argument of
`setProperty` but since `internal_set` calls `setProperty` directly
instead of using IDL generated binding, we need to make sure that null
is treated as empty string.

Fixes items grid loading on https://d.rsms.me/stuff/
2024-01-21 21:03:39 +01:00
Sam Atkins
3df3a85235 LibGfx+Userland: Move FontWeight enum into its own file
FontDatabase.h with its includes add up to quite a lot of code. In the
next commit, compiled GML files are going to need to access the
FontWeight enum, so let's allow them to do that without pulling in lots
of other things.

Also, change users to include FontWeight.h instead of FontDatabase.h
where appropriate.
2024-01-21 09:32:10 -05:00
Bastian Neumann
7cd489d6aa LibWeb: Remove early continue in size parsing
Step 5 of parsing was always skipped because step 4 continues.

Running step 5 causes some of the denominators to be 0 and causes
divide by zero error in CSSPixelFraction.

SVG Image with height of 0 will cause divide by zero error when
calculating intrinsic aspect ratio of SVGDecoderImageData.

We also get a divide by zero error in AlignContent::SpaceBetween of the
FlexFormatingContext.

During auto track stretching in GridFormatingContext there is a
possibility for count_of_auto_max_sizing_tracks to stay 0.
2024-01-20 15:22:25 +01:00
Bastiaan van der Plaat
5ba8a5ba13 LibWeb: Fix bug where input range thumb is not centered 2024-01-19 19:36:28 +01:00
Bastiaan van der Plaat
5f5ac48908 LibWeb: Format all .idl files to use four space indentation 2024-01-18 14:00:06 +01:00
Aliaksandr Kalenik
a22ef086f5 LibWeb/CSS: Support calc() in grid placement values
Fixes reduction in https://github.com/SerenityOS/serenity/issues/22802
but does not result in visual improvement on https://kotlinlang.org/
2024-01-17 17:26:55 +01:00
Aliaksandr Kalenik
f529188fb8 LibWeb: Resolve CSS transform lengths against padding rect
Fixes https://github.com/SerenityOS/serenity/issues/22797
2024-01-16 21:54:10 +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
f0722671c3 LibWeb: Cache the viewport rect across all of style computation
Fetching the viewport rect is currently somewhat expensive, since it
requires finding the navigable the document is active in.

We can avoid the cost of repeated calls by simply allowing StyleComputer
to cache the viewport rect at the start of style computation.
2024-01-12 14:12:04 +01:00
Andrew Kaster
521ed0e911 LibWeb: Delete LegacyPlatformObject and move behavior to PlatformObject
We have two known PlatformObjects that need to implement some of the
behavior of LegacyPlatformObjects to date: Window, and HTMLFormElement.

To make this not require double (or virtual) inheritance of
PlatformObject, move the behavior of LegacyPlatformObject into
PlatformObject. The selection of LegacyPlatformObject behavior is done
with a new bitfield of feature flags instead of a dozen virtual
functions that return bool. This change simplifies every class involved
in the diff with the notable exception of Window, which now needs some
ugly const casts to implement named property access.
2024-01-12 09:11:18 +01:00
Aliaksandr Kalenik
225ed58f7e LibWeb/CSS: Resolve NumericCalculationNode to percentage when requested
When the caller of NumericCalculationNode::resolve() does not provide
a percentage_basis, it expects the method to return a raw percentage
value.

Fixes crashing on https://discord.com/login
2024-01-11 08:01:47 +01:00
Shannon Booth
d95461ebe1 LibWeb: Allow 'center' in 3-value background-positions
The grammar which we implemented did not match the spec, resulting in us
rejecting background positions which contained 'center' position
keywords.

Fixes: #22401
2024-01-10 23:27:28 +01:00