Commit graph

98 commits

Author SHA1 Message Date
Oriol Brufau
37e1c3385e
Treat align-self: normal as stretch on flex items (#33314)
According to https://drafts.csswg.org/css-align/#align-flex
It was being treated as `auto` instead.

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
2024-09-05 11:15:41 +00:00
Oriol Brufau
27d87f104e
Fix intrinsic sizing of column flex containers (#33299)
From https://drafts.csswg.org/css-flexbox-1/#intrinsic-cross-sizes,
> The min-content/max-content cross size of a single-line flex container
> is the largest min-content contribution/max-content contribution
> (respectively) of its flex items.

We were using the min/max-content size instead of the min/max-content
contribution.

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
2024-09-04 06:44:31 +00:00
Oriol Brufau
3acc9edd82
Fix various issues with replaced elements in flex layout (#33263)
In particular, this takes into account that flex items may be stretched,
and if they have an aspect ratio, we ma6y need to convert the stretched
size through the ratio.

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
Co-authored-by: Martin Robinson <mrobinson@igalia.com>
2024-08-30 23:39:18 +00:00
Oriol Brufau
cd8b803368
Use the proper aspect ratio in flexbox (#33256)
When computing the automatic minimum size, flex layout was using the
natural aspect ratio, ignoring the `aspect-ratio` property.

`ReplacedContent::inline_size_over_block_size_intrinsic_ratio()` is now
made private to avoid more accidental uses.

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
Co-authored-by: Martin Robinson <mrobinson@igalia.com>
2024-08-30 06:28:14 +00:00
Oriol Brufau
4bf941bc8a
Fix automatic minimum size for column flexbox (#33248)
`main_content_size_info()` was always assigning the main-axis automatic
minimum size into the inline axis. But in a column flexbox, the main
axis corresponds to the block axis.

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
2024-08-29 16:55:44 +00:00
Oriol Brufau
0643aa4708
Handle aspect ratios in ReplacedContent::inline_content_sizes (#33240)
We were only handling the aspect ratio of a replaced element when
computing its min/max-content contribution, but not when computing
the min/max-content size. Now both cases will take it into account.

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
2024-08-29 15:38:59 +00:00
Oriol Brufau
93abdf7cb5
layout: Add an indefinite containing block for intrinsic sizing (#33204)
When computing the min-content or max-content size of an element we
need to ignore `inline-size`, `min-inline-size` and `max-inline-size`.

However, we should take the block-axis sizing properties into account.
That's because the contents could have percentages depending on them,
which can then affect their inline size via an aspect ratio.

Therefore, this patch adds `IndefiniteContainingBlock`, which is similar
to `ContainingBlock`, but it allows an indefinite inline-size. This
struct is then passed arround during intrinsic sizing.

More refinement will be needed in follow-up patches in order to fully
address the problem.

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
Co-authored-by: Martin Robinson <mrobinson@igalia.com>
2024-08-29 14:10:46 +00:00
Oriol Brufau
46dbe4ce32
Obey min and max cross sizes of flex items (#33242)
When laying out the contents of a flex item, we used to resolve their
cross-axis percentages against the preferred cross size of the item.
Now we will take the min and max cross sizes into account.

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
Co-authored-by: Martin Robinson <mrobinson@igalia.com>
2024-08-29 11:24:23 +00:00
atbrakhi
2037884469
Fix clippy wanings in layout (#33215)
Signed-off-by: atbrakhi <atbrakhi@igalia.com>
2024-08-27 20:53:43 +00:00
Oriol Brufau
50eb69a7e0
Allow creating a ContentSizes from Au (#33208)
No change in behavior, it just simplies some code a little bit.

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
2024-08-27 15:22:47 +00:00
Martin Robinson
2db9032e72
layout: Add support for flex items with position: relative (#33151)
Signed-off-by: Martin Robinson <mrobinson@igalia.com>
2024-08-23 18:11:22 +00:00
Martin Robinson
56280c6242
layout: Add initial support for bidirectional text (BiDi) (#33148)
This adds supports for right-to-left text assigning bidi levels to all
line items when necessary. This includes support for the `dir` attribute
as well as corresponding CSS properties like `unicode-bidi`. It only
implements right-to-left rendering for inline layout at the moment and
doesn't include support for `dir=auto`. Because of missing features,
this causes quite a few tests to start failing, as references become
incorrect due to right-to-left rendering being active in some cases,
but not others (before it didn't exist at all).

Analysis of most of the new failures:

```
- /css/css-flexbox/gap-001-rtl.html
  /css/css-flexbox/gap-004-rtl.html
 - Require implementing BiDi in Flexbox, because the start and
   end inline margins are opposite the order of items.

- /css/CSS2/bidi-text/direction-applies-to-*.xht
  /css/CSS2/bidi-text/direction-applies-to-002.xht
  /css/CSS2/bidi-text/direction-applies-to-003.xht
  /css/CSS2/bidi-text/direction-applies-to-004.xht
  - Broken due to a bug in tables, not allocating the
    right amount of width for a column.

- /css/css-lists/inline-list.html
  - This fails because we wrongly insert a soft wrap opportunity between the
    start of an inline box and its first content.

- /css/css-text/bidi/bidi-lines-001.html
  /css/css-text/bidi/bidi-lines-002.html
  /css/CSS2/text/bidi-flag-emoji.html
  - We do not fully support unicode-bidi: plaintext

- /css/css-text/text-align/text-align-end-010.html
  /css/css-text/text-align/text-align-justify-006.html
  /css/css-text/text-align/text-align-start-010.html
  /html/dom/elements/global-attributes/*
  - We do not support dir=auto yet.

- /css/css-text/white-space/tab-bidi-001.html
  - Servo doesn't support tab stops

- /css/CSS2/positioning/abspos-block-level-001.html
  /css/css-text/word-break/word-break-normal-ar-000.html
  - Do not yet support RTL layout in block

- /css/css-text/white-space/pre-wrap-018.html
  - Even in RTL contexts, spaces at the end of the line must hang and
    not be reordered

- /css/css-text/white-space/trailing-space-and-text-alignment-rtl-002.html
  - We are letting spaces hang with white-space: pre, but they shouldn't
    hang.
```

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Rakhi Sharma <atbrakhi@igalia.com>
2024-08-21 14:28:54 +00:00
Oriol Brufau
c00cd1326a
Take into account the intrinsic block size when computing the main size of a column flex container (#33135)
In particular, `main_content_sizes()` now works with columns.

`layout_for_block_content_size()` is now used for both intrinsic sizes
and intrinsic contributions, a IntrinsicSizingMode parameter is added
to choose the behavior.

Also, we consider the main size of a flex item as indefinite if its flex
basis is indefinite and the flex container has an indefinite main size.

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
Co-authored-by: Martin Robinson <mrobinson@igalia.com>
2024-08-20 11:30:27 +00:00
Martin Robinson
2f6745c0c6
layout: Layout for column flex-basis and minimum automatic size determination (#33068)
This change adds an expensive layout for the determination of minimum
automatic size and flex basis in process of flexbox layout. Currently,
the layout is not cached, so may be performed up to 2 more times than
necessary.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Oriol Brufau <obrufau@igalia.com>
2024-08-19 10:54:10 +00:00
Martin Robinson
0d94a8acd2
layout: Prepare for bidi by guarding all access to writing-mode (#33082)
We want to selectively enable right-to-left writing modes per layout
context. This change makes that possible by allowing access to
`writing-mode` though an interface that always returns the default
horizontal top-to-bottom (implicitly left-to-right) writing mode.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Rakhi Sharma <atbrakhi@igalia.com>
2024-08-16 11:38:04 +00:00
Martin Robinson
8159f03288
layout: Support start and end values for flexbox align-self (#33032)
These are similar to `flex-start` and `flex-end`, but in `wrap-reverse`
situations, they are the opposite.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Oriol Brufau <obrufau@igalia.com>
2024-08-15 08:20:41 +00:00
Martin Robinson
7633bdccd2
layout: Initial implementation of flex-direction: column and column-reverse (#33031)
This change removes restrictions on using the column layout mode of
flexbox and adds an initial implementation of sizing for that flex
direction. There's a lot of missing pieces still, but in some cases this
does render column flexbox.

In particular, there are now two code paths for preferred widths
(intrinsic size) calcuation: one in the main axis (row) and one in
the cross axis (column) corresponding to the flex direciton with
horizontal writing modes.

In addition, `FlexItemBox::inline_content_sizes` is removed in favor of
making `sizing::outer_inline` /
`IndependentFormattingContext::outer_inline_content_sizes` generic
enough to handle using a different value for auto minimum sizes, which
flexbox needs.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Oriol Brufau <obrufau@igalia.com>
2024-08-14 14:25:09 +00:00
Martin Robinson
d941d2fd67
layout: Convert the FragmentTree to physical geometry (#33030)
This converts all geometry in the FragmentTree into physical geometry,
doing conversions ahead of time instead of when traversing the fragment
tree. This is necessary to properly implement BiDi in Servo as we need
to know what side borders are on in mixed RTL and LTR contexts.

In addition, fragments are laid out in a particular context and only
that context knows its writing mode. There were issues where were using
one writing mode to lay out and another to convert to phyisical
coordinates. This isn't an issue now since we only use the default
writing mode, but starts to be an issue with BiDi text.

Closes #25564.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
2024-08-14 12:22:06 +00:00
Martin Robinson
8582678e4b
Properly handle subpixel units when dividing space between flex lines (#32913)
Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Oriol Brufau <obrufau@igalia.com>
2024-08-13 15:11:01 +00:00
Ashwin Naren
ea5cf75169
clippy: Fix various clippy warnings throughout the code (#33003)
* replace u64::max_value() with u64::MAX

Signed-off-by: Ashwin Naren <arihant2math@gmail.com>

* removed redundant import

Signed-off-by: Ashwin Naren <arihant2math@gmail.com>

* Fixed dereference

Signed-off-by: Ashwin Naren <arihant2math@gmail.com>

* Fixed a probable bug

Signed-off-by: Ashwin Naren <arihant2math@gmail.com>

* fixed imports

Signed-off-by: Ashwin Naren <arihant2math@gmail.com>

* fixed dereference

Signed-off-by: Ashwin Naren <arihant2math@gmail.com>

* dereference formatting

Signed-off-by: Ashwin Naren <arihant2math@gmail.com>

* removed unnessicary number imports

Signed-off-by: Ashwin Naren <arihant2math@gmail.com>

* removed unnessicary number imports

Signed-off-by: Ashwin Naren <arihant2math@gmail.com>

* removed excess borrow

Signed-off-by: Ashwin Naren <arihant2math@gmail.com>

* ran mach fmt

Signed-off-by: Ashwin Naren <arihant2math@gmail.com>

* fixed doc comment

Signed-off-by: Ashwin Naren <arihant2math@gmail.com>

* removed deref on an immutable reference

Signed-off-by: Ashwin Naren <arihant2math@gmail.com>

* fixed minor syntax error

Signed-off-by: Ashwin Naren <arihant2math@gmail.com>

* reverted clamping

Signed-off-by: Ashwin Naren <arihant2math@gmail.com>

* formatting

Signed-off-by: Ashwin Naren <arihant2math@gmail.com>

* reverted final clamp

Signed-off-by: Ashwin Naren <arihant2math@gmail.com>

---------

Signed-off-by: Ashwin Naren <arihant2math@gmail.com>
Co-authored-by: Ashwin Naren <ashwin@pixelators.org>
2024-08-13 05:16:47 +00:00
Martin Robinson
564ba5969f
layout: Non-auto z-index should always make stacking contexts for flex items (#32961)
Fixes #32756.
Signed-off-by: Martin Robinson <mrobinson@igalia.com>
2024-08-12 12:15:20 +00:00
Martin Robinson
1d464a576a
layout: Add support for align-content: stretch (#32906)
This adds support for `align-content: stretch` by splitting flex line
layout into two phases. The first phase takes place before determing how
much extra space to allocate for stretching items. Then line layout
finishes, which might cause two layouts for items with `align-self:
stretch`.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Oriol Brufau <obrufau@igalia.com>
2024-08-06 10:33:37 +00:00
Martin Robinson
10b06f0129
layout: Improve documentation and code structure in FlexItemBox::automatic_min_size (#32911)
This change add specification text to comments and restructres the code
a bit to better match the specification. In addition, a the
`establishes_scroll_container()` helper is used instead of looking at
overflow directly. It should not change behavior at all.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
2024-08-05 09:24:31 +00:00
Delan Azabani
974c9dc89a
layout: Compute intrinsic sizes for flex items and flex containers (#32854)
Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Mukilan Thiyagarajan <mukilan@igalia.com>
Co-authored-by: Martin Robinson <mrobinson@igalia.com>
2024-08-02 06:45:11 +00:00
Oriol Brufau
ca6169990e
Implement gaps in flexbox layout (#32891)
As per https://drafts.csswg.org/css-align/#gaps

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
Co-authored-by: Martin Robinson <mrobinson@igalia.com>
2024-07-31 07:25:54 +00:00
Martin Robinson
1906741704
layout: Add support for propagating baselines from flexbox (#32841)
Some tests are still broken due to missing preferred widths calculation
for flexbox and also for missing column layout.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Mukilan Thiyagarajan <mukilan@igalia.com>
Co-authored-by: Delan Azabani <dazabani@igalia.com>
2024-07-24 14:38:03 +00:00
Martin Robinson
5eb77592ea
layout: Reduce the complexity of FlexLine::layout (#32810)
Instead of a complex combination of iterators, use a flatter iteration
design when laying out a flex line.

Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Mukilan Thiyagarajan <mukilan@igalia.com>
Co-authored-by: Delan Azabani <dazabani@igalia.com>
2024-07-19 10:37:29 +00:00
rachaelspooky
8b3c9b744a
Fix 5 clippy warnings (#32808)
Signed-off-by: Rachael Gentry <rachael.l.gentry@gmail.com>
2024-07-19 04:04:42 +00:00
Delan Azabani
1b1f79305e
flex: handle ‘align-self: [ first | last ]? && baseline’ (#32787)
* flex: handle ‘align-self: baseline’

Signed-off-by: Mukilan Thiyagarajan <mukilan@igalia.com>

* FIXME: css/css-flexbox/align-items-baseline-overflow-non-visible.html

Signed-off-by: Mukilan Thiyagarajan <mukilan@igalia.com>

* Fix baseline selection

Signed-off-by: Mukilan Thiyagarajan <mukilan@igalia.com>

* Fix baseline calculation with padding/border/margin

Signed-off-by: Mukilan Thiyagarajan <mukilan@igalia.com>

* Fix compile errors and warnings

Signed-off-by: Mukilan Thiyagarajan <mukilan@igalia.com>

* Implement ‘align-self: last baseline’

Signed-off-by: Mukilan Thiyagarajan <mukilan@igalia.com>

* Fix bug where non-baseline-aligned items affected max baseline

Signed-off-by: Mukilan Thiyagarajan <mukilan@igalia.com>

* Update expectations

Signed-off-by: Mukilan Thiyagarajan <mukilan@igalia.com>

* Rename method

Signed-off-by: Mukilan Thiyagarajan <mukilan@igalia.com>

---------

Signed-off-by: Mukilan Thiyagarajan <mukilan@igalia.com>
2024-07-18 07:03:29 +00:00
Martin Robinson
882a855b8c
Convert layout to use Gecko's alignment style representation (#32790)
Signed-off-by: Nico Burns <nico@nicoburns.com>
Co-authored-by: Nico Burns <nico@nicoburns.com>
2024-07-17 14:18:55 +00:00
Delan Azabani
039631cfa5
layout: Properly handle min/max cross container size (#32785)
Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Mukilan Thiyagarajan <mukilan@igalia.com>
2024-07-16 12:14:02 +00:00
Martin Robinson
4b63043c6a
clippy: Fix warnings in shared and config, fonts, layout, and layout_2020 components (#32674) 2024-07-04 14:18:58 +00:00
Martin Robinson
adc0fc984d
layout: Make geom.rs logical geoemetry types more ergonomic (#32633)
Make using the logical geometry types more ergonomic by having them all
implement `Copy` (at most 4 64-bit numbers), similar to what `euclid`
does. In addition add an implementation of `Neg` for `LogicalVec` and
`LogicalSides` as it will be used in upcoming table implementation code.
2024-06-28 08:20:50 +00:00
Oriol Brufau
f055964792
Switch replaced layout to app units (#32625) 2024-06-26 16:19:24 +00:00
Oriol Brufau
a972e5c200
Switch flex layout to app units (#32599) 2024-06-25 07:05:16 +00:00
atbrakhi
26c585a0c5
use app unit in box_fragement (#32349) 2024-06-21 14:54:21 +00:00
Martin Robinson
44064b1439
layout: Add very basic support for showing text in input boxes (#32365)
This only paints text in input fields. Selection and cursor are still
not painted.

In addition to adding this feature, the change also updates the
user-agent.css with the latest from the HTML specification. Extra
padding and extraneous settings (such as a bogus line-height and
min-height) are also removed from servo.css. This leads to some new
passes.

There are some new passes, this introduces failures as inserting text
reveals issues that were hidden before. Notably:

- failures in `/html/editing/editing-0/spelling-and-grammar-checking/`:
  We do not support spell-checking.
- Most of the rest of the new failures are missing features of input
  boxes that are also missing in legacy layout.
2024-06-20 10:13:50 +00:00
Martin Robinson
48ab8d8847
layout: Add a InlineFormattingContextBuilder (#32415)
The main change here is that collapsed and `text-transform`'d text is
computed as it's processed by DOM traversal. This single transformed
text is stored in the root of the `InlineFormattingContext`.

This will eventually allow performing linebreaking and shaping of the
entire inline formatting context at once. Allowing for intelligent
processing of linebreaking and also shaping across elements. This
matches more closely what LayoutNG does.

This shouldn't have any (or negligable) behavioral changes, but will
allow us to prevent linebreaking inside of clusters in a followup
change.

Co-authored-by: Rakhi Sharma <atbrakhi@igalia.com>
2024-06-03 14:46:53 +00:00
Nico Burns
1d6be62454
layout2020 (flexbox): Implement start, end, and space-evenly content alignment (#31724)
* Upgrade to stylo 6faedad

* Implement start, end, space-evenly content alignment + fix others

Update test expectations for content alignment fixes

Revert test expectations that are still generating the old results in CI

Update layout2013 test expectation for content alignment

Update content alignment fallback to use safe alignment

Implement fallback alignment

Update content alignment with recent spec changes
2024-04-28 23:17:11 +00:00
Ekta Siwach
5d518ca8dc
layout: Use Au in ResolvedMargins and CollapsedMargin (#31848)
* change ResolvedMargins to use Au instead of length

* made suggested changes

removed whitespace changes

made suggested changes

* Update components/layout_2020/flexbox/layout.rs

Co-authored-by: Oriol Brufau <obrufau@igalia.com>

* Update components/layout_2020/flow/mod.rs

Co-authored-by: Oriol Brufau <obrufau@igalia.com>

* fixed errors

fixed errors

fixed formatting

fixed errors

* modified changes

made suggested changes

* Update components/layout_2020/fragment_tree/fragment.rs

Co-authored-by: Oriol Brufau <obrufau@igalia.com>

updated components/layout_2020/fragment_tree/fragment.rs

* Update components/layout_2020/flow/mod.rs

Co-authored-by: Oriol Brufau <obrufau@igalia.com>

* Update components/layout_2020/flow/mod.rs

Co-authored-by: Oriol Brufau <obrufau@igalia.com>

* updated changes

updated changes

* unified all the suggested changes here

* fixed formatting

* reverted unnecessary changes

* fixed unnecessary warnings

---------

Co-authored-by: Oriol Brufau <obrufau@igalia.com>
2024-03-28 14:20:14 +00:00
atbrakhi
95e69fe4ff
layout: use Au in BoxFragment (#31794)
* use au in BoxFragement

* review fix
2024-03-22 04:30:39 +00:00
RustAndMetal
f6a975fc58
clippy: Fix several warnings (#31710)
Signed-off-by: RustAndMetal <111676747+RustAndMetal@users.noreply.github.com>
2024-03-18 08:33:43 +00:00
atbrakhi
0fda14263a
layout: make margin in pbm use app unit (#31621)
* make margin in pbm use app unit

* Simplification

* Consistently resolve inline margins as Au, like block margins

---------

Co-authored-by: Oriol Brufau <obrufau@igalia.com>
2024-03-13 03:15:20 +00:00
eri
b03411f567
clippy: Fix warnings in components/layout_2020 (#31611)
* clippy: fix warnings in components/layout_2020

* fix: review comments
2024-03-11 14:24:33 +00:00
Martin Robinson
1f23ec2b27
layout: Do not inherit node and fragment flags in anonymous boxes (#31586)
This doesn't really have observable behavior right now, as much as I
tried to trigger some kind of bug. On the other hand, it's just wrong
and is very obvious when you dump the Fragment tree. If you create a
`display: table-cell` that is a child of the `<body>` all parts of the
anonymous table are flagged as if they are the `<body>` element.
2024-03-09 09:13:19 +00:00
Oriol Brufau
50fdb82246
Fix size of tables in flow layout (#31455)
* Fix size of tables in flow layout

The contents of a table can make it bigger than what we would expect
from its 'width', 'min-width', 'height' and ' min-height' properties.
Also, 'width: auto' doesn't stretch it to fill the containing block.

We had to refactor the resolution of margins to happen after layout,
otherwise 'auto' margins wouldn't align correctly.

Co-authored-by: Martin Robinson <mrobinson@igalia.com>

* Feedback

* Consistently use `containing_block_for_table` in table layout

* Update test result

---------

Co-authored-by: Martin Robinson <mrobinson@igalia.com>
2024-03-02 01:39:41 +00:00
atbrakhi
74c07db56c
make ContainingBlock use Au for inline_size and block_size (#31370) 2024-02-20 09:14:44 +00:00
Martin Robinson
6d73832009
layout: Do whitespace collapse during breaking and shaping (#31322)
This moves white space collapse to right before breaking and shaping
happens, which is more similar to what happens in legacy layout. This is
the first step toward making this procedure more efficient (avoiding
string copies) and also implementing support for `text-transform`.

Co-authored-by: Rakhi Sharma <atbrakhi@igalia.com>
2024-02-13 23:08:00 +00:00
atbrakhi
8ba251c95f
layout: make padding and border use Au in pbm (#31289)
* use au for padding and border in pbm

* review fix
2024-02-12 22:49:50 +00:00
Martin Robinson
cdc3c369f0
layout: Implement support for font fallback (#31254)
This adds an initial implementation of font fallback, on part with the
one used in legacy layout. There are still issues. For instance, font
matching is done per unicode character rather than based on graphemes or
the shape first approach of Chrome. The idea is that these changes can
be made later.
2024-02-11 10:08:49 +00:00