From ab5b89eb95964592386f260caa90fbb2e7b83433 Mon Sep 17 00:00:00 2001 From: Aliaksandr Kalenik Date: Sat, 27 May 2023 02:58:19 +0300 Subject: [PATCH] LibWeb: Add basic parsing of grid shorthand CSS property Introduces incomplete parsing of grid shorthand property. Only part of syntax is supported for now but it is enough to significantly improve rendering of websites that use this shorthand to define grid :) --- .../expected/grid/grid-shorthand-property.txt | 5 +++++ .../input/grid/grid-shorthand-property.html | 10 ++++++++++ Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp | 12 ++++++++++++ Userland/Libraries/LibWeb/CSS/Parser/Parser.h | 1 + Userland/Libraries/LibWeb/CSS/Properties.json | 15 +++++++++++++++ Userland/Libraries/LibWeb/CSS/StyleComputer.cpp | 2 +- 6 files changed, 44 insertions(+), 1 deletion(-) create mode 100644 Tests/LibWeb/Layout/expected/grid/grid-shorthand-property.txt create mode 100644 Tests/LibWeb/Layout/input/grid/grid-shorthand-property.html diff --git a/Tests/LibWeb/Layout/expected/grid/grid-shorthand-property.txt b/Tests/LibWeb/Layout/expected/grid/grid-shorthand-property.txt new file mode 100644 index 0000000000..19ec62190a --- /dev/null +++ b/Tests/LibWeb/Layout/expected/grid/grid-shorthand-property.txt @@ -0,0 +1,5 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x600 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x100 children: not-inline + Box at (8,8) content-size 784x100 [GFC] children: not-inline + BlockContainer at (8,8) content-size 200x100 [BFC] children: not-inline diff --git a/Tests/LibWeb/Layout/input/grid/grid-shorthand-property.html b/Tests/LibWeb/Layout/input/grid/grid-shorthand-property.html new file mode 100644 index 0000000000..8b9c7a4475 --- /dev/null +++ b/Tests/LibWeb/Layout/input/grid/grid-shorthand-property.html @@ -0,0 +1,10 @@ +
\ No newline at end of file diff --git a/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp b/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp index c88535c806..d4517c0615 100644 --- a/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp +++ b/Userland/Libraries/LibWeb/CSS/Parser/Parser.cpp @@ -6869,6 +6869,14 @@ ErrorOr> Parser::parse_grid_area_shorthand_value(Vector> Parser::parse_grid_shorthand_value(Vector const& component_value) +{ + // <'grid-template'> | + // FIXME: <'grid-template-rows'> / [ auto-flow && dense? ] <'grid-auto-columns'>? | + // FIXME: [ auto-flow && dense? ] <'grid-auto-rows'>? / <'grid-template-columns'> + return parse_grid_track_size_list_shorthand_value(component_value); +} + ErrorOr> Parser::parse_grid_template_areas_value(Vector const& component_values) { Vector> grid_area_rows; @@ -7076,6 +7084,10 @@ Parser::ParseErrorOr> Parser::parse_css_value(Property if (auto parsed_value = FIXME_TRY(parse_grid_track_placement(component_values))) return parsed_value.release_nonnull(); return ParseError::SyntaxError; + case PropertyID::Grid: + if (auto parsed_value = FIXME_TRY(parse_grid_shorthand_value(component_values))) + return parsed_value.release_nonnull(); + return ParseError::SyntaxError; case PropertyID::GridTemplate: if (auto parsed_value = FIXME_TRY(parse_grid_track_size_list_shorthand_value(component_values))) return parsed_value.release_nonnull(); diff --git a/Userland/Libraries/LibWeb/CSS/Parser/Parser.h b/Userland/Libraries/LibWeb/CSS/Parser/Parser.h index 0d3f744a26..6943ab0e0a 100644 --- a/Userland/Libraries/LibWeb/CSS/Parser/Parser.h +++ b/Userland/Libraries/LibWeb/CSS/Parser/Parser.h @@ -334,6 +334,7 @@ private: ErrorOr> parse_grid_track_placement_shorthand_value(Vector const&); ErrorOr> parse_grid_template_areas_value(Vector const&); ErrorOr> parse_grid_area_shorthand_value(Vector const&); + ErrorOr> parse_grid_shorthand_value(Vector const&); ErrorOr> parse_a_calculation(Vector const&); diff --git a/Userland/Libraries/LibWeb/CSS/Properties.json b/Userland/Libraries/LibWeb/CSS/Properties.json index ea485deaba..d030544efa 100644 --- a/Userland/Libraries/LibWeb/CSS/Properties.json +++ b/Userland/Libraries/LibWeb/CSS/Properties.json @@ -940,6 +940,21 @@ "string" ] }, + "grid": { + "inherited": false, + "initial": "auto", + "valid-identifiers": [ + "auto" + ], + "valid-types": [ + "length", + "percentage", + "string" + ], + "longhands": [ + "grid-template" + ] + }, "grid-template": { "inherited": false, "initial": "auto", diff --git a/Userland/Libraries/LibWeb/CSS/StyleComputer.cpp b/Userland/Libraries/LibWeb/CSS/StyleComputer.cpp index 8db216d532..f666efcfac 100644 --- a/Userland/Libraries/LibWeb/CSS/StyleComputer.cpp +++ b/Userland/Libraries/LibWeb/CSS/StyleComputer.cpp @@ -639,7 +639,7 @@ static void set_property_expanding_shorthands(StyleProperties& style, CSS::Prope return; } - if (property_id == CSS::PropertyID::GridTemplate) { + if (property_id == CSS::PropertyID::GridTemplate || property_id == CSS::PropertyID::Grid) { if (value.is_grid_track_size_list_shorthand()) { auto const& shorthand = value.as_grid_track_size_list_shorthand(); style.set_property(CSS::PropertyID::GridTemplateAreas, shorthand.areas());