mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-07-28 19:59:17 +00:00
LibWeb: Collapse auto-fit tracks in middle of tracks definition [GFC]
Some checks are pending
CI / macOS, arm64, Sanitizer_CI, Clang (push) Waiting to run
CI / Linux, x86_64, Fuzzers_CI, Clang (push) Waiting to run
CI / Linux, x86_64, Sanitizer_CI, GNU (push) Waiting to run
CI / Linux, x86_64, Sanitizer_CI, Clang (push) Waiting to run
Package the js repl as a binary artifact / macOS, arm64 (push) Waiting to run
Package the js repl as a binary artifact / Linux, x86_64 (push) Waiting to run
Run test262 and test-wasm / run_and_update_results (push) Waiting to run
Lint Code / lint (push) Waiting to run
Label PRs with merge conflicts / auto-labeler (push) Waiting to run
Push notes / build (push) Waiting to run
Some checks are pending
CI / macOS, arm64, Sanitizer_CI, Clang (push) Waiting to run
CI / Linux, x86_64, Fuzzers_CI, Clang (push) Waiting to run
CI / Linux, x86_64, Sanitizer_CI, GNU (push) Waiting to run
CI / Linux, x86_64, Sanitizer_CI, Clang (push) Waiting to run
Package the js repl as a binary artifact / macOS, arm64 (push) Waiting to run
Package the js repl as a binary artifact / Linux, x86_64 (push) Waiting to run
Run test262 and test-wasm / run_and_update_results (push) Waiting to run
Lint Code / lint (push) Waiting to run
Label PRs with merge conflicts / auto-labeler (push) Waiting to run
Push notes / build (push) Waiting to run
`collapse_auto_fit_tracks_if_needed()` had a check that does collapsing only if auto-fit is used like `grid-template-columns: repeat(auto-fit, 1px);`, and it didn't work for valid cases when `repeat(auto-fit)` is placed in the middle of definition like `grid-template-columns: 1px repeat(auto-fit, 1px) 1px;`.
This commit is contained in:
Aliaksandr Kalenik
Alexander Kalenik
parent
c333d0876c
commit
4ed9f6fcc0
Notes:
github-actions[bot]
2025-06-23 00:31:20 +00:00
Author: https://github.com/kalenikaliaksandr
Commit: 4ed9f6fcc0
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/5171
4 changed files with 34 additions and 31 deletions
|
|
@ -148,7 +148,7 @@ static Alignment to_alignment(CSS::AlignItems value)
|
|||
}
|
||||
}
|
||||
|
||||
GridFormattingContext::GridTrack GridFormattingContext::GridTrack::create_from_definition(CSS::ExplicitGridTrack const& definition)
|
||||
GridFormattingContext::GridTrack GridFormattingContext::GridTrack::create_from_definition(CSS::ExplicitGridTrack const& definition, bool is_auto_fit = false)
|
||||
{
|
||||
// NOTE: repeat() is expected to be expanded beforehand.
|
||||
VERIFY(!definition.is_repeat());
|
||||
|
|
@ -157,6 +157,7 @@ GridFormattingContext::GridTrack GridFormattingContext::GridTrack::create_from_d
|
|||
return GridTrack {
|
||||
.min_track_sizing_function = definition.minmax().min_grid_size(),
|
||||
.max_track_sizing_function = definition.minmax().max_grid_size(),
|
||||
.is_auto_fit = is_auto_fit,
|
||||
};
|
||||
}
|
||||
|
||||
|
|
@ -173,6 +174,7 @@ GridFormattingContext::GridTrack GridFormattingContext::GridTrack::create_from_d
|
|||
return GridTrack {
|
||||
.min_track_sizing_function = min_track_sizing_function,
|
||||
.max_track_sizing_function = max_track_sizing_function,
|
||||
.is_auto_fit = is_auto_fit,
|
||||
};
|
||||
}
|
||||
|
||||
|
|
@ -552,18 +554,20 @@ void GridFormattingContext::initialize_grid_tracks_from_definition(GridDimension
|
|||
auto& tracks = dimension == GridDimension::Column ? m_grid_columns : m_grid_rows;
|
||||
for (auto const& track_definition : tracks_definition) {
|
||||
int repeat_count = 1;
|
||||
bool is_auto_fit = false;
|
||||
if (track_definition.is_repeat()) {
|
||||
if (track_definition.repeat().is_auto_fill() || track_definition.repeat().is_auto_fit())
|
||||
is_auto_fit = track_definition.repeat().is_auto_fit();
|
||||
if (track_definition.repeat().is_auto_fill() || is_auto_fit)
|
||||
repeat_count = count_of_repeated_auto_fill_or_fit_tracks(dimension, track_definition);
|
||||
else
|
||||
repeat_count = track_definition.repeat().repeat_count();
|
||||
}
|
||||
for (auto _ = 0; _ < repeat_count; _++) {
|
||||
if (track_definition.is_default() || track_definition.is_minmax()) {
|
||||
tracks.append(GridTrack::create_from_definition(track_definition));
|
||||
tracks.append(GridTrack::create_from_definition(track_definition, is_auto_fit));
|
||||
} else if (track_definition.is_repeat()) {
|
||||
for (auto& explicit_grid_track : track_definition.repeat().grid_track_size_list().track_list()) {
|
||||
tracks.append(GridTrack::create_from_definition(explicit_grid_track));
|
||||
tracks.append(GridTrack::create_from_definition(explicit_grid_track, is_auto_fit));
|
||||
}
|
||||
} else {
|
||||
VERIFY_NOT_REACHED();
|
||||
|
|
@ -1811,18 +1815,16 @@ void GridFormattingContext::collapse_auto_fit_tracks_if_needed(GridDimension dim
|
|||
// The auto-fit keyword behaves the same as auto-fill, except that after grid item placement any
|
||||
// empty repeated tracks are collapsed. An empty track is one with no in-flow grid items placed into
|
||||
// or spanning across it. (This can result in all tracks being collapsed, if they’re all empty.)
|
||||
auto const& grid_computed_values = grid_container().computed_values();
|
||||
auto const& tracks_definition = dimension == GridDimension::Column ? grid_computed_values.grid_template_columns().track_list() : grid_computed_values.grid_template_rows().track_list();
|
||||
auto& tracks = dimension == GridDimension::Column ? m_grid_columns : m_grid_rows;
|
||||
if (tracks_definition.size() == 1 && tracks_definition.first().is_repeat() && tracks_definition.first().repeat().is_auto_fit()) {
|
||||
for (size_t track_index = 0; track_index < tracks.size(); track_index++) {
|
||||
if (m_occupation_grid.is_occupied(dimension == GridDimension::Column ? track_index : 0, dimension == GridDimension::Row ? track_index : 0))
|
||||
continue;
|
||||
for (size_t track_index = 0; track_index < tracks.size(); track_index++) {
|
||||
if (!tracks[track_index].is_auto_fit)
|
||||
continue;
|
||||
if (m_occupation_grid.is_occupied(dimension == GridDimension::Column ? track_index : 0, dimension == GridDimension::Row ? track_index : 0))
|
||||
continue;
|
||||
|
||||
// NOTE: A collapsed track is treated as having a fixed track sizing function of 0px
|
||||
tracks[track_index].min_track_sizing_function = CSS::GridSize(CSS::Length::make_px(0));
|
||||
tracks[track_index].max_track_sizing_function = CSS::GridSize(CSS::Length::make_px(0));
|
||||
}
|
||||
// NOTE: A collapsed track is treated as having a fixed track sizing function of 0px
|
||||
tracks[track_index].min_track_sizing_function = CSS::GridSize(CSS::Length::make_px(0));
|
||||
tracks[track_index].max_track_sizing_function = CSS::GridSize(CSS::Length::make_px(0));
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -217,8 +217,9 @@ private:
|
|||
CSSPixels item_incurred_increase { 0 };
|
||||
|
||||
bool is_gap { false };
|
||||
bool is_auto_fit { false };
|
||||
|
||||
static GridTrack create_from_definition(CSS::ExplicitGridTrack const& definition);
|
||||
static GridTrack create_from_definition(CSS::ExplicitGridTrack const& definition, bool is_auto_fit);
|
||||
static GridTrack create_auto();
|
||||
static GridTrack create_gap(CSSPixels size);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -2,8 +2,8 @@ Harness status: OK
|
|||
|
||||
Found 25 tests
|
||||
|
||||
17 Pass
|
||||
8 Fail
|
||||
23 Pass
|
||||
2 Fail
|
||||
Fail Property grid-template-columns value 'none'
|
||||
Pass Property grid-template-columns value '1px'
|
||||
Pass Property grid-template-columns value '1px [a]'
|
||||
|
|
@ -12,20 +12,20 @@ Pass Property grid-template-columns value '[a] 1px'
|
|||
Pass Property grid-template-columns value '[a] 1px [b]'
|
||||
Pass Property grid-template-columns value '1px repeat(1, 2px) 3px'
|
||||
Pass Property grid-template-columns value '1px repeat(auto-fill, 2px) 3px'
|
||||
Fail Property grid-template-columns value '1px repeat(auto-fit, 2px) 3px'
|
||||
Pass Property grid-template-columns value '1px repeat(auto-fit, 2px) 3px'
|
||||
Pass Property grid-template-columns value '1px [a] repeat(1, 2px 3px) [b] 4px'
|
||||
Pass Property grid-template-columns value '1px [a] repeat(auto-fill, 2px 3px) [b] 4px'
|
||||
Fail Property grid-template-columns value '1px [a] repeat(auto-fit, 2px 3px) [b] 4px'
|
||||
Pass Property grid-template-columns value '1px [a] repeat(auto-fit, 2px 3px) [b] 4px'
|
||||
Pass Property grid-template-columns value '1px [a] repeat(1, [b] 2px [c]) [d] 3px'
|
||||
Pass Property grid-template-columns value '1px [a] repeat(auto-fill, [b] 2px [c]) [d] 3px'
|
||||
Fail Property grid-template-columns value '1px [a] repeat(auto-fit, [b] 2px [c]) [d] 3px'
|
||||
Pass Property grid-template-columns value '1px [a] repeat(auto-fit, [b] 2px [c]) [d] 3px'
|
||||
Pass Property grid-template-columns value '[a] 1px repeat(1, 2px [b] 3px) 4px [d]'
|
||||
Pass Property grid-template-columns value '[a] 1px repeat(auto-fill, 2px [b] 3px) 4px [d]'
|
||||
Fail Property grid-template-columns value '[a] 1px repeat(auto-fit, 2px [b] 3px) 4px [d]'
|
||||
Pass Property grid-template-columns value '[a] 1px repeat(auto-fit, 2px [b] 3px) 4px [d]'
|
||||
Pass Property grid-template-columns value '100% [a] repeat(1, [b] 200% [c]) [d] 300%'
|
||||
Pass Property grid-template-columns value '100% [a] repeat(auto-fill, [b] 200% [c]) [d] 300%'
|
||||
Fail Property grid-template-columns value '100% [a] repeat(auto-fit, [b] 200% [c]) [d] 300%'
|
||||
Pass Property grid-template-columns value '100% [a] repeat(auto-fit, [b] 200% [c]) [d] 300%'
|
||||
Pass Property grid-template-columns value '[a] 1em repeat(1, 2em [b] 3em) 4em [d]'
|
||||
Pass Property grid-template-columns value '[a] 1em repeat(auto-fill, 2em [b] 3em) 4em [d]'
|
||||
Fail Property grid-template-columns value '[a] 1em repeat(auto-fit, 2em [b] 3em) 4em [d]'
|
||||
Pass Property grid-template-columns value '[a] 1em repeat(auto-fit, 2em [b] 3em) 4em [d]'
|
||||
Fail Property grid-template-columns value 'repeat(calc(1 + 3 * sign(100em - 1px)), 150px)'
|
||||
|
|
@ -2,8 +2,8 @@ Harness status: OK
|
|||
|
||||
Found 24 tests
|
||||
|
||||
17 Pass
|
||||
7 Fail
|
||||
23 Pass
|
||||
1 Fail
|
||||
Fail Property grid-template-rows value 'none'
|
||||
Pass Property grid-template-rows value '1px'
|
||||
Pass Property grid-template-rows value '1px [a]'
|
||||
|
|
@ -12,19 +12,19 @@ Pass Property grid-template-rows value '[a] 1px'
|
|||
Pass Property grid-template-rows value '[a] 1px [b]'
|
||||
Pass Property grid-template-rows value '1px repeat(1, 2px) 3px'
|
||||
Pass Property grid-template-rows value '1px repeat(auto-fill, 2px) 3px'
|
||||
Fail Property grid-template-rows value '1px repeat(auto-fit, 2px) 3px'
|
||||
Pass Property grid-template-rows value '1px repeat(auto-fit, 2px) 3px'
|
||||
Pass Property grid-template-rows value '1px [a] repeat(1, 2px 3px) [b] 4px'
|
||||
Pass Property grid-template-rows value '1px [a] repeat(auto-fill, 2px 3px) [b] 4px'
|
||||
Fail Property grid-template-rows value '1px [a] repeat(auto-fit, 2px 3px) [b] 4px'
|
||||
Pass Property grid-template-rows value '1px [a] repeat(auto-fit, 2px 3px) [b] 4px'
|
||||
Pass Property grid-template-rows value '1px [a] repeat(1, [b] 2px [c]) [d] 3px'
|
||||
Pass Property grid-template-rows value '1px [a] repeat(auto-fill, [b] 2px [c]) [d] 3px'
|
||||
Fail Property grid-template-rows value '1px [a] repeat(auto-fit, [b] 2px [c]) [d] 3px'
|
||||
Pass Property grid-template-rows value '1px [a] repeat(auto-fit, [b] 2px [c]) [d] 3px'
|
||||
Pass Property grid-template-rows value '[a] 1px repeat(1, 2px [b] 3px) 4px [d]'
|
||||
Pass Property grid-template-rows value '[a] 1px repeat(auto-fill, 2px [b] 3px) 4px [d]'
|
||||
Fail Property grid-template-rows value '[a] 1px repeat(auto-fit, 2px [b] 3px) 4px [d]'
|
||||
Pass Property grid-template-rows value '[a] 1px repeat(auto-fit, 2px [b] 3px) 4px [d]'
|
||||
Pass Property grid-template-rows value '100% [a] repeat(1, [b] 200% [c]) [d] 300%'
|
||||
Pass Property grid-template-rows value '100% [a] repeat(auto-fill, [b] 200% [c]) [d] 300%'
|
||||
Fail Property grid-template-rows value '100% [a] repeat(auto-fit, [b] 200% [c]) [d] 300%'
|
||||
Pass Property grid-template-rows value '100% [a] repeat(auto-fit, [b] 200% [c]) [d] 300%'
|
||||
Pass Property grid-template-rows value '[a] 1em repeat(1, 2em [b] 3em) 4em [d]'
|
||||
Pass Property grid-template-rows value '[a] 1em repeat(auto-fill, 2em [b] 3em) 4em [d]'
|
||||
Fail Property grid-template-rows value '[a] 1em repeat(auto-fit, 2em [b] 3em) 4em [d]'
|
||||
Pass Property grid-template-rows value '[a] 1em repeat(auto-fit, 2em [b] 3em) 4em [d]'
|
||||
Loading…
Add table
Add a link
Reference in a new issue