Commit Graph

105 Commits

Author SHA1 Message Date
Timothy Flynn
72905c84d5 LibWeb+LibWebView+WebContent: Support both inspecting/highlighting nodes
Our own Inspector differs from most other DevTools implementations with
regard to highlighting DOM nodes as you hover elements in the inspected
DOM tree. In other implementations, as you change the hovered node, the
browser will render a box model overlay onto the page for that node. We
currently don't do this; we wait until you click the node, at which
point we both paint the overlay and inspect the node's properties.

This patch does not change that behavior, but separates the IPCs and
internal tracking of inspected nodes to support the standard DevTools
behavior. So the DOM document now stores an inspected node and a
highlighted node. The former is used for features such as "$0" in the
JavaScript console, and the latter is used for the box model overlay.
Our Inspector continues to set these to the same node.
2025-02-24 12:05:29 -05:00
InvalidUsernameException
f7276bfab3 LibWeb: Reduced number of recompiled files for CSS property headers
This reduces the number of `.cpp` files that need to be recompiled when
one of the below header files changes as follows:

CSS/ComputedProperties.h: 1113 -> 49
CSS/ComputedValues.h: 1120 -> 209
2025-02-23 10:14:39 -05:00
InvalidUsernameException
be47f95180 LibWeb: Reduce number of recompiled files for display list headers
This reduces the number of `.cpp` files that need to be recompiled when
one of the below header files changes as follows:

Painting/Command.h: 1030 -> 61
Painting/DisplayList.h: 1030 -> 60
Painting/DisplayListRecorder.h: 557 -> 59
2025-02-23 10:14:39 -05:00
Tim Ledbetter
d410fa8381 LibWeb: Ensure inert elements are not selectable 2025-02-21 12:41:57 +00:00
Tim Ledbetter
cb405c773b LibWeb: Ensure inert elements are not visible for hit testing 2025-02-21 12:41:57 +00:00
Glenn Skrzypczak
0750513993 LibWeb: Support reversed ordered lists
This PR adds support for the `reversed` attribute of
ordered lists.
2025-02-21 04:23:28 +00:00
Andreas Kling
fb020a3c8f LibWeb: Store final box model metrics in paint tree, not layout tree
This was a weird case of layout results being stored in the layout tree
instead of in the paint tree like everything else.
2025-02-17 18:28:29 +01:00
Sam Atkins
0fd0596dbf LibWeb: Support strings as list-style-types
We've long claimed to support this, but then silently ignored string
values, until 4cb2063577 which would
not-so-silently crash instead. (Oops)

So, actually pass the string value along and use it in the list marker.

As part of this, rename our `list-style-type` enum to
`counter-style-name-keyword`. This is an awkward name, attempting to be
spec-based. (The spec says `<counter-style>`, which is either a
`<counter-style-name>` or a function, and the `<counter-style-name>` is
a `<custom-ident>` that also has a few predefined values. So this is the
best I could come up with.)

Unfortunately only one WPT test for this passes - the others fail
because we produce a different layout when text is in `::before` than
when it's in `::marker`, and similar issues.
2025-02-11 10:39:27 +01:00
Sam Atkins
b987d53926 LibWeb: Migrate ListItemMarkerBox's text from ByteString to String 2025-02-11 10:39:27 +01:00
Glenn Skrzypczak
0fe30886f5 LibWeb/CSS: Implement mix-blend-mode
This adds support for the `mix-blend-mode` CSS property.
2025-02-05 11:26:58 +00:00
Aliaksandr Kalenik
ec6201806f LibWeb: Delete tree treversal methods defined in Paintable.h
Those are duplicates of ones inherited from TreeNode.
2025-02-03 18:36:57 +01:00
Mehran Kamal
cfe6702767 LibWeb/CSS: Fix linear-gradient single color-stop usage
The Web::CSS::Parser's GradientParsing ignores color-stops if
it is only a single one. This change allows to have color-stops
with double positions against a single color.

