LibWeb: Use none as initial value for grid-template-column/rows

This fixes the issue that currently we use "auto" as initial value for
grid-template-column and grid-template-rows although spec says it
should be "none". This makes a lot of difference for these properties
because currently we represent "auto" as a list with one auto-sized
track which means initial value for grid-template-column defines one
"explicit" track while it should define none of them.

This change makes grid-auto-columns/rows be applied to the correct
tracks when initial values is used for grid-template-column/rows.
This commit is contained in:
Aliaksandr Kalenik 2023-06-07 13:04:06 +03:00 committed by Andreas Kling
parent 675cf43937
commit 3b3ade0b8d
Notes: sideshowbarker 2024-07-18 03:20:18 +09:00
9 changed files with 73 additions and 6 deletions

View file

@ -0,0 +1,36 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline
BlockContainer <body> at (8,8) content-size 784x200 children: not-inline
Box <div.grid-container> at (8,8) content-size 784x200 [GFC] children: not-inline
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (8,8) content-size 392x100 [BFC] children: inline
line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [8,8 6.34375x17.46875]
"1"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (400,8) content-size 392x100 [BFC] children: inline
line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [400,8 8.8125x17.46875]
"2"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (8,108) content-size 392x100 [BFC] children: inline
line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [8,108 9.09375x17.46875]
"3"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (400,108) content-size 392x100 [BFC] children: inline
line 0 width: 7.75, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 1, rect: [400,108 7.75x17.46875]
"4"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <(anonymous)> at (8,208) content-size 784x0 children: inline
TextNode <#text>

View file

@ -0,0 +1,18 @@
<style>
.grid-container {
display: grid;
grid-template-columns: auto auto;
grid-auto-rows: 100px;
background-color: lightsalmon;
}
.grid-item {
background-color: lightblue;
}
</style>
<div class="grid-container">
<div class="grid-item">1</div>
<div class="grid-item">2</div>
<div class="grid-item">3</div>
<div class="grid-item">4</div>
</div>

View file

@ -77,8 +77,8 @@ public:
static CSS::Size height() { return CSS::Size::make_auto(); }
static CSS::Size min_height() { return CSS::Size::make_auto(); }
static CSS::Size max_height() { return CSS::Size::make_none(); }
static CSS::GridTrackSizeList grid_template_columns() { return CSS::GridTrackSizeList::make_auto(); }
static CSS::GridTrackSizeList grid_template_rows() { return CSS::GridTrackSizeList::make_auto(); }
static CSS::GridTrackSizeList grid_template_columns() { return CSS::GridTrackSizeList::make_none(); }
static CSS::GridTrackSizeList grid_template_rows() { return CSS::GridTrackSizeList::make_none(); }
static CSS::GridTrackPlacement grid_column_end() { return CSS::GridTrackPlacement::make_auto(); }
static CSS::GridTrackPlacement grid_column_start() { return CSS::GridTrackPlacement::make_auto(); }
static CSS::GridTrackPlacement grid_row_end() { return CSS::GridTrackPlacement::make_auto(); }

View file

@ -197,7 +197,7 @@ GridTrackSizeList::GridTrackSizeList()
{
}
GridTrackSizeList GridTrackSizeList::make_auto()
GridTrackSizeList GridTrackSizeList::make_none()
{
return GridTrackSizeList();
}

View file

@ -91,7 +91,7 @@ public:
GridTrackSizeList(Vector<CSS::ExplicitGridTrack> track_list, Vector<Vector<String>> line_names);
GridTrackSizeList();
static GridTrackSizeList make_auto();
static GridTrackSizeList make_none();
Vector<CSS::ExplicitGridTrack> track_list() const { return m_track_list; }
Vector<Vector<String>> line_names() const { return m_line_names; }

View file

@ -6856,6 +6856,13 @@ Optional<CSS::ExplicitGridTrack> Parser::parse_track_sizing_function(ComponentVa
ErrorOr<RefPtr<StyleValue>> Parser::parse_grid_track_size_list(Vector<ComponentValue> const& component_values, bool allow_separate_line_name_blocks)
{
if (component_values.size() == 1 && component_values.first().is(Token::Type::Ident)) {
auto ident = TRY(parse_identifier_value(component_values.first()));
if (ident && ident->to_identifier() == ValueID::None) {
return GridTrackSizeListStyleValue::make_none();
}
}
Vector<CSS::ExplicitGridTrack> track_list;
Vector<Vector<String>> line_names_list;
auto last_object_was_line_names = false;

View file

@ -1099,7 +1099,7 @@
},
"grid-template-columns": {
"inherited": false,
"initial": "auto",
"initial": "none",
"max-values": 4,
"valid-identifiers": [
"auto"
@ -1112,7 +1112,7 @@
},
"grid-template-rows": {
"inherited": false,
"initial": "auto",
"initial": "none",
"max-values": 4,
"valid-identifiers": [
"auto"

View file

@ -26,4 +26,9 @@ ErrorOr<ValueComparingNonnullRefPtr<GridTrackSizeListStyleValue>> GridTrackSizeL
return adopt_nonnull_ref_or_enomem(new (nothrow) GridTrackSizeListStyleValue(CSS::GridTrackSizeList()));
}
ErrorOr<ValueComparingNonnullRefPtr<GridTrackSizeListStyleValue>> GridTrackSizeListStyleValue::make_none()
{
return adopt_nonnull_ref_or_enomem(new (nothrow) GridTrackSizeListStyleValue(CSS::GridTrackSizeList()));
}
}

View file

@ -20,6 +20,7 @@ public:
virtual ~GridTrackSizeListStyleValue() override = default;
static ErrorOr<ValueComparingNonnullRefPtr<GridTrackSizeListStyleValue>> make_auto();
static ErrorOr<ValueComparingNonnullRefPtr<GridTrackSizeListStyleValue>> make_none();
CSS::GridTrackSizeList grid_track_size_list() const { return m_grid_track_size_list; }