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.
We were transforming coordinates for SVG gradients in a pretty
convoluted way: an inverse, unscaled transformation matrix was set up in
order to work around some (old?) technical limitations.
Rework this so the coordinate transformation no longer needs to be
inversed. This fixes gradients with "userSpaceOnUse" for its
gradientUnits attribute, which might cause coordinates to lie outside of
the bounding box of the gradient.
Two tests have updated reference screenshots with minor pixel updates;
this is probably the result of floating point precision improvements by
not inversing the matrix.
One test (svg-text-effects) has a bigger change: the gradient stops seem
to have moved along the text. This does seem to match other browsers
slightly better, so I'm moving forward with this ref update.
1. We were not propagating selectedness updates from option to select
if the option was inside an optgroup.
2. When two or more options were selected, we were always favoring the
last one in tree order, instead of the last one that got checked.
3. We were neglecting to return in the `display size is 1` case when
all elements were disabled.
This was covered by some of the :has() selector tests. :^)
We basically need to do this for every invocation of invalidate_style()
right now, so let's just do it inside invalidate_style() itself.
Fixes one missing invalidation issue caught by a WPT test. :^)
And here's the wild part: instead of cloning WPT tests, import the
relevant WPT tests that this fixes into our own test suite.
This works by adding a small Ladybird-specific callback in
resources/testharnessreport.js (which is what that file is meant for!)
Note that these run as text tests, and so they must signal the runner
when they are done. Tests using the "usual" WPT harness should just
work, but tests that do something more freestyle will need manual
signaling if they are to be imported.
I've also increased the test timeout here from 30 to 60 seconds,
to accommodate the larger WPT-style tests.
When aspect-ratio is degenerate (e.g. 0/1 or 1/0) we should
fallback to the same behaviour as `aspect-ratio: auto` according to spec
This commit explicitly handles this case and fixes five WPT test in
css/css-sizing/aspect-ratio (zero-or-infinity-[006-010])
This condition was included to implement flex containers with auto
height, but it actually can reset the definitive height to 0 for inline
blocks with only replaced elements such as an SVG. Removing the
condition does not break any in-tree test, so let's improve the
situation on the SVG side of things for now.
Since `Storage::item_value` never returns an empty Optional,
and since `PlatformObject::is_supported_property_index` only
returns false when `item_value` returns an empty Optional,
the loop in `PlatformObject::internal_own_property_keys` will
never terminate when executed on a `Storage` instance.
This fix allows youtube.com to load successfully :^)
These files seem to have been marked as executable by error.
Found by running the command:
find \( -name WPT -or -name Toolchain -or -name Build \) \
-prune -or -executable \! -type d -print \
| grep -Pv '\.(sh|py)$'
This change completes handling for all ARIA properties defined in the
current ARIA spec — by adding handling for the following properties:
- aria-braillelabel
- aria-brailleroledescription
- aria-colindextext
- aria-description
- aria-rowindextext
This implementation is incomplete in that we do not fully implement the
steps to match the given font against the fonts in the set.
This is used by fonts.google.com to load the fonts used for sample text.
This ensures we cannot set or get cookies on non-HTTP(S) origins. Since
this would prevent our ability to test cookies during LibWeb tests, this
also adds an internals API to allow cookie access on file:// URLs.
With 6a549f6270 we need to check if
optional scrollable overflow exists for paintable box, because it's not
computed for inline nodes.
Fixes crashing after navigating into direct messages screen on Discord.
The reason we were keeping track of the pre-shaping buffer was to know
where we had tab characters in the input. This is a very strange way of
doing that, but since it broke the web, let's patch it up quickly.
Follow-up to #1870 which broke text layout on many web pages.
This fixes a browser crash as experienced on Wikipedia when encountering
the ≠ entity. As a side-effect, this also affects some tab-align and
-wrap tests.
Per css-ui-4, setting `appearance: none` is supposed to suppress the
creation of a native-looking widget for stuff like checkboxes, radio
buttons, etc.
This patch implements this behavior by simply falling back to creating
a layout node based on the CSS `display` property in such cases.
This fixes an issue on the hey.com imbox page where we were rendering
checkboxes on top of sender profile photos.
We only supported named properties on Storage, and as a result
`localStorage[0]` would be disconnected from the Storage's backing map.
Fixes at least 20 subtests in WPT in /webstorage.
These are created when a style rule has properties listed after another
rule. For example:
```css
.test {
--a: 1;
--b: 1;
--c: 1;
.thing {
/* ... */
}
/* These are after a rule (.thing) so they're wrapped in a
CSSNestedDeclarations: */
--d: 1;
--e: 1;
--f: 1;
}
```
They're treated like a nested style rule with the exact same selectors
as their containing style rule.
For example, this:
```css
.foo {
color: red;
&:hover {
color: green;
}
}
```
now has the same effect as this:
```css
.foo {
color: red;
}
.foo:hover {
color: green;
}
```
CSSStyleRule now has "absolutized selectors", which are its selectors
with any `&`s resolved. We use these instead of the "real" selectors
when matching them, meaning the style computer doesn't have to know or
care about where the selector appears in the CSS document.
We were hard-coding "about:blank" as the document URL for parsed HTML
documents, which was definitely not correct.
This fixes a bunch of WPT tests under /domparsing/ :^)
On any `display: list-item` Node a CSS pseudo element (`::marker`) needs
to be created. This commit allows the ::maker pseudo element to be
nested within other pseudo elements (e. g. ::before or ::after).
This fixes this WPT test:
http://wpt.live/css/CSS2/generated-content/after-content-display-003.xht
This resolves all WPT timeouts in html/canvas/element/manual/imagebitmap
We can now run an additional 6 tests and 126 subtests :)
This also adds regression tests for this behavior.
InlinePaintable was an ad-hoc paintable type required to support the
fragmentation of inline nodes across multiple lines. It existed because
there was no way to associate multiple paintables with a single layout
node. This resulted in a lot of duplicated code between PaintableBox and
InlinePaintable. For example, most of the CSS properties like
background, border, shadows, etc. and hit-testing are almost identical
for both of them. However, the code had to be duplicated to account for
the fact that InlinePaintable creates a box for each line. And we had
quite many places that operate on paintables with a code like:
```
if (box.is_paintable_box()) {
// do something
} else (box.is_inline_paintable()) {
// do exactly the same as for paintable box but using InlinePaintable
}
```
This change replaces the usage of `InlinePaintable` with
`PaintableWithLines` created for each line, which is now possible
because we support having multiple paintables per layout node. By doing
that, we remove lots of duplicated code and bring our implementation
closer to the spec.
Always create a new formatting context for <math> elements. Previously
that didn't happen if they only had inline children, e.g. mtable.
This fixes a crash in the WPT MathML test
mathml/crashtests/children-with-negative-block-sizes.html
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));')
```
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 ``.
This will be the first step is making better use of system libraries
like fontconfig and CoreText to load system fonts for use by the UI
process and the CSS style computer.
This reverts 6d25bf3aac
Invalidating the style here means that transitions can cause an element
to leave style computation with its "needs style update" flag set to
true. This then causes a VERIFY to fail in the TreeBuilder.
This invalidation does not otherwise seem to have any effect. The
original commit suggests this was to fix a bug, but it's not clear what
bug that was. If it reappears, we can try to solve the issue in a
different way.
These don't have to worry about the input not being valid UTF-8 and
so can be infallible (and can even return self if no changes needed.)
We use this instead of Infra::to_ascii_{upper,lower}_case in LibWeb.
- Include vertical border spacing in row group offset calculation so
that they are axis-aligned with child row/cell elements. This makes it
so there isn't horizontal and vertical overflow caused by child
row/cell elements.
- Include horizontal border spacing in tr width calculations. This makes
it so tr elements don't have overflow anymore when there are multiple
columns.
- Apply vertical caption offset to row group top offset.
- Don't double-count top padding when calculating vertical offset for
tr and row groups.
Cookies have a minimum expiry resolution of 1 second. So to test cookie
expiration, the test had to idle for at least a second, which is quite a
noticeable delay now that LibWeb tests are parallelized.
Instead, we can add an internal API to expire cookies with a time offset
to avoid this idle delay.
Previously Selection.extend() used only the relative node order to decide which
direction to extend the selection. This leads to incorrect behaviour if
both the existing and new boundary points are within the same DOM node
and the selection direction is reversed.
This change fixes all the failing subtests in the WPT extend-* test
suites.
DedicatedWorkerGlobalScope is an object with a Global extended
attribute, but does not define any named property getters. This needs to
be handled by setting the prototype chain to:
DedicatedWorkerGlobalScope
^ DedicatedWorkerGlobalScopePrototype
^ WorkerGlobalScopePrototype
(This is different from something like Window, where there is an
intermediate WindowProperties object for named properties.)
Previously, we treated the GlobalMixin object as if it was a simple
prototype object, accidentally setting DedicatedWorkerGlobalScope's
prototype to WorkerGlobalScopePrototype. This caused the expression
self instanceof DedicatedWorkerGlobalScope
to return false inside workers.
This makes us pass many more of the "/xhr/idlharness.any.worker" WPT
tests than before, rather than failing early.
The "isCollapsed" attribute on a selection must "return true if and only
if the anchor and focus are the same".
In addition to checking that the anchor and focus belonged to the same
DOM node, we now also check that they refer to the same position within
the node.
With this change Ladybird passes all the subtests in the "isCollapsed"
WPT suite.
https://wpt.live/selection/isCollapsed.html
- Add support for placement of abspos items into track formed by last
line and padding edge of grid container
- Correctly handle auto-positioned abspos items by placing them between
padding edges of grid container
Fixes crashing on https://wpt.live/css/css-grid/abspos/positioned-grid-descendants-001.html
The video was accidentally removed in commit d5ba665f89.
This adds the video back to the LibWeb/Text/data folder, and validates
that the video loads in the test that depends on it loading.
We have support for using (shift+)tab to move focus to the next/previous
element on the page. However, there were several ways for this to crash
as written. This updates our implementation to check if we did not find
a node to move focus to, and to reset focus to the first/last node in
the document.
This doesn't seem to work when wrapping around from the first to the
last node. A FIXME has been added for that, as this would already not
work before this patch (the main focus here is not crashing).
Our handling of left vs. right modifiers keys (shift, ctrl, etc.) was
largely not to spec. This patch adds explicit UIEvents::KeyCode values
for these keys, and updates the UI to match native key events to these
keys (as best as we are able).
...traversal. We've already fixed step 3 and 9 to not filter out
non-positioned stacking contexts, because modern CSS has more ways to
create stacking context besides being positioned with z-index (like by
using "transform", "filter" or "clip-path" properties).
See following spec issue for more details https://github.com/w3c/csswg-drafts/issues/2717
Visual improvement on https://basecamp.com/
Prior to this change, SVGs were following the CSS painting order, which
means SVG boxes could have established stacking context and be sorted by
z-index. There is a section in the spec that defines what kind of SVG
boxes should create a stacking context
https://www.w3.org/TR/SVG2/render.html#EstablishingStackingContex
Although this spec is marked as a draft and rendering order described in
this spec does not match what other engines do.
This spec issue comment has a good summary of what other engines
actually do regarding painting order
https://github.com/w3c/svgwg/issues/264#issuecomment-246432360
"as long as you're relying solely on the default z-index (which SVG1
does, by definition), nothing ever changes order when you apply
opacity/filter/etc".
This change aligns our implementation with other engines by forbidding
SVGs to create a formatting context and painting them in order they are
defined in tree tree.
When the TokenStream code was originally written, there was no such
concept in the CSS Syntax spec. But since then, it's been officially
added, (https://drafts.csswg.org/css-syntax/#css-token-stream) and the
parsing algorithms are described in terms of it. This patch brings our
implementation in line with the spec. A few deprecated TokenStream
methods are left around until their users are also updated to match the
newer spec.
There are a few differences:
- They name things differently. The main confusing one is we had
`next_token()` which consumed a token and returned it, but the spec
has a `next_token()` which peeks the next token. The spec names are
honestly better than what I'd come up with. (`discard_a_token()` is a
nice addition too!)
- We used to store the index of the token that was just consumed, and
they instead store the index of the token that will be consumed next.
This is a perfect breeding ground for off-by-one errors, so I've
finally added a test suite for TokenStream itself.
- We use a transaction system for rewinding, and the spec uses a stack
of "marks", which can be manually rewound to. These should be able to
coexist as long as we stick with marks in the parser spec algorithms,
and stick with transactions elsewhere.
Before this change, we transferred the input element's line-height to
both the editable text *and* the placeholder. This caused some strange
doubling of the effective line-height when the editable text was empty,
pushing down the placeholder.
The spec expects `postMessage()` to act as if it is invoked
immediately. Since `postMessage()` isn't actually invoked immediately,
keep tasks with source `PostedMessage` in the task queue, so that these
tasks are processed. Fixes a hang when `WorkerGlobalScope.close()` is
called immediately after `postMessage()`.
https://www.w3.org/TR/event-timing/#sec-performance-event-timing
Add idl, header and stubs for PerformanceEventTiming interface.
Two missing `PerformanceEntry` types that have come up in issues
are the `first-input` and the `event` entryTypes. Those are both
this.
Also, because both of those are this same interface, the static
methods from the parent class are difficult to implement because
of instance-specific details. Might either need subclasses or to
edit the parent and also everything that inherits from it :/