Further, also allows for `linear-gradient(black)` and similar
other gradient functions
2025-02-03 17:24:10 +00:00
Gingeh
93f9ed72d2 LibWeb/SVG: Skip unwanted transformations on clip-path 2025-02-01 13:38:56 +01:00
Jelle Raaijmakers
f204970052 LibWeb: Ignore fragments with pointer-events: none in hit-testing 2025-01-31 13:37:15 +01:00
Jelle Raaijmakers
e7add9abc6 LibWeb: Remove unnecessary const_casts from TextPaintable 2025-01-31 13:37:15 +01:00
Jelle Raaijmakers
cbe78454fc LibWeb: Remove unused includes from PaintableFragment 2025-01-31 13:37:15 +01:00
Jelle Raaijmakers
342cb7addf LibGfx+LibWeb: Reuse DisplayListPlayer and PaintingSurface when possible
Previously, we were reinstantiating the DisplayListPlayer and
PaintingSurface on every paint.
2025-01-31 13:28:09 +01:00
Jelle Raaijmakers
4fbeea6482 LibWeb+Services: Remove unused #includes
No functional changes.
2025-01-31 13:28:09 +01:00
Aliaksandr Kalenik
a4c331c199 LibWeb: Fix unnecessary wheel event consumption with overflow: scroll
Allow wheel event to be consumed by a `overflow: scroll` box only if it
has content that overflows a scrollport.

This fixes the timing issue in the
`Text/input/scroll-window-using-wheel-event.html` test, where a `<body>`
element with `overflow: scroll` was incorrectly consuming wheel events
that should have propagated to the window.
2025-01-31 00:11:34 +01:00
Aliaksandr Kalenik
74dde4dc0f LibWeb: Rename is_scrollable() to could_be_scrolled_by_wheel_event()
Previous name for misleading because it checks if box could be scrolled
by user input event which is diffent from checking if box is scrollable.
For example box with `overflow: hidden` is scrollable but it can't be
scrolled by user input event.
2025-01-31 00:11:34 +01:00
Sam Atkins
385c3d273a LibWeb/CSS: Update CalculatedOr API to use CalculationResolutionContext
To be properly compatible with calc(), the resolved() methods all need:
- A length resolution context
- To return an Optional, as the calculation might not be resolvable

A bonus of this is that we can get rid of the overloads of `resolved()`
as they now all behave the same way.

A downside is a scattering of `value_or()` wherever these are used. It
might be the case that all unresolvable calculations have been rejected
before this point, but I'm not confident, and so I'll leave it like
this for now.
2025-01-30 19:31:54 +01:00
Jelle Raaijmakers
84c4702b10 LibWeb: Handle continuation chain during hit-testing instead of after it
My previous attempt at resolving the continuation chain tried to deal
with `pointer-events: none` by repeatedly falling back to the parent
paintable until one was found that _would_ want to handle pointer
events. But since we were no longer performing hit-tests on those
paintables, false positives could pop up. This could happen for
out-of-flow block elements that did not overlap with their parent rects,
for example.

This approach works much better since it only handles the continuation
case that's relevant (the "middle" anonymous box) and it does so during
hit-testing instead of after, allowing all the other relevant logic to
come into play.
2025-01-26 17:30:00 +01:00
Jelle Raaijmakers
522aa41667 LibWeb: Honor pointer-events for PaintableBox in own stacking context
If a block element with its own stacking context has `pointer-events:
none` set, it should be ignored as far as hit-testing goes.

Fixes #3357.
2025-01-26 17:30:00 +01:00
Jelle Raaijmakers
b7a554d1f2 LibWeb: Reorder paintable hit-testing to account for pointer-events
Instead of ignoring any paintable immediately when they're invisible to
hit-testing, consider every candidate and while the most specific
candidate is invisible to hit-testing, traverse up to its parent
paintable.

This more closely reflects the behavior expected when wrapping block
elements inside inline elements, where although the block element might
have `pointer-events: none`, it still becomes part of the hit-test body
of the inline parent.

This makes the following link work as expected:

  <a href="https://ladybird.org">
    <div style="pointer-events: none">Ladybird</div>
  </a>
