What I thought was a spec issue was actually a combination of my own
misunderstanding and a bug in our IDL generator. With that bug fixed, I
can correct this to how it is in the spec.
Reifying the result gets quite ad-hoc. Firstly because "parse a
component value" produces a ComponentValue, not a full StyleValue like
we need for math functions. And second, because not all math functions
can be reified as a CSSNumericValue:
Besides the fact that I haven't implemented CalculatedStyleValue
reification at all yet, there are a lot of math functions with no
corresponding CSSMathValue in the spec yet. If the calculation tree
contains any of those, the best we can do is reify as a CSSStyleValue,
and that isn't a valid return value from CSSNumericValue.parse(). So, I
made us throw a SyntaxError in those cases. This seems to match
Chrome's behaviour. Spec issue:
https://github.com/w3c/css-houdini-drafts/issues/1090
This reverts e7890429aa and partly reverts
a59c15481f.
The one pseudo-class that accepted multiple of these was :heading(), and
since that got changed to take integers instead, there's no need to keep
this extra complexity (and memory usage) around.
We originally had special handling for `:host()` as that had been the
only pseudo-class that could be both an identifier or a function.
However, this meant duplicating the serialization logic, and also we
had to manually remember to add the same hack for any other
identifier-and-function cases. Which I forgot to do with `:heading()`!
So instead, for these cases, detect if they actually have arguments
specified and use that to determine which form to serialize as. We do
still have to write a check for each one of these pseudo-classes, but
the VERIFY should make it easier to remember.
We now also store `outline-width` in ComputedValues as a `CSSPixels`
since we know it's an absolute length at `apply_style` time - this saves
us some work in converting to CSSPixels during layout.
Gains us 46 new passes since we now interpolate keywords (thick, thin,
etc) correctly.
Also loses us 4 WPT tests as we longer clamp negative values produced by
interpolation from the point of view of getComputedStyle (although the
'used' value is still clamped).
Gains us 112 new passes since we now interpolate keywords (thick, thin,
etc) correctly.
Also loses us 4 WPT tests as we longer clamp negative values produced by
interpolation from the point of view of getComputedStyle (although the
'used' value is still clamped).
`StyleValue`s stored within `ComputedProperties` should be in their
computed forms, this is for various reasons including:
- Inheritance should be of computed values
- Animations should work on computed values
- Triggering transitions should work on computed values
Currently we store `StyleValue`s in an absolutized version of the
specified value - this is equivalent to the computed form in many cases
which is why this hasn't been causing significant issues but there are
some cases - such as `border-*-width` keywords where this is not the
case.
No functionality change as we are yet to implement any properties
This removes the AnimationRefresh argument from `collect_animation_into`
which was added in a9b8840 - it's only effect was disallowing
`UseInitial`s within keyframes when we were doing animated style
updates which I believe is unintentional.
Gains us 214 WPT tests.
The StyleValue stored in m_property_values is already in it's computed
form and it's trivial to pull the underlying value out so there is no
need to store this separately.
Also removes unnecessary handling of percentage values in
`absolutize_values` - this is already handled within `compute_font`.
And make it a DOM::Node, not DOM::Element. This makes everything flow
much better, such as spec texts that explicitly mention "focused area"
as the fact that we don't necessarily need to traverse a tree of
elements, since a Node can be focusable as well.
Eventually this will need to be a struct with a separate "focused area"
and "DOM anchor", but this change will make it easier to achieve that.
The CSSNumericType defined in the spec is a simple dictionary which is
only used for OM purposes. This NumericType class is used internally
and matches the more abstract definition of a "type".
`StyleComputer::create_document_style` was the only place this wasn't
the case so we can remove the calls to
`compute_defaulted_property_value`. The call to
`compute_defaulted_values` in `create_document_style` is now redundant
so has been removed`
This was the last thing that `compute_defaulted_values` was doing when
called from here.
It also comes with the added benefit of us correctly inheriting animated
colors.
As `recompute_inherited_style` works in-place rather than building
ComputedProperties from scratch we need to keep track of which animated
properties are inherited to know whether we should remove them when we
have no more inherited value.
We don't serialize these the way WPT expects, because we don't implement
the comment-insertion rules from CSS-Syntax. We don't implement that
for regular serialization either, so it's something we can worry about
later.
The "subdivide into iterations" part is left as a FIXME for now, until
we have a way of knowing if a property is a list or not.
The parse_a_css_style_value() helper has an unwieldy return type because
of the requirement that it return either one value or a list of values,
but sticking to the spec here seems worthwhile for now.
For us, that's KeywordStyleValue and CustomIdentStyleValue.
CustomIdentStyleValue now has a .cpp file to reduce the number of
includes in its header file.
CSSStyleValue is adjusted to allow for subclasses. Serialization for
CSSKeywordValue is implemented differently than the spec says because
of a spec bug: https://github.com/w3c/csswg-drafts/issues/12545
This partially reverts commit 3aff3327c4
by removing the code change but keeping the added test.
Now that paintables visibility caching has been reverted, this is no
longer doing anything except causing excessive relayouts on pages
like https://linear.app/
When serializing the "style" attribute, we were incorrectly assuming
that some of the grid-related CSS properties would never contain var()
substitution functions.
With this fixed, we can now book appointments on https://cal.com/ :^)
This changes the maximum number of decimal places from 5 to 6, but 5 was
previously a guess, and not specified behaviour:
> For all of the decimal changes (except color) I couldn't really find a
> spec that mandates any required precision, so I just copied what
> Firefox seems to do, which is limit the output to 5 decimal places.
> https://github.com/SerenityOS/serenity/pull/23449
This property provides a hint to the rendering engine about properties
that are likely to change in the near future, allowing for early
optimizations to be applied.
When starting transitions we compute the after-change style, for any
inherited properties this should include the non-animated value.
Previously we were only inheriting the animated value and treating it as
non-animated so were instead including the animated value.
This commit fixes that by inheriting both the animated and non-animated
values (with the former being stored in `m_animated_property_values`,
and the latter in `m_property_values`).
This gains us 12 new WPT passes.
This brings with it 252 new WPT fails from the various 'events' tests in
css/css-transitions/properties-value-inherit-001.html, however these
also fail in other browsers (Chrome, Edge and Firefox) and the behaviour
that causes these failures is specifically mentioned in the spec.
This commit updates the CSSTransition constructor to:
- Leave the KeyframeEffect start time unresolved
- Set the KeyframeEffect start delay
Gains us 14 WPT passes but exposes one false positive in
properties-value-inherit-001.html
As of 7dc8062 paintables compute and cache their visibility (which
depends on opacity) at construction - this cached value can fall out of
sync with reality if if the opacity changes to/from zero within the
lifetime of that paintable.
This commit invalidates layout when an opacity changes to/from zero so
that we reconstruct paintables with the correct visibility.
The limitations right now are:
- We don't know if a property is a list or not.
- We always reify as a CSSStyleValue directly.
So, we pass some tests but only ones that expect a CSSStyleValue.
When no better reification form is available, we produce an opaque
CSSStyleValue with a serialized value. For starters, this will be the
only way to reify, and then we'll add others later.
After looking into this more, the `[[declarations]]` slot does not seem
to need to be a literal map of property names and values. Instead, it
can just point at the source (an element or style declaration), and
then direct all read or write operations to that.
This means the `has()` and `delete()` methods actually work now.
A few remaining failures in these tests are because of:
- StylePropertyMap[ReadOnly]s not being iterable yet
- We're not populating an element's custom properties map, which get
fixed whenever someone gets around to producing proper computed
values of them.
This isn't part of the CSSOM API directly, but will be used by
StylePropertyMapReadOnly.has() to avoid doing the work to serialize a
string version of the property's value, just to throw it away again.
Flex/grid items are always blockified (have their CSS display forced
into "block") by style computation.
We were doing this by looking at the CSS display of the parent. However,
if the parent has `display: contents`, we must look at the *grandparent*
instead.
This corrects the layout of buttons underneath Reddit article cards.
When a subtree is projected through a slot, its root now inherits style
from the slot's parent, rather than the parent of the unprojected root.
This fixes a ton of subtle issues, and is very noticeable on Reddit.
The current Color::interpolate_color method does not follow the specs
properly. Started improving it by handling premultiplied alpha in color
interpolation.
Only one WPT test covers this (color-transition-premultiplied), which we
currently pass due to a different approach in Color.mixed_with.
The upcoming `:heading()` pseudo-class takes multiple comma-separated
An+Bs. Also rename this field as the `:nth-[last-]child()`
pseudo-classes are only a subset of the users.
We now clamp the values returned from calc into the allowed range (where
we know it) and censor any `NaN`s to `0` both when we resolve and when
we serialize.
Gains us 76 WPT passes.
Returning this struct will allow us to modify the underlying value of
the `CalculationResult` without requiring us to go through the process
of constructing a whole new `CalculationResult` to return.
This currently only applies to property-level calculation contexts, more
work to be done to generate accepted ranges for other calculation
contexts (e.g. within transformation functions, color functions, etc)
When converting rotate transform functions `sin` and `cos` can sometimes
be inaccurate. To avoid these inaccuracies we:
- Mod the angle to minimise inaccuracies in the first place.
- Discard tiny (smaller than epsilon) values returned by `sin` and
`cos` as inaccuracies.
This is in line with other browsers (e.g. Gecko and WebKit).
CSSUnitValue is a typed-om type which we will implement separately in
the future. However, it still seems useful to give our dimension values
a base class. (Maybe they could be templated in the future?) So instead
of deleting it entirely, rename it to DimensionStyleValue and make its
API match our style better.
This reverts 0e3487b9ab.
Back when I made that change, I thought we could make our StyleValue
classes match the typed-om definitions directly. However, they have
different requirements. Typed-om types need to be mutable and GCed,
whereas StyleValues are immutable and ideally wouldn't require a JS VM.
While I was already making such a cataclysmic change, I've moved it into
the StyleValues directory, because it *not* being there has bothered me
for a long time. 😅
- Omit calcs that are resolved to `0px` from the serialized value
- Allow CSV to be the 'Z' component in interpolated value.
- Allow calcs with mixed percentages in the first two arguments.
To achieve the third item above the concept of a "special" value parsing
context has been added - this will also be useful for instance for
different arguments of color functions having different contexts.
Gains us 23 WPT tests
Technically, env() should not be an ASF. (😱) This is why some tests
still fail - env() as specced is expected to have its syntax checked
fully at parse-time, whereas ASFs are not properly syntax-checked until
later. However, I think this approach was worth doing for a few reasons:
- env() behaves like an ASF otherwise. (It is replaced with a set of
arbitrary component-values that are not known until computed-value
time.)
- env() was defined before the ASF concept existed, so I strongly
suspect it will be updated in the future to match that definition,
with a couple of adjustments. (eg, env() is allowed in some extra
places compared to var() and attr().)
- This was much quicker and easier to implement (under 3 hours in total)
compared to the greater amount of work to implement a whole separate
system just for env().
- Most of these tests are marked tentative, and the spec definition of
env() is still somewhat in flux, so failing some is not a huge deal.
If in the future I turn out to be wrong on this, we can convert it to
its own special thing.
This commit regresses a couple tests related to the mask shorthand
property. This is because we now parse the longhands but there are
errors related to serialization. Some of the failures are fixed again in
the next commit. However, for some animation tests this is not the case.
Those failures were simply masked by the fact that we did not parse the
property correctly.
These will be used for the mask-repeat property as well in an upcoming
commit, hence the more generic names. Also, this more closely matches
the names used in the spec.
