1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-08 17:37:35 +00:00
Commit graph

19 commits

Author SHA1 Message Date
Aliaksandr Kalenik
de32b77ceb LibWeb: Use separate structure to represent fragments in paintable tree
This is a part of refactoring towards making the paintable tree
independent of the layout tree. Now, instead of transferring text
fragments from the layout tree to the paintable tree during the layout
commit phase, we allocate separate PaintableFragments that contain only
the information necessary for painting. Doing this also allows us to
get rid LineBoxes, as they are used only during layout.
2024-01-13 10:53:38 +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
Aliaksandr Kalenik
e7eaf3b566 LibWeb: Remove rounding division for CSSPixels
Reverts 98926b487c
that regressed: block-and-inline/small-percentage-margin.html
(thrashing layout while window resizing)

Fixes https://github.com/SerenityOS/serenity/issues/22610
2024-01-06 21:40:27 +01:00
MacDue
4c5d48f861 LibWeb: Support transforms, stroking, gradients, etc for SVG <text>
This makes use of the new Gfx::Path::text() to handle SVG text elements,
with this text is just a regular path, and can be manipulated like any
other graphics element.

This removes the SVGTextPaintable and makes both <text> and geometry
elements use a new (shared) SVGPathPaintable. This is identical to the
old SVGGeometryPaintable. This simplifies painting as once something is
resolved to a Gfx::Path, the painting logic is the same.
2023-11-05 02:46:46 +01:00
Zaggy1024
98926b487c LibWeb: Perform rounding when dividing CSSPixels
This should allow us to produce results that more closely match old
layouts when divisions were done in floating-point.
2023-09-05 14:50:45 +02:00
Andreas Kling
c01c4b41e2 LibWeb: Add ViewportPaintable to represent viewports in the paint tree
This patch just adds the new root paintable and updates the tests
expectations. The next patch will move painting logic from the layout
viewport to the paint viewport.
2023-08-20 05:02:59 +02:00
martinfalisse
f2047a5c32 LibWeb: Size SVG G container according to children
The SVG G container should have the same size as its children. This
fixes a bug when there was an opacity value on the G element, as in
StackingContext it would try and get a bitmap of the element which would
be empty due to it having no size.
2023-08-17 17:48:34 +02:00
Hendiadyoin1
6c341ca985 LibWeb: Implement rounding for PixelUnits 2023-08-05 20:03:09 +02:00
Hendiadyoin1
af161a8b83 AK+LibWeb: Round to int in clamp_to_int instead of truncating
This caused inaccuracies in float->CssPixel conversions
2023-08-05 20:03:09 +02:00
Andreas Kling
09eed8eea2 LibWeb+headless-browser: Include paint tree in layout test output
This will give us a more comprehensive look at what actually gets
rendered in the end, and also allows us to catch more behavior changes.
2023-08-03 13:21:26 +02:00
Aliaksandr Kalenik
bec07d4af7 LibWeb: Use fixed-point saturated arithmetics for CSSPixels
Using fixed-point saturated arithmetics for CSSPixels allows to avoid
accumulating floating-point errors.

This implementation is not complete yet: currently saturated
arithmetics implemented only for addition. But it is enough to not
regress any of layout tests we have :)

See https://github.com/SerenityOS/serenity/issues/18566
2023-07-25 11:52:02 +02:00
MacDue
1bc7b0320e LibGfx: Approximate elliptical arcs with cubic beziers
Unlike all other primitives elliptical arcs are non-trivial to
manipulate, it's tricky to correctly apply a Gfx::AffineTransform to
them. Prior to this change, Path::copy_transformed() was still
incorrectly applying transforms such as flips and skews to arcs.

This patch very closely approximates arcs with cubic beziers (I can not
visually spot any differences), which can then be easily and correctly
transformed in all cases.

Most of the maths here was taken from:
https://mortoray.com/rendering-an-svg-elliptical-arc-as-bezier-curves/
(which came from https://www.joecridge.me/content/pdf/bezier-arcs.pdf,
now a dead link).
2023-07-16 06:22:55 +02:00
MacDue
40fa07a6e1 LibWeb: Force paintable to exist for SVG <g> elements
This (along with the previous commit) fixes the missing tears on the
sad Duolingo owl.
2023-07-02 01:31:18 +02:00
Andreas Kling
caa491b72a LibWeb: Measure the overflow for all scroll containers
Instead of just measuring the layout viewport, we now measure overflow
in every box that is a scroll container.

This has the side effect of no longer creating paintables for layout
boxes that didn't participate in layout. (For example, empty/anonymous
boxes that were ignored by flex itemization.)

Such boxes are now marked as "(not painted)" in the layout tree dumps,
as they have no paintable to dump geometry from.
2023-06-01 13:33:35 +02:00
Andreas Kling
655d9d1462 LibWeb: Make CSSPixels and Length use 64-bit (double) floating point
This fixes a plethora of rounding problems on many websites.
In the future, we may want to replace this with fixed-point arithmetic
(bug #18566) for performance (and consistency with other engines),
but in the meantime this makes the web look a bit better. :^)

There's a lot more things that could be converted to doubles, which
would reduce the amount of casting necessary in this patch.
We can do that incrementally, however.
2023-05-24 14:40:35 +02:00
Andreas Kling
968db96101 LibWeb: Show formatting context roots in layout tree dumps
This patch does three things:

- Factors out the code that determines whether a box will create a new
  formatting context for its children (and which type of context)

- Uses that code to mark all formatting context roots in layout tree
  dumps. This makes it much easier to follow along with layout since
  you can now see exactly where control is transferred to a new
  formatting context.

- Rebaselines all existing layout tests, since the output format has
  changed slightly.
2023-05-03 13:14:36 +02:00
MacDue
5df4e64eb7 LibWeb: Implement SVG preserveAspectRatio attribute
This attribute is used to define how the viewBox should be scaled.
Previously the behaviour implemented was that of "xMidYMid meet", now
all of them work (expect none :P).

With this the Discord login backend is now correctly scaled/positioned.

This also brings our SVG code a little closer to the spec! With spec
comments and all :^)

(Minor non-visible update to layout tests)
2023-04-17 07:32:31 +02:00
MacDue
f9c61e3ba7 LibWeb: Scale SVG stroke-width based on viewbox
This fixes the clipping of strokes in quite a few cases and now fixes
the Gartic Phone logo :^)

(Layout test updated but no visible changes there)
2023-04-15 19:28:13 +02:00
MacDue
5abffc9c5a Tests: Add layout test for SVG transforms and viewboxes
Now that these are kind of working, lets add a layout test to prevent
future regressions :^)

This test is the same as the previous example (it is copied, though
that seems to have been done for other tests, e.g. Acid 1).
2023-04-12 07:40:22 +02:00