2025-01-23 09:33:10 +01:00
Jelle Raaijmakers
e076cb9b0e LibWeb: Simplify hit testing coordinate calculations
There are many simpler APIs that we can use here. No functional changes.
2025-01-23 09:33:10 +01:00
Jelle Raaijmakers
336684bc5c LibWeb: Support inserting non-inline elements into inline elements
Our layout tree requires that all containers either have inline or
non-inline children. In order to support the layout of non-inline
elements inside inline elements, we need to do a bit of tree
restructuring. It effectively simulates temporarily closing all inline
nodes, appending the block element, and resumes appending to the last
open inline node.

The acid1.txt expectation needed to be updated to reflect the fact that
we now hoist its <p> elements out of the inline <form> they were in.
Visually, the before and after situations for acid1.html are identical.
2025-01-23 09:33:10 +01:00
Jelle Raaijmakers
7eb4f3da37 LibGfx: Add Rect::unite()
The existing `::unite_horizontally()` and `::unite_vertically()` tests
did not properly test the edge cases where left/top in the Rect were
updated, so they get re-arranged a bit.
2025-01-23 09:33:10 +01:00
Timothy Flynn
85b424464a AK+Everywhere: Rename verify_cast to as
Follow-up to fc20e61e72.
2025-01-21 11:34:06 -05:00
InvalidUsernameException
f39433d6b0 LibWeb: Calculate image size in CSS pixels
Previously most of the calculations for `object-fit` and
`object-position` were based on device pixels, meaning that images would
render differently based on zoom and DPI settings. Instead those
calculations now use css pixels and only the final draw-call is based
on device-pixels.
2025-01-21 16:05:12 +01:00
Tim Ledbetter
639ed5a052 WebContent+LibWeb: Add an option to disable painting viewport scrollbars 2025-01-15 12:33:53 +00:00
Psychpsyo
8cd2fe3d08 LibWeb: Fix CSS clip-path ignoring scroll position 2025-01-13 20:03:28 -07:00
Psychpsyo
9370990ff2 LibWeb: Implement user-select
This implements all values of user-select.
2025-01-08 14:37:28 +00:00
Gingeh
ce5cd012b9 LibWeb/CSS: Implement the color-scheme CSS property 2025-01-08 11:18:13 +00:00
InvalidUsernameException
c790cf2194 LibWeb: Prevent paths thinner than 1px from disappearing
SVGs are rendered with subpixel precision. As such it can happen that
paths are rendered with less than 1px width or height and that they can
have a bounding box thinner than 1px. Due to an optimization such paths
were ignored when painting because their bounding box was incorrectly
calculated to be empty.

As a result horizontal or vertical lines inside SVGs were missing if:
* The SVG is displayed at viewbox size but the lines are defined with
  less than 1px.
* The SVG contians 1px-thin lines, but is displayed at a size smaller
  than viewbox size.

To prevent this, the bounding box of the path is now enlarged to contain
all pixels that are partially affected.
2025-01-07 09:05:04 +00:00
Psychpsyo
8632ce5cdd LibWeb: Hide audio element when controls is not set
When an audio element has no controls attribute,
it should not render at all and take up no space.
2025-01-04 11:47:09 +00:00
Aliaksandr Kalenik
0b8b690f92 LibWeb+LibWebView: Allow to specify default font size in FontPlugin
Instead of always assuming 12pt size for default font, explicitly pass
it as a parameter.
2025-01-02 10:47:21 +01:00
Andreas Kling
4324439006 LibWeb: Reorder some checks in PaintableWithLines::hit_test for speed
In particular:

- Don't compute DOM node editability if we don't need it. This was 22%
  of CPU time when scrolling on Wikipedia.

- Defer inversion of transformed coordinates until we actually need
  them, after we've performed early returns.
2024-12-30 21:25:20 +01:00
Tim Ledbetter
db24440403 LibWeb: Allow keyboard input to alter email inputs
Previously, the`HTMLInputElement.selectinStart` and
`HTMLInputElement.selectionEnd` IDL setters, and the
`setRangeText()` IDL method were used when updating an input's value
on keyboard input. These methods can't be used for this purpose,
since selection doesn't apply to email type inputs. Therefore, this
change introduces internal-use only methods that don't check whether
selection applies to the given input.
2024-12-30 11:04:16 +01:00
Timothy Flynn
27478ec7d4 Everywhere: Run clang-format
The following command was used to clang-format these files:

    clang-format-19 -i $(find . \
        -not \( -path "./\.*" -prune \) \
        -not \( -path "./Build/*" -prune \) \
        -not \( -path "./Toolchain/*" -prune \) \
        -type f -name "*.cpp" -o -name "*.mm" -o -name "*.h")
