diff --git a/layout/style/test/property_database.js b/layout/style/test/property_database.js index 138dedcbfc00..79d7bcbd211d 100644 --- a/layout/style/test/property_database.js +++ b/layout/style/test/property_database.js @@ -5937,13 +5937,16 @@ var gCSSProperties = { initial_values: [ "auto" ], prerequisites: { "display": "block" }, other_values: [ "15px", "3em", "15%", + // These keywords are treated as initial value. + "max-content", "min-content", "-moz-fit-content", "-moz-available", + "-moz-max-content", "-moz-min-content", "calc(2px)", "calc(50%)", "calc(3*25px)", "calc(25px*3)", "calc(3*25px + 50%)", ], - invalid_values: [ "none", "max-content", "min-content", "-moz-fit-content", "-moz-available" ], + invalid_values: [ "none" ], }, "border-block-end-color": { domProp: "borderBlockEndColor", @@ -6192,13 +6195,16 @@ var gCSSProperties = { prerequisites: { "display": "block" }, initial_values: [ "none" ], other_values: [ "30px", "50%", + // These keywords are treated as initial value. + "max-content", "min-content", "-moz-fit-content", "-moz-available", + "-moz-max-content", "-moz-min-content", "calc(2px)", "calc(50%)", "calc(3*25px)", "calc(25px*3)", "calc(3*25px + 50%)", ], - invalid_values: [ "auto", "5", "max-content", "min-content", "-moz-fit-content", "-moz-available" ] + invalid_values: [ "auto", "5" ] }, "max-inline-size": { domProp: "maxInlineSize", @@ -6232,6 +6238,9 @@ var gCSSProperties = { prerequisites: { "display": "block" }, initial_values: [ "auto", "0", "calc(0em)", "calc(-2px)" ], other_values: [ "30px", "50%", + // These keywords are treated as initial value. + "max-content", "min-content", "-moz-fit-content", "-moz-available", + "-moz-max-content", "-moz-min-content", "calc(-1%)", "calc(2px)", "calc(50%)", @@ -6239,7 +6248,7 @@ var gCSSProperties = { "calc(25px*3)", "calc(3*25px + 50%)", ], - invalid_values: [ "none", "5", "max-content", "min-content", "-moz-fit-content", "-moz-available" ] + invalid_values: [ "none", "5" ] }, "min-inline-size": { domProp: "minInlineSize", diff --git a/layout/style/test/test_box_size_keywords.html b/layout/style/test/test_box_size_keywords.html index 0f817275617b..67da43983e5e 100644 --- a/layout/style/test/test_box_size_keywords.html +++ b/layout/style/test/test_box_size_keywords.html @@ -111,50 +111,50 @@ var gTests = [ { orientation: "vertical", prerequisites: "width: 30px; ", property: "width", specified_value: "min-content", computed_value: "20px", }, { orientation: "vertical", prerequisites: "width: 30px; ", property: "width", specified_value: "max-content", computed_value: "20px", }, { orientation: "vertical", prerequisites: "width: 30px; ", property: "width", specified_value: "-moz-fit-content", computed_value: "20px", }, - { orientation: "vertical", prerequisites: "block-size: 30px; ", property: "block-size", specified_value: "-moz-available", computed_value: "30px", }, - { orientation: "vertical", prerequisites: "block-size: 30px; ", property: "block-size", specified_value: "min-content", computed_value: "30px", }, - { orientation: "vertical", prerequisites: "block-size: 30px; ", property: "block-size", specified_value: "max-content", computed_value: "30px", }, - { orientation: "vertical", prerequisites: "block-size: 30px; ", property: "block-size", specified_value: "-moz-fit-content", computed_value: "30px", }, + { orientation: "vertical", prerequisites: "block-size: 30px; ", property: "block-size", specified_value: "-moz-available", computed_value: "20px", }, + { orientation: "vertical", prerequisites: "block-size: 30px; ", property: "block-size", specified_value: "min-content", computed_value: "20px", }, + { orientation: "vertical", prerequisites: "block-size: 30px; ", property: "block-size", specified_value: "max-content", computed_value: "20px", }, + { orientation: "vertical", prerequisites: "block-size: 30px; ", property: "block-size", specified_value: "-moz-fit-content", computed_value: "20px", }, { orientation: "vertical", prerequisites: "min-width: 30px; ", property: "min-width", specified_value: "-moz-available", computed_value: "-moz-available", }, { orientation: "vertical", prerequisites: "min-width: 30px; ", property: "min-width", specified_value: "min-content", computed_value: "min-content", }, { orientation: "vertical", prerequisites: "min-width: 30px; ", property: "min-width", specified_value: "max-content", computed_value: "max-content", }, { orientation: "vertical", prerequisites: "min-width: 30px; ", property: "min-width", specified_value: "-moz-fit-content", computed_value: "-moz-fit-content", }, - { orientation: "vertical", prerequisites: "min-block-size: 30px; ", property: "min-block-size", specified_value: "-moz-available", computed_value: "30px", }, - { orientation: "vertical", prerequisites: "min-block-size: 30px; ", property: "min-block-size", specified_value: "min-content", computed_value: "30px", }, - { orientation: "vertical", prerequisites: "min-block-size: 30px; ", property: "min-block-size", specified_value: "max-content", computed_value: "30px", }, - { orientation: "vertical", prerequisites: "min-block-size: 30px; ", property: "min-block-size", specified_value: "-moz-fit-content", computed_value: "30px", }, + { orientation: "vertical", prerequisites: "min-block-size: 30px; ", property: "min-block-size", specified_value: "-moz-available", computed_value: "-moz-available", }, + { orientation: "vertical", prerequisites: "min-block-size: 30px; ", property: "min-block-size", specified_value: "min-content", computed_value: "min-content", }, + { orientation: "vertical", prerequisites: "min-block-size: 30px; ", property: "min-block-size", specified_value: "max-content", computed_value: "max-content", }, + { orientation: "vertical", prerequisites: "min-block-size: 30px; ", property: "min-block-size", specified_value: "-moz-fit-content", computed_value: "-moz-fit-content", }, { orientation: "vertical", prerequisites: "max-width: 30px; ", property: "max-width", specified_value: "-moz-available", computed_value: "-moz-available", }, { orientation: "vertical", prerequisites: "max-width: 30px; ", property: "max-width", specified_value: "min-content", computed_value: "min-content", }, { orientation: "vertical", prerequisites: "max-width: 30px; ", property: "max-width", specified_value: "max-content", computed_value: "max-content", }, { orientation: "vertical", prerequisites: "max-width: 30px; ", property: "max-width", specified_value: "-moz-fit-content", computed_value: "-moz-fit-content", }, - { orientation: "vertical", prerequisites: "max-block-size: 30px; ", property: "max-block-size", specified_value: "-moz-available", computed_value: "30px", }, - { orientation: "vertical", prerequisites: "max-block-size: 30px; ", property: "max-block-size", specified_value: "min-content", computed_value: "30px", }, - { orientation: "vertical", prerequisites: "max-block-size: 30px; ", property: "max-block-size", specified_value: "max-content", computed_value: "30px", }, - { orientation: "vertical", prerequisites: "max-block-size: 30px; ", property: "max-block-size", specified_value: "-moz-fit-content", computed_value: "30px", }, + { orientation: "vertical", prerequisites: "max-block-size: 30px; ", property: "max-block-size", specified_value: "-moz-available", computed_value: "-moz-available", }, + { orientation: "vertical", prerequisites: "max-block-size: 30px; ", property: "max-block-size", specified_value: "min-content", computed_value: "min-content", }, + { orientation: "vertical", prerequisites: "max-block-size: 30px; ", property: "max-block-size", specified_value: "max-content", computed_value: "max-content", }, + { orientation: "vertical", prerequisites: "max-block-size: 30px; ", property: "max-block-size", specified_value: "-moz-fit-content", computed_value: "-moz-fit-content", }, { orientation: "horizontal", prerequisites: "height: 30px; ", property: "height", specified_value: "-moz-available", computed_value: "20px", }, { orientation: "horizontal", prerequisites: "height: 30px; ", property: "height", specified_value: "min-content", computed_value: "20px", }, { orientation: "horizontal", prerequisites: "height: 30px; ", property: "height", specified_value: "max-content", computed_value: "20px", }, { orientation: "horizontal", prerequisites: "height: 30px; ", property: "height", specified_value: "-moz-fit-content", computed_value: "20px", }, - { orientation: "horizontal", prerequisites: "block-size: 30px; ", property: "block-size", specified_value: "-moz-available", computed_value: "30px", }, - { orientation: "horizontal", prerequisites: "block-size: 30px; ", property: "block-size", specified_value: "min-content", computed_value: "30px", }, - { orientation: "horizontal", prerequisites: "block-size: 30px; ", property: "block-size", specified_value: "max-content", computed_value: "30px", }, - { orientation: "horizontal", prerequisites: "block-size: 30px; ", property: "block-size", specified_value: "-moz-fit-content", computed_value: "30px", }, + { orientation: "horizontal", prerequisites: "block-size: 30px; ", property: "block-size", specified_value: "-moz-available", computed_value: "20px", }, + { orientation: "horizontal", prerequisites: "block-size: 30px; ", property: "block-size", specified_value: "min-content", computed_value: "20px", }, + { orientation: "horizontal", prerequisites: "block-size: 30px; ", property: "block-size", specified_value: "max-content", computed_value: "20px", }, + { orientation: "horizontal", prerequisites: "block-size: 30px; ", property: "block-size", specified_value: "-moz-fit-content", computed_value: "20px", }, { orientation: "horizontal", prerequisites: "min-height: 30px; ", property: "min-height", specified_value: "-moz-available", computed_value: "-moz-available", }, { orientation: "horizontal", prerequisites: "min-height: 30px; ", property: "min-height", specified_value: "min-content", computed_value: "min-content", }, { orientation: "horizontal", prerequisites: "min-height: 30px; ", property: "min-height", specified_value: "max-content", computed_value: "max-content", }, { orientation: "horizontal", prerequisites: "min-height: 30px; ", property: "min-height", specified_value: "-moz-fit-content", computed_value: "-moz-fit-content", }, - { orientation: "horizontal", prerequisites: "min-block-size: 30px; ", property: "min-block-size", specified_value: "-moz-available", computed_value: "30px", }, - { orientation: "horizontal", prerequisites: "min-block-size: 30px; ", property: "min-block-size", specified_value: "min-content", computed_value: "30px", }, - { orientation: "horizontal", prerequisites: "min-block-size: 30px; ", property: "min-block-size", specified_value: "max-content", computed_value: "30px", }, - { orientation: "horizontal", prerequisites: "min-block-size: 30px; ", property: "min-block-size", specified_value: "-moz-fit-content", computed_value: "30px", }, + { orientation: "horizontal", prerequisites: "min-block-size: 30px; ", property: "min-block-size", specified_value: "-moz-available", computed_value: "-moz-available", }, + { orientation: "horizontal", prerequisites: "min-block-size: 30px; ", property: "min-block-size", specified_value: "min-content", computed_value: "min-content", }, + { orientation: "horizontal", prerequisites: "min-block-size: 30px; ", property: "min-block-size", specified_value: "max-content", computed_value: "max-content", }, + { orientation: "horizontal", prerequisites: "min-block-size: 30px; ", property: "min-block-size", specified_value: "-moz-fit-content", computed_value: "-moz-fit-content", }, { orientation: "horizontal", prerequisites: "max-height: 30px; ", property: "max-height", specified_value: "-moz-available", computed_value: "-moz-available", }, { orientation: "horizontal", prerequisites: "max-height: 30px; ", property: "max-height", specified_value: "min-content", computed_value: "min-content", }, { orientation: "horizontal", prerequisites: "max-height: 30px; ", property: "max-height", specified_value: "max-content", computed_value: "max-content", }, { orientation: "horizontal", prerequisites: "max-height: 30px; ", property: "max-height", specified_value: "-moz-fit-content", computed_value: "-moz-fit-content", }, - { orientation: "horizontal", prerequisites: "max-block-size: 30px; ", property: "max-block-size", specified_value: "-moz-available", computed_value: "30px", }, - { orientation: "horizontal", prerequisites: "max-block-size: 30px; ", property: "max-block-size", specified_value: "min-content", computed_value: "30px", }, - { orientation: "horizontal", prerequisites: "max-block-size: 30px; ", property: "max-block-size", specified_value: "max-content", computed_value: "30px", }, - { orientation: "horizontal", prerequisites: "max-block-size: 30px; ", property: "max-block-size", specified_value: "-moz-fit-content", computed_value: "30px", }, + { orientation: "horizontal", prerequisites: "max-block-size: 30px; ", property: "max-block-size", specified_value: "-moz-available", computed_value: "-moz-available", }, + { orientation: "horizontal", prerequisites: "max-block-size: 30px; ", property: "max-block-size", specified_value: "min-content", computed_value: "min-content", }, + { orientation: "horizontal", prerequisites: "max-block-size: 30px; ", property: "max-block-size", specified_value: "max-content", computed_value: "max-content", }, + { orientation: "horizontal", prerequisites: "max-block-size: 30px; ", property: "max-block-size", specified_value: "-moz-fit-content", computed_value: "-moz-fit-content", }, ]; gTests.forEach(function(t) { diff --git a/layout/style/test/test_value_computation.html b/layout/style/test/test_value_computation.html index 9faaa3030241..7d55927776ea 100644 --- a/layout/style/test/test_value_computation.html +++ b/layout/style/test/test_value_computation.html @@ -96,6 +96,8 @@ var gSwapInitialWhenHaveFrame = { // value, i.e. `auto`, given the prerequisites of only 'display: block'. "height": [ "-moz-max-content", "-moz-min-content", "-moz-fit-content", "-moz-available", "max-content", "min-content" ], + "block-size": [ "-moz-max-content", "-moz-min-content", "-moz-fit-content", + "-moz-available", "max-content", "min-content" ], }; function swap_when_frame(property, value) { diff --git a/servo/components/style/properties/longhands/position.mako.rs b/servo/components/style/properties/longhands/position.mako.rs index c5e507da10e6..53a3acf81ec1 100644 --- a/servo/components/style/properties/longhands/position.mako.rs +++ b/servo/components/style/properties/longhands/position.mako.rs @@ -244,21 +244,12 @@ ${helpers.predefined_type( if logical: spec = "https://drafts.csswg.org/css-logical-props/#propdef-%s" %> - // NOTE: Block-size doesn't support -moz-*-content keywords, since they make - // no sense on the block axis, but it simplifies things the have that it has - // the same type as the other properties, since otherwise we'd need to - // handle logical props where the types are different, which looks like a - // pain. % if product == "gecko": - <% - parse_function = "parse" if size != "block-size" else "parse_disallow_keyword" - %> // width, height, block-size, inline-size ${helpers.predefined_type( size, "MozLength", "computed::MozLength::auto()", - parse_function, logical=logical, logical_group="size", allow_quirks=not logical, @@ -272,7 +263,6 @@ ${helpers.predefined_type( "min-%s" % size, "MozLength", "computed::MozLength::auto()", - parse_function, logical=logical, logical_group="min-size", allow_quirks=not logical, @@ -284,7 +274,6 @@ ${helpers.predefined_type( "max-%s" % size, "MaxLength", "computed::MaxLength::none()", - parse_function, logical=logical, logical_group="max-size", allow_quirks=not logical, diff --git a/servo/components/style/values/specified/length.rs b/servo/components/style/values/specified/length.rs index d3cabd46f0df..c447a1cfa3e5 100644 --- a/servo/components/style/values/specified/length.rs +++ b/servo/components/style/values/specified/length.rs @@ -1264,17 +1264,6 @@ impl Parse for MozLength { } impl MozLength { - /// Parses, without quirks, and disallowing ExtremumLength values. - /// - /// Used for logical props in the block direction. - pub fn parse_disallow_keyword<'i, 't>( - context: &ParserContext, - input: &mut Parser<'i, 't>, - ) -> Result> { - let length = LengthOrPercentageOrAuto::parse_non_negative(context, input)?; - Ok(GenericMozLength::LengthOrPercentageOrAuto(length)) - } - /// Parses, with quirks. pub fn parse_quirky<'i, 't>( context: &ParserContext, @@ -1316,17 +1305,6 @@ impl Parse for MaxLength { } impl MaxLength { - /// Parses, without quirks, and disallowing ExtremumLength values. - /// - /// Used for logical props in the block direction. - pub fn parse_disallow_keyword<'i, 't>( - context: &ParserContext, - input: &mut Parser<'i, 't>, - ) -> Result> { - let length = LengthOrPercentageOrNone::parse_non_negative(context, input)?; - Ok(GenericMaxLength::LengthOrPercentageOrNone(length)) - } - /// Parses, with quirks. pub fn parse_quirky<'i, 't>( context: &ParserContext, diff --git a/testing/web-platform/tests/css/css-logical/parsing/block-size-invalid.html b/testing/web-platform/tests/css/css-logical/parsing/block-size-invalid.html new file mode 100644 index 000000000000..37d88907735f --- /dev/null +++ b/testing/web-platform/tests/css/css-logical/parsing/block-size-invalid.html @@ -0,0 +1,29 @@ + + + + +CSS Logical Properties and Values: parsing block-size with invalid values + + + + + + + + + + diff --git a/testing/web-platform/tests/css/css-logical/parsing/block-size-valid.html b/testing/web-platform/tests/css/css-logical/parsing/block-size-valid.html new file mode 100644 index 000000000000..47170e48f15f --- /dev/null +++ b/testing/web-platform/tests/css/css-logical/parsing/block-size-valid.html @@ -0,0 +1,28 @@ + + + + +CSS Logical Properties and Values: parsing block-size with valid values + + + + + + + + + + diff --git a/testing/web-platform/tests/css/css-logical/parsing/inline-size-invalid.html b/testing/web-platform/tests/css/css-logical/parsing/inline-size-invalid.html new file mode 100644 index 000000000000..d3d5d3f84d9d --- /dev/null +++ b/testing/web-platform/tests/css/css-logical/parsing/inline-size-invalid.html @@ -0,0 +1,29 @@ + + + + +CSS Logical Properties and Values: parsing inline-size with invalid values + + + + + + + + + + diff --git a/testing/web-platform/tests/css/css-logical/parsing/inline-size-valid.html b/testing/web-platform/tests/css/css-logical/parsing/inline-size-valid.html new file mode 100644 index 000000000000..e785b468cdde --- /dev/null +++ b/testing/web-platform/tests/css/css-logical/parsing/inline-size-valid.html @@ -0,0 +1,28 @@ + + + + +CSS Logical Properties and Values: parsing inline-size with valid values + + + + + + + + + + diff --git a/testing/web-platform/tests/css/css-logical/parsing/max-block-size-invalid.html b/testing/web-platform/tests/css/css-logical/parsing/max-block-size-invalid.html new file mode 100644 index 000000000000..adcf6e497eac --- /dev/null +++ b/testing/web-platform/tests/css/css-logical/parsing/max-block-size-invalid.html @@ -0,0 +1,29 @@ + + + + +CSS Logical Properties and Values: parsing max-block-size with invalid values + + + + + + + + + + diff --git a/testing/web-platform/tests/css/css-logical/parsing/max-block-size-valid.html b/testing/web-platform/tests/css/css-logical/parsing/max-block-size-valid.html new file mode 100644 index 000000000000..75b5c6f54973 --- /dev/null +++ b/testing/web-platform/tests/css/css-logical/parsing/max-block-size-valid.html @@ -0,0 +1,28 @@ + + + + +CSS Logical Properties and Values: parsing max-block-size with valid values + + + + + + + + + + diff --git a/testing/web-platform/tests/css/css-logical/parsing/max-inline-size-invalid.html b/testing/web-platform/tests/css/css-logical/parsing/max-inline-size-invalid.html new file mode 100644 index 000000000000..fa695551b244 --- /dev/null +++ b/testing/web-platform/tests/css/css-logical/parsing/max-inline-size-invalid.html @@ -0,0 +1,29 @@ + + + + +CSS Logical Properties and Values: parsing max-inline-size with invalid values + + + + + + + + + + diff --git a/testing/web-platform/tests/css/css-logical/parsing/max-inline-size-valid.html b/testing/web-platform/tests/css/css-logical/parsing/max-inline-size-valid.html new file mode 100644 index 000000000000..19d582962dc0 --- /dev/null +++ b/testing/web-platform/tests/css/css-logical/parsing/max-inline-size-valid.html @@ -0,0 +1,28 @@ + + + + +CSS Logical Properties and Values: parsing max-inline-size with valid values + + + + + + + + + + diff --git a/testing/web-platform/tests/css/css-logical/parsing/min-block-size-invalid.html b/testing/web-platform/tests/css/css-logical/parsing/min-block-size-invalid.html new file mode 100644 index 000000000000..325dc2e0aeac --- /dev/null +++ b/testing/web-platform/tests/css/css-logical/parsing/min-block-size-invalid.html @@ -0,0 +1,29 @@ + + + + +CSS Logical Properties and Values: parsing min-block-size with invalid values + + + + + + + + + + diff --git a/testing/web-platform/tests/css/css-logical/parsing/min-block-size-valid.html b/testing/web-platform/tests/css/css-logical/parsing/min-block-size-valid.html new file mode 100644 index 000000000000..5a5d4a43852d --- /dev/null +++ b/testing/web-platform/tests/css/css-logical/parsing/min-block-size-valid.html @@ -0,0 +1,28 @@ + + + + +CSS Logical Properties and Values: parsing min-block-size with valid values + + + + + + + + + + diff --git a/testing/web-platform/tests/css/css-logical/parsing/min-inline-size-invalid.html b/testing/web-platform/tests/css/css-logical/parsing/min-inline-size-invalid.html new file mode 100644 index 000000000000..eb2cc8bb1067 --- /dev/null +++ b/testing/web-platform/tests/css/css-logical/parsing/min-inline-size-invalid.html @@ -0,0 +1,29 @@ + + + + +CSS Logical Properties and Values: parsing min-inline-size with invalid values + + + + + + + + + + diff --git a/testing/web-platform/tests/css/css-logical/parsing/min-inline-size-valid.html b/testing/web-platform/tests/css/css-logical/parsing/min-inline-size-valid.html new file mode 100644 index 000000000000..fa4ba0d1bb26 --- /dev/null +++ b/testing/web-platform/tests/css/css-logical/parsing/min-inline-size-valid.html @@ -0,0 +1,28 @@ + + + + +CSS Logical Properties and Values: parsing min-inline-size with valid values + + + + + + + + + +