mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-04-22 04:25:13 +00:00
LibWeb/CSS: Sort a calculation's children during serialization
This gets us 38 more passes in our in-tree tests, plus however many more in the rest of WPT. :^)
This commit is contained in:
Sam Atkins
Andreas Kling
parent
a63879330f
commit
5cfb8163c6
Notes:
github-actions[bot]
2025-02-27 20:43:39 +00:00
Author: https://github.com/AtkinsSJ Commit: https://github.com/LadybirdBrowser/ladybird/commit/5cfb8163c61 Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/3719
11 changed files with 139 additions and 74 deletions
|
|
@ -8,6 +8,7 @@
|
|||
*/
|
||||
|
||||
#include "CalculatedStyleValue.h"
|
||||
#include <AK/QuickSort.h>
|
||||
#include <AK/TypeCasts.h>
|
||||
#include <LibWeb/CSS/Percentage.h>
|
||||
#include <LibWeb/CSS/PropertyID.h>
|
||||
|
|
@ -239,6 +240,76 @@ static String serialize_a_math_function(CalculationNode const& fn, CalculationCo
|
|||
return builder.to_string_without_validation();
|
||||
}
|
||||
|
||||
// https://drafts.csswg.org/css-values-4/#sort-a-calculations-children
|
||||
static Vector<NonnullRefPtr<CalculationNode>> sort_a_calculations_children(Vector<NonnullRefPtr<CalculationNode>> nodes)
|
||||
{
|
||||
// 1. Let ret be an empty list.
|
||||
Vector<NonnullRefPtr<CalculationNode>> ret;
|
||||
|
||||
// 2. If nodes contains a number, remove it from nodes and append it to ret.
|
||||
auto index_of_number = nodes.find_first_index_if([](NonnullRefPtr<CalculationNode> const& node) {
|
||||
if (node->type() != CalculationNode::Type::Numeric)
|
||||
return false;
|
||||
return static_cast<NumericCalculationNode const&>(*node).value().has<Number>();
|
||||
});
|
||||
if (index_of_number.has_value()) {
|
||||
ret.append(nodes.take(*index_of_number));
|
||||
}
|
||||
|
||||
// 3. If nodes contains a percentage, remove it from nodes and append it to ret.
|
||||
auto index_of_percentage = nodes.find_first_index_if([](NonnullRefPtr<CalculationNode> const& node) {
|
||||
if (node->type() != CalculationNode::Type::Numeric)
|
||||
return false;
|
||||
return static_cast<NumericCalculationNode const&>(*node).value().has<Percentage>();
|
||||
});
|
||||
if (index_of_percentage.has_value()) {
|
||||
ret.append(nodes.take(*index_of_percentage));
|
||||
}
|
||||
|
||||
// 4. If nodes contains any dimensions, remove them from nodes, sort them by their units, ordered ASCII
|
||||
// case-insensitively, and append them to ret.
|
||||
Vector<NonnullRefPtr<CalculationNode>> dimensions;
|
||||
dimensions.ensure_capacity(nodes.size());
|
||||
|
||||
auto next_dimension_index = [&nodes]() {
|
||||
return nodes.find_first_index_if([](NonnullRefPtr<CalculationNode> const& node) {
|
||||
if (node->type() != CalculationNode::Type::Numeric)
|
||||
return false;
|
||||
return static_cast<NumericCalculationNode const&>(*node).value().visit(
|
||||
[](Number const&) { return false; },
|
||||
[](Percentage const&) { return false; },
|
||||
[](auto const&) { return true; });
|
||||
});
|
||||
};
|
||||
|
||||
for (auto index_of_dimension = next_dimension_index(); index_of_dimension.has_value(); index_of_dimension = next_dimension_index()) {
|
||||
dimensions.append(nodes.take(*index_of_dimension));
|
||||
}
|
||||
|
||||
quick_sort(dimensions, [](NonnullRefPtr<CalculationNode> const& a, NonnullRefPtr<CalculationNode> const& b) {
|
||||
auto get_unit = [](NonnullRefPtr<CalculationNode> const& node) -> StringView {
|
||||
auto const& numeric_node = static_cast<NumericCalculationNode const&>(*node);
|
||||
return numeric_node.value().visit(
|
||||
[](Number const&) -> StringView { VERIFY_NOT_REACHED(); },
|
||||
[](Percentage const&) -> StringView { VERIFY_NOT_REACHED(); },
|
||||
[](auto const& dimension) -> StringView { return dimension.unit_name(); });
|
||||
};
|
||||
|
||||
auto a_unit = get_unit(a);
|
||||
auto b_unit = get_unit(b);
|
||||
// NOTE: Our unit name strings are always lowercase, so we don't have to do anything special for a case-insensitive match.
|
||||
return a_unit < b_unit;
|
||||
});
|
||||
ret.extend(dimensions);
|
||||
|
||||
// 5. If nodes still contains any items, append them to ret in the same order.
|
||||
if (!nodes.is_empty())
|
||||
ret.extend(nodes);
|
||||
|
||||
// 6. Return ret.
|
||||
return ret;
|
||||
}
|
||||
|
||||
// https://drafts.csswg.org/css-values-4/#serialize-a-calculation-tree
|
||||
static String serialize_a_calculation_tree(CalculationNode const& root, CalculationContext const& context, CSSStyleValue::SerializationMode serialization_mode)
|
||||
{
|
||||
|
|
@ -288,8 +359,7 @@ static String serialize_a_calculation_tree(CalculationNode const& root, Calculat
|
|||
StringBuilder builder;
|
||||
builder.append('(');
|
||||
|
||||
// FIXME: Sort root’s children.
|
||||
auto sorted_children = root.children();
|
||||
auto sorted_children = sort_a_calculations_children(root.children());
|
||||
|
||||
// Serialize root’s first child, and append it to s.
|
||||
builder.append(serialize_a_calculation_tree(sorted_children.first(), context, serialization_mode));
|
||||
|
|
@ -330,8 +400,7 @@ static String serialize_a_calculation_tree(CalculationNode const& root, Calculat
|
|||
StringBuilder builder;
|
||||
builder.append('(');
|
||||
|
||||
// FIXME: Sort root’s children.
|
||||
auto sorted_children = root.children();
|
||||
auto sorted_children = sort_a_calculations_children(root.children());
|
||||
|
||||
// Serialize root’s first child, and append it to s.
|
||||
builder.append(serialize_a_calculation_tree(sorted_children.first(), context, serialization_mode));
|
||||
|
|
|
|||
|
|
@ -11,13 +11,13 @@ backdrop-filter: 'grayscale(calc(0.02 * var(--n)))' -> 'grayscale(0.04)'
|
|||
background-position-x: 'calc(2px)' -> '2px'
|
||||
background-position-x: 'calc(2px * var(--n))' -> '4px'
|
||||
background-position-y: 'calc(2%)' -> '2%'
|
||||
background-position-y: 'calc(2% * var(--n))' -> 'calc(2% * 2)'
|
||||
background-position-y: 'calc(2% * var(--n))' -> 'calc(2 * 2%)'
|
||||
background-size: 'calc(2px * var(--n)) calc(2%)' -> '4px 2%'
|
||||
background-size: 'calc(2px * var(--n)) calc(2% * var(--n))' -> '4px calc(2% * 2)'
|
||||
background-size: 'calc(2px * var(--n)) calc(2% * var(--n))' -> '4px calc(2 * 2%)'
|
||||
border-bottom-left-radius: 'calc(2px)' -> '2px'
|
||||
border-bottom-left-radius: 'calc(2px * var(--n))' -> '4px'
|
||||
border-bottom-right-radius: 'calc(2%)' -> '2%'
|
||||
border-bottom-right-radius: 'calc(2% * var(--n))' -> 'calc(2% * 2)'
|
||||
border-bottom-right-radius: 'calc(2% * var(--n))' -> 'calc(2 * 2%)'
|
||||
border-bottom-width: 'calc(2px)' -> '2px'
|
||||
border-bottom-width: 'calc(2px * var(--n))' -> '4px'
|
||||
border-left-width: 'calc(2px)' -> '2px'
|
||||
|
|
@ -29,7 +29,7 @@ border-spacing: 'calc(2px * var(--n))' -> '4px'
|
|||
border-top-left-radius: 'calc(2px)' -> '2px'
|
||||
border-top-left-radius: 'calc(2px * var(--n))' -> '4px'
|
||||
border-top-right-radius: 'calc(2%)' -> '2%'
|
||||
border-top-right-radius: 'calc(2% * var(--n))' -> 'calc(2% * 2)'
|
||||
border-top-right-radius: 'calc(2% * var(--n))' -> 'calc(2 * 2%)'
|
||||
border-top-width: 'calc(2px)' -> '2px'
|
||||
border-top-width: 'calc(2px * var(--n))' -> '4px'
|
||||
bottom: 'calc(2px)' -> '2px'
|
||||
|
|
@ -53,7 +53,7 @@ counter-set: 'foo calc(2 * var(--n))' -> 'foo 4'
|
|||
cx: 'calc(2px)' -> '2px'
|
||||
cx: 'calc(2px * var(--n))' -> '4px'
|
||||
cy: 'calc(2%)' -> '2%'
|
||||
cy: 'calc(2% * var(--n))' -> 'calc(2% * 2)'
|
||||
cy: 'calc(2% * var(--n))' -> 'calc(2 * 2%)'
|
||||
fill-opacity: 'calc(2)' -> '2'
|
||||
fill-opacity: 'calc(2 * var(--n))' -> '4'
|
||||
filter: 'grayscale(calc(2%))' -> 'grayscale(2%)'
|
||||
|
|
@ -105,11 +105,11 @@ math-depth: 'calc(2 * var(--n))' -> '4'
|
|||
max-height: 'calc(2px)' -> '2px'
|
||||
max-height: 'calc(2px * var(--n))' -> '4px'
|
||||
max-width: 'calc(2%)' -> '2%'
|
||||
max-width: 'calc(2% * var(--n))' -> 'calc(2% * 2)'
|
||||
max-width: 'calc(2% * var(--n))' -> 'calc(2 * 2%)'
|
||||
min-height: 'calc(2px)' -> '2px'
|
||||
min-height: 'calc(2px * var(--n))' -> '4px'
|
||||
min-width: 'calc(2%)' -> '2%'
|
||||
min-width: 'calc(2% * var(--n))' -> 'calc(2% * 2)'
|
||||
min-width: 'calc(2% * var(--n))' -> 'calc(2 * 2%)'
|
||||
opacity: 'calc(2)' -> '2'
|
||||
opacity: 'calc(2 * var(--n))' -> '4'
|
||||
order: 'calc(2)' -> '2'
|
||||
|
|
@ -129,13 +129,13 @@ padding-top: 'calc(2% * var(--n))' -> '31.375px'
|
|||
r: 'calc(2px)' -> '2px'
|
||||
r: 'calc(2px * var(--n))' -> '4px'
|
||||
right: 'calc(2%)' -> '2%'
|
||||
right: 'calc(2% * var(--n))' -> 'calc(2% * 2)'
|
||||
right: 'calc(2% * var(--n))' -> 'calc(2 * 2%)'
|
||||
row-gap: 'calc(2%)' -> '2%'
|
||||
row-gap: 'calc(2% * var(--n))' -> 'calc(2% * 2)'
|
||||
row-gap: 'calc(2% * var(--n))' -> 'calc(2 * 2%)'
|
||||
rx: 'calc(2px)' -> '2px'
|
||||
rx: 'calc(2px * var(--n))' -> '4px'
|
||||
ry: 'calc(2%)' -> '2%'
|
||||
ry: 'calc(2% * var(--n))' -> 'calc(2% * 2)'
|
||||
ry: 'calc(2% * var(--n))' -> 'calc(2 * 2%)'
|
||||
stop-opacity: 'calc(2)' -> '2'
|
||||
stop-opacity: 'calc(2 * var(--n))' -> '4'
|
||||
stroke-opacity: 'calc(2%)' -> '2%'
|
||||
|
|
@ -147,11 +147,11 @@ tab-size: 'calc(2px * var(--n))' -> '4px'
|
|||
text-decoration-thickness: 'calc(2px)' -> '2px'
|
||||
text-decoration-thickness: 'calc(2px * var(--n))' -> '4px'
|
||||
text-indent: 'calc(2%)' -> '2%'
|
||||
text-indent: 'calc(2% * var(--n))' -> 'calc(2% * 2)'
|
||||
text-indent: 'calc(2% * var(--n))' -> 'calc(2 * 2%)'
|
||||
top: 'calc(2%)' -> '2%'
|
||||
top: 'calc(2% * var(--n))' -> 'calc(2% * 2)'
|
||||
top: 'calc(2% * var(--n))' -> 'calc(2 * 2%)'
|
||||
transform-origin: 'calc(2px) calc(2%)' -> '2px 2%'
|
||||
transform-origin: 'calc(2px * var(--n)) calc(2% * var(--n))' -> '4px calc(2% * 2)'
|
||||
transform-origin: 'calc(2px * var(--n)) calc(2% * var(--n))' -> '4px calc(2 * 2%)'
|
||||
transition-delay: 'calc(2s)' -> '2s'
|
||||
transition-delay: 'calc(2s * var(--n))' -> '4s'
|
||||
transition-duration: 'calc(2s)' -> '2s'
|
||||
|
|
@ -165,6 +165,6 @@ word-spacing: 'calc(2px * var(--n))' -> '4px'
|
|||
x: 'calc(2px)' -> '2px'
|
||||
x: 'calc(2px * var(--n))' -> '4px'
|
||||
y: 'calc(2%)' -> '2%'
|
||||
y: 'calc(2% * var(--n))' -> 'calc(2% * 2)'
|
||||
y: 'calc(2% * var(--n))' -> 'calc(2 * 2%)'
|
||||
z-index: 'calc(2)' -> '2'
|
||||
z-index: 'calc(2 * var(--n))' -> '4'
|
||||
|
|
|
|||
|
|
@ -2,15 +2,14 @@ Harness status: OK
|
|||
|
||||
Found 18 tests
|
||||
|
||||
17 Pass
|
||||
1 Fail
|
||||
18 Pass
|
||||
Pass Default column-gap is 'normal'
|
||||
Pass column-gap accepts pixels
|
||||
Pass column-gap accepts em
|
||||
Pass column-gap accepts vw
|
||||
Pass column-gap accepts percentage
|
||||
Pass column-gap accepts calc()
|
||||
Fail column-gap accepts calc() mixing fixed and percentage values
|
||||
Pass column-gap accepts calc() mixing fixed and percentage values
|
||||
Pass Initial column-gap is 'normal'
|
||||
Pass Initial column-gap is 'normal' 2
|
||||
Pass Initial inherited column-gap is 'normal'
|
||||
|
|
|
|||
|
|
@ -2,8 +2,8 @@ Harness status: OK
|
|||
|
||||
Found 26 tests
|
||||
|
||||
24 Pass
|
||||
2 Fail
|
||||
25 Pass
|
||||
1 Fail
|
||||
Pass Default gap is 'normal'
|
||||
Pass gap accepts pixels
|
||||
Pass gap accepts pixels 2
|
||||
|
|
@ -15,7 +15,7 @@ Pass gap accepts vw and vh
|
|||
Pass gap accepts percentage
|
||||
Pass gap accepts percentage 2
|
||||
Pass gap accepts calc()
|
||||
Fail gap accepts calc() mixing fixed and percentage values
|
||||
Pass gap accepts calc() mixing fixed and percentage values
|
||||
Pass gap accepts calc() 2
|
||||
Pass Initial gap is 'normal'
|
||||
Pass Initial gap is 'normal' 2
|
||||
|
|
|
|||
|
|
@ -2,15 +2,14 @@ Harness status: OK
|
|||
|
||||
Found 18 tests
|
||||
|
||||
17 Pass
|
||||
1 Fail
|
||||
18 Pass
|
||||
Pass Default grid-column-gap is 'normal'
|
||||
Pass grid-column-gap accepts pixels
|
||||
Pass grid-column-gap accepts em
|
||||
Pass grid-column-gap accepts vw
|
||||
Pass grid-column-gap accepts percentage
|
||||
Pass grid-column-gap accepts calc()
|
||||
Fail grid-column-gap accepts calc() mixing fixed and percentage values
|
||||
Pass grid-column-gap accepts calc() mixing fixed and percentage values
|
||||
Pass Initial grid-column-gap is 'normal'
|
||||
Pass Initial grid-column-gap is 'normal' 2
|
||||
Pass Initial inherited grid-column-gap is 'normal'
|
||||
|
|
|
|||
|
|
@ -2,8 +2,8 @@ Harness status: OK
|
|||
|
||||
Found 26 tests
|
||||
|
||||
24 Pass
|
||||
2 Fail
|
||||
25 Pass
|
||||
1 Fail
|
||||
Pass Default grid-gap is 'normal'
|
||||
Pass grid-gap accepts pixels
|
||||
Pass grid-gap accepts pixels 2
|
||||
|
|
@ -15,7 +15,7 @@ Pass grid-gap accepts vw and vh
|
|||
Pass grid-gap accepts percentage
|
||||
Pass grid-gap accepts percentage 2
|
||||
Pass grid-gap accepts calc()
|
||||
Fail grid-gap accepts calc() mixing fixed and percentage values
|
||||
Pass grid-gap accepts calc() mixing fixed and percentage values
|
||||
Pass grid-gap accepts calc() 2
|
||||
Pass Initial grid-gap is 'normal'
|
||||
Pass Initial grid-gap is 'normal' 2
|
||||
|
|
|
|||
|
|
@ -2,15 +2,14 @@ Harness status: OK
|
|||
|
||||
Found 18 tests
|
||||
|
||||
17 Pass
|
||||
1 Fail
|
||||
18 Pass
|
||||
Pass Default grid-row-gap is 'normal'
|
||||
Pass grid-row-gap accepts pixels
|
||||
Pass grid-row-gap accepts em
|
||||
Pass grid-row-gap accepts vw
|
||||
Pass grid-row-gap accepts percentage
|
||||
Pass grid-row-gap accepts calc()
|
||||
Fail grid-row-gap accepts calc() mixing fixed and percentage values
|
||||
Pass grid-row-gap accepts calc() mixing fixed and percentage values
|
||||
Pass Initial grid-row-gap is 'normal'
|
||||
Pass Initial grid-row-gap is 'normal' 2
|
||||
Pass Initial inherited grid-row-gap is 'normal'
|
||||
|
|
|
|||
|
|
@ -2,15 +2,14 @@ Harness status: OK
|
|||
|
||||
Found 18 tests
|
||||
|
||||
17 Pass
|
||||
1 Fail
|
||||
18 Pass
|
||||
Pass Default row-gap is 'normal'
|
||||
Pass row-gap accepts pixels
|
||||
Pass row-gap accepts em
|
||||
Pass row-gap accepts vw
|
||||
Pass row-gap accepts percentage
|
||||
Pass row-gap accepts calc()
|
||||
Fail row-gap accepts calc() mixing fixed and percentage values
|
||||
Pass row-gap accepts calc() mixing fixed and percentage values
|
||||
Pass Initial row-gap is 'normal'
|
||||
Pass Initial row-gap is 'normal' 2
|
||||
Pass Initial inherited row-gap is 'normal'
|
||||
|
|
|
|||
|
|
@ -2,8 +2,8 @@ Harness status: OK
|
|||
|
||||
Found 306 tests
|
||||
|
||||
261 Pass
|
||||
45 Fail
|
||||
279 Pass
|
||||
27 Fail
|
||||
Pass e.style['color'] = "color(srgb 0% 0% 0%)" should set the property value
|
||||
Pass e.style['color'] = "color(srgb 10% 10% 10%)" should set the property value
|
||||
Pass e.style['color'] = "color(srgb .2 .2 25%)" should set the property value
|
||||
|
|
@ -36,8 +36,8 @@ Pass e.style['color'] = "color(srgb 0 calc(infinity) 0)" should set the property
|
|||
Pass e.style['color'] = "color(srgb 0 calc(-infinity) 0)" should set the property value
|
||||
Pass e.style['color'] = "color(srgb calc(NaN) 0 0)" should set the property value
|
||||
Pass e.style['color'] = "color(srgb calc(0 / 0) 0 0)" should set the property value
|
||||
Fail e.style['color'] = "color(srgb calc(50% + (sign(1em - 10px) * 10%)) 0 0 / 0.5)" should set the property value
|
||||
Fail e.style['color'] = "color(srgb 0.5 0 0 / calc(50% + (sign(1em - 10px) * 10%)))" should set the property value
|
||||
Pass e.style['color'] = "color(srgb calc(50% + (sign(1em - 10px) * 10%)) 0 0 / 0.5)" should set the property value
|
||||
Pass e.style['color'] = "color(srgb 0.5 0 0 / calc(50% + (sign(1em - 10px) * 10%)))" should set the property value
|
||||
Pass e.style['color'] = "color(srgb-linear 0% 0% 0%)" should set the property value
|
||||
Pass e.style['color'] = "color(srgb-linear 10% 10% 10%)" should set the property value
|
||||
Pass e.style['color'] = "color(srgb-linear .2 .2 25%)" should set the property value
|
||||
|
|
@ -70,8 +70,8 @@ Pass e.style['color'] = "color(srgb-linear 0 calc(infinity) 0)" should set the p
|
|||
Pass e.style['color'] = "color(srgb-linear 0 calc(-infinity) 0)" should set the property value
|
||||
Pass e.style['color'] = "color(srgb-linear calc(NaN) 0 0)" should set the property value
|
||||
Pass e.style['color'] = "color(srgb-linear calc(0 / 0) 0 0)" should set the property value
|
||||
Fail e.style['color'] = "color(srgb-linear calc(50% + (sign(1em - 10px) * 10%)) 0 0 / 0.5)" should set the property value
|
||||
Fail e.style['color'] = "color(srgb-linear 0.5 0 0 / calc(50% + (sign(1em - 10px) * 10%)))" should set the property value
|
||||
Pass e.style['color'] = "color(srgb-linear calc(50% + (sign(1em - 10px) * 10%)) 0 0 / 0.5)" should set the property value
|
||||
Pass e.style['color'] = "color(srgb-linear 0.5 0 0 / calc(50% + (sign(1em - 10px) * 10%)))" should set the property value
|
||||
Pass e.style['color'] = "color(a98-rgb 0% 0% 0%)" should set the property value
|
||||
Pass e.style['color'] = "color(a98-rgb 10% 10% 10%)" should set the property value
|
||||
Pass e.style['color'] = "color(a98-rgb .2 .2 25%)" should set the property value
|
||||
|
|
@ -104,8 +104,8 @@ Pass e.style['color'] = "color(a98-rgb 0 calc(infinity) 0)" should set the prope
|
|||
Pass e.style['color'] = "color(a98-rgb 0 calc(-infinity) 0)" should set the property value
|
||||
Pass e.style['color'] = "color(a98-rgb calc(NaN) 0 0)" should set the property value
|
||||
Pass e.style['color'] = "color(a98-rgb calc(0 / 0) 0 0)" should set the property value
|
||||
Fail e.style['color'] = "color(a98-rgb calc(50% + (sign(1em - 10px) * 10%)) 0 0 / 0.5)" should set the property value
|
||||
Fail e.style['color'] = "color(a98-rgb 0.5 0 0 / calc(50% + (sign(1em - 10px) * 10%)))" should set the property value
|
||||
Pass e.style['color'] = "color(a98-rgb calc(50% + (sign(1em - 10px) * 10%)) 0 0 / 0.5)" should set the property value
|
||||
Pass e.style['color'] = "color(a98-rgb 0.5 0 0 / calc(50% + (sign(1em - 10px) * 10%)))" should set the property value
|
||||
Pass e.style['color'] = "color(rec2020 0% 0% 0%)" should set the property value
|
||||
Pass e.style['color'] = "color(rec2020 10% 10% 10%)" should set the property value
|
||||
Pass e.style['color'] = "color(rec2020 .2 .2 25%)" should set the property value
|
||||
|
|
@ -138,8 +138,8 @@ Pass e.style['color'] = "color(rec2020 0 calc(infinity) 0)" should set the prope
|
|||
Pass e.style['color'] = "color(rec2020 0 calc(-infinity) 0)" should set the property value
|
||||
Pass e.style['color'] = "color(rec2020 calc(NaN) 0 0)" should set the property value
|
||||
Pass e.style['color'] = "color(rec2020 calc(0 / 0) 0 0)" should set the property value
|
||||
Fail e.style['color'] = "color(rec2020 calc(50% + (sign(1em - 10px) * 10%)) 0 0 / 0.5)" should set the property value
|
||||
Fail e.style['color'] = "color(rec2020 0.5 0 0 / calc(50% + (sign(1em - 10px) * 10%)))" should set the property value
|
||||
Pass e.style['color'] = "color(rec2020 calc(50% + (sign(1em - 10px) * 10%)) 0 0 / 0.5)" should set the property value
|
||||
Pass e.style['color'] = "color(rec2020 0.5 0 0 / calc(50% + (sign(1em - 10px) * 10%)))" should set the property value
|
||||
Pass e.style['color'] = "color(prophoto-rgb 0% 0% 0%)" should set the property value
|
||||
Pass e.style['color'] = "color(prophoto-rgb 10% 10% 10%)" should set the property value
|
||||
Pass e.style['color'] = "color(prophoto-rgb .2 .2 25%)" should set the property value
|
||||
|
|
@ -172,8 +172,8 @@ Pass e.style['color'] = "color(prophoto-rgb 0 calc(infinity) 0)" should set the
|
|||
Pass e.style['color'] = "color(prophoto-rgb 0 calc(-infinity) 0)" should set the property value
|
||||
Pass e.style['color'] = "color(prophoto-rgb calc(NaN) 0 0)" should set the property value
|
||||
Pass e.style['color'] = "color(prophoto-rgb calc(0 / 0) 0 0)" should set the property value
|
||||
Fail e.style['color'] = "color(prophoto-rgb calc(50% + (sign(1em - 10px) * 10%)) 0 0 / 0.5)" should set the property value
|
||||
Fail e.style['color'] = "color(prophoto-rgb 0.5 0 0 / calc(50% + (sign(1em - 10px) * 10%)))" should set the property value
|
||||
Pass e.style['color'] = "color(prophoto-rgb calc(50% + (sign(1em - 10px) * 10%)) 0 0 / 0.5)" should set the property value
|
||||
Pass e.style['color'] = "color(prophoto-rgb 0.5 0 0 / calc(50% + (sign(1em - 10px) * 10%)))" should set the property value
|
||||
Pass e.style['color'] = "color(display-p3 0% 0% 0%)" should set the property value
|
||||
Pass e.style['color'] = "color(display-p3 10% 10% 10%)" should set the property value
|
||||
Pass e.style['color'] = "color(display-p3 .2 .2 25%)" should set the property value
|
||||
|
|
@ -206,8 +206,8 @@ Pass e.style['color'] = "color(display-p3 0 calc(infinity) 0)" should set the pr
|
|||
Pass e.style['color'] = "color(display-p3 0 calc(-infinity) 0)" should set the property value
|
||||
Pass e.style['color'] = "color(display-p3 calc(NaN) 0 0)" should set the property value
|
||||
Pass e.style['color'] = "color(display-p3 calc(0 / 0) 0 0)" should set the property value
|
||||
Fail e.style['color'] = "color(display-p3 calc(50% + (sign(1em - 10px) * 10%)) 0 0 / 0.5)" should set the property value
|
||||
Fail e.style['color'] = "color(display-p3 0.5 0 0 / calc(50% + (sign(1em - 10px) * 10%)))" should set the property value
|
||||
Pass e.style['color'] = "color(display-p3 calc(50% + (sign(1em - 10px) * 10%)) 0 0 / 0.5)" should set the property value
|
||||
Pass e.style['color'] = "color(display-p3 0.5 0 0 / calc(50% + (sign(1em - 10px) * 10%)))" should set the property value
|
||||
Pass e.style['color'] = "color(xyz 0% 0% 0%)" should set the property value
|
||||
Pass e.style['color'] = "color(xyz 10% 10% 10%)" should set the property value
|
||||
Pass e.style['color'] = "color(xyz .2 .2 25%)" should set the property value
|
||||
|
|
@ -240,8 +240,8 @@ Pass e.style['color'] = "color(xyz 0 calc(infinity) 0)" should set the property
|
|||
Pass e.style['color'] = "color(xyz 0 calc(-infinity) 0)" should set the property value
|
||||
Pass e.style['color'] = "color(xyz calc(NaN) 0 0)" should set the property value
|
||||
Pass e.style['color'] = "color(xyz calc(0 / 0) 0 0)" should set the property value
|
||||
Fail e.style['color'] = "color(xyz calc(50% + (sign(1em - 10px) * 10%)) 0 0 / 0.5)" should set the property value
|
||||
Fail e.style['color'] = "color(xyz 0.5 0 0 / calc(50% + (sign(1em - 10px) * 10%)))" should set the property value
|
||||
Pass e.style['color'] = "color(xyz calc(50% + (sign(1em - 10px) * 10%)) 0 0 / 0.5)" should set the property value
|
||||
Pass e.style['color'] = "color(xyz 0.5 0 0 / calc(50% + (sign(1em - 10px) * 10%)))" should set the property value
|
||||
Pass e.style['color'] = "color(xyz-d50 0% 0% 0%)" should set the property value
|
||||
Pass e.style['color'] = "color(xyz-d50 10% 10% 10%)" should set the property value
|
||||
Pass e.style['color'] = "color(xyz-d50 .2 .2 25%)" should set the property value
|
||||
|
|
@ -274,8 +274,8 @@ Pass e.style['color'] = "color(xyz-d50 0 calc(infinity) 0)" should set the prope
|
|||
Pass e.style['color'] = "color(xyz-d50 0 calc(-infinity) 0)" should set the property value
|
||||
Pass e.style['color'] = "color(xyz-d50 calc(NaN) 0 0)" should set the property value
|
||||
Pass e.style['color'] = "color(xyz-d50 calc(0 / 0) 0 0)" should set the property value
|
||||
Fail e.style['color'] = "color(xyz-d50 calc(50% + (sign(1em - 10px) * 10%)) 0 0 / 0.5)" should set the property value
|
||||
Fail e.style['color'] = "color(xyz-d50 0.5 0 0 / calc(50% + (sign(1em - 10px) * 10%)))" should set the property value
|
||||
Pass e.style['color'] = "color(xyz-d50 calc(50% + (sign(1em - 10px) * 10%)) 0 0 / 0.5)" should set the property value
|
||||
Pass e.style['color'] = "color(xyz-d50 0.5 0 0 / calc(50% + (sign(1em - 10px) * 10%)))" should set the property value
|
||||
Pass e.style['color'] = "color(xyz-d65 0% 0% 0%)" should set the property value
|
||||
Pass e.style['color'] = "color(xyz-d65 10% 10% 10%)" should set the property value
|
||||
Pass e.style['color'] = "color(xyz-d65 .2 .2 25%)" should set the property value
|
||||
|
|
@ -308,5 +308,5 @@ Pass e.style['color'] = "color(xyz-d65 0 calc(infinity) 0)" should set the prope
|
|||
Pass e.style['color'] = "color(xyz-d65 0 calc(-infinity) 0)" should set the property value
|
||||
Pass e.style['color'] = "color(xyz-d65 calc(NaN) 0 0)" should set the property value
|
||||
Pass e.style['color'] = "color(xyz-d65 calc(0 / 0) 0 0)" should set the property value
|
||||
Fail e.style['color'] = "color(xyz-d65 calc(50% + (sign(1em - 10px) * 10%)) 0 0 / 0.5)" should set the property value
|
||||
Fail e.style['color'] = "color(xyz-d65 0.5 0 0 / calc(50% + (sign(1em - 10px) * 10%)))" should set the property value
|
||||
Pass e.style['color'] = "color(xyz-d65 calc(50% + (sign(1em - 10px) * 10%)) 0 0 / 0.5)" should set the property value
|
||||
Pass e.style['color'] = "color(xyz-d65 0.5 0 0 / calc(50% + (sign(1em - 10px) * 10%)))" should set the property value
|
||||
|
|
@ -2,8 +2,8 @@ Harness status: OK
|
|||
|
||||
Found 40 tests
|
||||
|
||||
22 Pass
|
||||
18 Fail
|
||||
23 Pass
|
||||
17 Fail
|
||||
Pass Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithFixedElement' : grid-template-columns = '7px 11px', grid-template-rows = '17px 2px'
|
||||
Pass Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithPercentElement' : grid-template-columns = '400px 800px', grid-template-rows = '150px 450px'
|
||||
Fail Test getting grid-template-columns and grid-template-rows set through CSS for element 'gridWithPercentWithoutSize' : grid-template-columns = '3.5px 7px', grid-template-rows = '4px 12px'
|
||||
|
|
@ -29,7 +29,7 @@ Pass Test getting and setting grid-template-rows and grid-template-columns throu
|
|||
Pass Test getting and setting grid-template-rows and grid-template-columns through JS: grid-template-columns = '160px 20px', element.style.gridTemplateColumns = '16em minmax(16px, 20px)', grid-template-rows = '90px 0px', element.style.gridTemplateRows = 'minmax(10%, 15%) auto'
|
||||
Pass Test getting and setting grid-template-rows and grid-template-columns through JS: grid-template-columns = '160px 640px', element.style.gridTemplateColumns = '16em 2fr', grid-template-rows = '600px 0px', element.style.gridTemplateRows = '14fr auto'
|
||||
Fail Test getting and setting grid-template-rows and grid-template-columns through JS: grid-template-columns = '25px 20px', element.style.gridTemplateColumns = 'calc(25px) calc(2em)', grid-template-rows = '0px 60px', element.style.gridTemplateRows = 'auto calc(10%)'
|
||||
Fail Test getting and setting grid-template-rows and grid-template-columns through JS: grid-template-columns = '345px 92px', element.style.gridTemplateColumns = 'calc(25px + 40%) minmax(min-content, calc(10% + 12px))', grid-template-rows = '100px 0px', element.style.gridTemplateRows = 'minmax(calc(75% - 350px), max-content) auto'
|
||||
Pass Test getting and setting grid-template-rows and grid-template-columns through JS: grid-template-columns = '345px 92px', element.style.gridTemplateColumns = 'calc(25px + 40%) minmax(min-content, calc(10% + 12px))', grid-template-rows = '100px 0px', element.style.gridTemplateRows = 'minmax(calc(75% - 350px), max-content) auto'
|
||||
Fail Test setting wrong/invalid values through CSS
|
||||
Fail Test setting bad JS values: grid-template-columns = 'none auto', grid-template-rows = 'none auto'
|
||||
Fail Test setting bad JS values: grid-template-columns = 'none 16em', grid-template-rows = 'none 56%'
|
||||
|
|
|
|||
|
|
@ -2,29 +2,29 @@ Harness status: OK
|
|||
|
||||
Found 24 tests
|
||||
|
||||
8 Pass
|
||||
16 Fail
|
||||
Fail testing calc(1vh + 2px + 3%)
|
||||
21 Pass
|
||||
3 Fail
|
||||
Pass testing calc(1vh + 2px + 3%)
|
||||
Pass testing calc(4px + 1vh)
|
||||
Fail testing calc(5px + 6em + 1vh)
|
||||
Fail testing calc(-8px + 9em + 1vh)
|
||||
Fail testing calc(1pc + 1in + 1vh + 10%)
|
||||
Fail testing calc(25.4q + 1vh + 12%)
|
||||
Fail testing calc(1em + 1.27cm + 13% + 3em)
|
||||
Fail testing calc(15vw + 16vmin - 17vh)
|
||||
Pass testing calc(5px + 6em + 1vh)
|
||||
Pass testing calc(-8px + 9em + 1vh)
|
||||
Pass testing calc(1pc + 1in + 1vh + 10%)
|
||||
Pass testing calc(25.4q + 1vh + 12%)
|
||||
Pass testing calc(1em + 1.27cm + 13% + 3em)
|
||||
Pass testing calc(15vw + 16vmin - 17vh)
|
||||
Pass testing calc(9pt + calc(9rem + 10px))
|
||||
Fail testing calc(5pt + 5em + 4pt + 3em)
|
||||
Fail testing calc(4vmin + 0pt + 3pc)
|
||||
Fail testing calc(4vmin + 0pt)
|
||||
Pass testing calc(5pt + 5em + 4pt + 3em)
|
||||
Pass testing calc(4vmin + 0pt + 3pc)
|
||||
Pass testing calc(4vmin + 0pt)
|
||||
Pass testing calc(100% - 100% + 1em)
|
||||
Pass testing calc(100% + 1em - 100%)
|
||||
Fail testing calc(1vh - 7px)
|
||||
Pass testing calc(1vh - 7px)
|
||||
Fail testing calc(5ex - 9ex)
|
||||
Fail testing calc(-80px + 25.4mm)
|
||||
Pass testing calc(2 * (10px + 1rem))
|
||||
Pass testing calc(2 * (10px - 1rem))
|
||||
Pass testing calc((10px + 1rem) / 2)
|
||||
Pass testing calc(2 * (min(10px, 20%) + max(1rem, 2%)))
|
||||
Fail testing calc((min(10px, 20%) + max(1rem, 2%)) * 2)
|
||||
Fail testing calc(1vmin - 14%)
|
||||
Pass testing calc((min(10px, 20%) + max(1rem, 2%)) * 2)
|
||||
Pass testing calc(1vmin - 14%)
|
||||
Fail testing calc(4 * 3px + 4pc / 8)
|
||||
Loading…
Add table
Reference in a new issue