2024-12-28 05:39:32 -08:00
Jelle Raaijmakers
4d9f17eddf LibGfx+LibWeb: Draw glyph runs with subpixel accuracy
This improves the quality of our font rendering, especially when
animations are involved. Relevant changes:

  * Skia fonts have their subpixel flag set, which means that individual
    glyphs are rendered at subpixel offsets causing glyph runs as a
    whole to look better.

  * Fragment offsets are no longer rounded to whole device pixels, and
    instead the floating point offset is kept. This allows us to pass
    through the floating point baseline position all the way to the Skia
    calls, which already expected that to be a float position.

The `scrollable-contains-table.html` ref test needed different table
headings since they would slightly inflate the column size in the test
file, but not the reference.
2024-12-21 23:09:52 +01:00
Aliaksandr Kalenik
30d915c361 LibGfx+LibWeb: Specify bottom left origin for WebGL's PaintingSurface
By doing that we eliminate the need for the vertical flip flag.

As a side effect it fixes the bug when doing:
`canvasContext2d.drawImage(canvasWithWebGLContext, 0, 0);`
produced a flipped image because we didn't account for different origin
while serializing PaintingSurface into Gfx::Bitmap.

Visual progress on https://ciechanow.ski/curves-and-surfaces/
2024-12-20 20:47:45 +01:00
Lucien Fiorini
9fd1223992 LibWeb+LibGfx: Refactor CSS filters into LibGfx
CSS filters work similarly to canvas filters, so it makes sense to have
Gfx::Filter that can be used by both libraries in an analogous way
as Gfx::Color.
2024-12-18 18:54:20 +01:00
Johan Dahlin
083f4f3d08 LibWeb: Layout/Shape font-variant-* css properties 2024-12-17 19:07:13 +01:00
InvalidUsernameException
09a55e56ee LibWeb: Add support for object-fit: scale-down 2024-12-16 20:47:32 +01:00
Jelle Raaijmakers
1c55153d43 LibWeb: Refactor "editable" and "editing host" concepts
The DOM spec defines what it means for an element to be an "editing
host", and the Editing spec does the same for the "editable" concept.
Replace our `Node::is_editable()` implementation with these
spec-compliant algorithms.

An editing host is an element that has the properties to make its
contents effectively editable. Editable elements are descendants of an
editing host. Concepts like the inheritable contenteditable attribute
are propagated through the editable algorithm.
2024-12-10 14:54:19 +01:00
Sam Atkins
00302b5b1e LibWeb/Painting: Place text cursor using GlyphRun font
This makes the cursor appear in the correct place when the text makes
use of multiple different fonts.
2024-12-06 02:57:34 +01:00
Sam Atkins
e457252c97 LibWeb/Painting: Use GlyphRun font for measuring selection rectangle
We incorrectly used the first available font to measure this before,
which may or may not be the correct font for this text.
2024-12-06 02:57:34 +01:00
Jonne Ransijn
acaf01bf7b LibWeb: Do not normalize border radii containing their initial values
Most computed border-radii contain their initial values, and since the
normalized initial border radii are always zero, there is no need to do
expensive floating point math to normalize them.
2024-12-04 08:30:22 +00:00
Aliaksandr Kalenik
45e0f50463 LibWeb: Flip vertically PaintingSurface attached to WebGL context
OpenGL's origin is at the bottom-left corner, while Skia's origin is at
the top-left corner. This change adds a transformation to compensate for
this difference when rendering PaintingSurface attached to WebGL
context.
2024-12-03 23:35:45 +01:00
Aliaksandr Kalenik
86f1c03c06 LibWeb: Fix CSS filters painting
restore() corresponding to ApplyFilters should be called after stacking
context content is painted, not before.

Fixes regression introduced in c94b4316e7
2024-12-01 21:27:29 +01:00