LibWeb: Improve interpolation of mixed percentage-dimension values

If we are interpolating between a dimension and a percentage value and
the dimension component is 0, we now return a percentage value rather
than a `calc()` value.
This commit is contained in:
Tim Ledbetter 2025-09-09 15:49:31 +01:00 committed by Sam Atkins
commit 9c062d9d4e
Notes: github-actions[bot] 2025-09-10 16:01:26 +00:00
5 changed files with 138 additions and 104 deletions

View file

@ -1100,6 +1100,44 @@ static RefPtr<StyleValue const> interpolate_value_impl(DOM::Element& element, Ca
}
};
auto to_raw_value = [](StyleValue const& value) -> double {
switch (value.type()) {
case StyleValue::Type::Angle:
return value.as_angle().raw_value();
case StyleValue::Type::Frequency:
return value.as_frequency().raw_value();
case StyleValue::Type::Integer:
return value.as_integer().integer();
case StyleValue::Type::Length:
return value.as_length().raw_value();
case StyleValue::Type::Number:
return value.as_number().number();
case StyleValue::Type::Percentage:
return value.as_percentage().raw_value();
case StyleValue::Type::Time:
return value.as_time().raw_value();
default:
VERIFY_NOT_REACHED();
}
};
// https://drafts.csswg.org/css-values-4/#combine-mixed
// The computed value of a percentage-dimension mix is defined as
// FIXME: a computed dimension if the percentage component is zero or is defined specifically to compute to a dimension value
// a computed percentage if the dimension component is zero
// a computed calc() expression otherwise
if (from.type() != StyleValue::Type::Calculated && to.type() == StyleValue::Type::Percentage) {
auto dimension_component = to_raw_value(from) * (1.f - delta);
auto percentage_component = to.as_percentage().raw_value() * delta;
if (dimension_component == 0.f)
return PercentageStyleValue::create(Percentage { percentage_component });
} else if (from.type() == StyleValue::Type::Percentage && to.type() != StyleValue::Type::Calculated) {
auto dimension_component = to_raw_value(to) * delta;
auto percentage_component = from.as_percentage().raw_value() * (1.f - delta);
if (dimension_component == 0)
return PercentageStyleValue::create(Percentage { percentage_component });
}
auto from_node = to_calculation_node(from);
auto to_node = to_calculation_node(to);

View file

@ -2,8 +2,7 @@ Harness status: OK
Found 558 tests
550 Pass
8 Fail
558 Pass
Pass CSS Transitions: property <border-image-width> from neutral to [20px] at (-0.3) should be [7px]
Pass CSS Transitions: property <border-image-width> from neutral to [20px] at (0) should be [10px]
Pass CSS Transitions: property <border-image-width> from neutral to [20px] at (0.3) should be [13px]
@ -281,25 +280,25 @@ Pass Web Animations: property <border-image-width> from [10px 20% 30 40px] to [8
Pass Web Animations: property <border-image-width> from [10px 20% 30 40px] to [80px 70% 60 50px] at (5) should be [360px 270% 180 90px]
Pass Web Animations: property <border-image-width> from [10px 20% 30 40px] to [80px 70% 60 50px] at (10) should be [710px 520% 330 140px]
Pass CSS Transitions: property <border-image-width> from [10%] to [20px] at (-0.3) should be [calc(13% + -6px)]
Fail CSS Transitions: property <border-image-width> from [10%] to [20px] at (0) should be [10%]
Pass CSS Transitions: property <border-image-width> from [10%] to [20px] at (0) should be [10%]
Pass CSS Transitions: property <border-image-width> from [10%] to [20px] at (0.3) should be [calc(7% + 6px)]
Pass CSS Transitions: property <border-image-width> from [10%] to [20px] at (0.6) should be [calc(4% + 12px)]
Pass CSS Transitions: property <border-image-width> from [10%] to [20px] at (1) should be [calc(0% + 20px)]
Pass CSS Transitions: property <border-image-width> from [10%] to [20px] at (1.5) should be [calc(-5% + 30px)]
Pass CSS Transitions with transition: all: property <border-image-width> from [10%] to [20px] at (-0.3) should be [calc(13% + -6px)]
Fail CSS Transitions with transition: all: property <border-image-width> from [10%] to [20px] at (0) should be [10%]
Pass CSS Transitions with transition: all: property <border-image-width> from [10%] to [20px] at (0) should be [10%]
Pass CSS Transitions with transition: all: property <border-image-width> from [10%] to [20px] at (0.3) should be [calc(7% + 6px)]
Pass CSS Transitions with transition: all: property <border-image-width> from [10%] to [20px] at (0.6) should be [calc(4% + 12px)]
Pass CSS Transitions with transition: all: property <border-image-width> from [10%] to [20px] at (1) should be [calc(0% + 20px)]
Pass CSS Transitions with transition: all: property <border-image-width> from [10%] to [20px] at (1.5) should be [calc(-5% + 30px)]
Pass CSS Animations: property <border-image-width> from [10%] to [20px] at (-0.3) should be [calc(13% + -6px)]
Fail CSS Animations: property <border-image-width> from [10%] to [20px] at (0) should be [10%]
Pass CSS Animations: property <border-image-width> from [10%] to [20px] at (0) should be [10%]
Pass CSS Animations: property <border-image-width> from [10%] to [20px] at (0.3) should be [calc(7% + 6px)]
Pass CSS Animations: property <border-image-width> from [10%] to [20px] at (0.6) should be [calc(4% + 12px)]
Pass CSS Animations: property <border-image-width> from [10%] to [20px] at (1) should be [calc(0% + 20px)]
Pass CSS Animations: property <border-image-width> from [10%] to [20px] at (1.5) should be [calc(-5% + 30px)]
Pass Web Animations: property <border-image-width> from [10%] to [20px] at (-0.3) should be [calc(13% + -6px)]
Fail Web Animations: property <border-image-width> from [10%] to [20px] at (0) should be [10%]
Pass Web Animations: property <border-image-width> from [10%] to [20px] at (0) should be [10%]
Pass Web Animations: property <border-image-width> from [10%] to [20px] at (0.3) should be [calc(7% + 6px)]
Pass Web Animations: property <border-image-width> from [10%] to [20px] at (0.6) should be [calc(4% + 12px)]
Pass Web Animations: property <border-image-width> from [10%] to [20px] at (1) should be [calc(0% + 20px)]
@ -308,25 +307,25 @@ Pass CSS Transitions: property <border-image-width> from [10px] to [20%] at (-0.
Pass CSS Transitions: property <border-image-width> from [10px] to [20%] at (0) should be [calc(0% + 10px)]
Pass CSS Transitions: property <border-image-width> from [10px] to [20%] at (0.3) should be [calc(7px + 6%)]
Pass CSS Transitions: property <border-image-width> from [10px] to [20%] at (0.6) should be [calc(4px + 12%)]
Fail CSS Transitions: property <border-image-width> from [10px] to [20%] at (1) should be [20%]
Pass CSS Transitions: property <border-image-width> from [10px] to [20%] at (1) should be [20%]
Pass CSS Transitions: property <border-image-width> from [10px] to [20%] at (1.5) should be [calc(-5px + 30%)]
Pass CSS Transitions with transition: all: property <border-image-width> from [10px] to [20%] at (-0.3) should be [calc(13px + -6%)]
Pass CSS Transitions with transition: all: property <border-image-width> from [10px] to [20%] at (0) should be [calc(0% + 10px)]
Pass CSS Transitions with transition: all: property <border-image-width> from [10px] to [20%] at (0.3) should be [calc(7px + 6%)]
Pass CSS Transitions with transition: all: property <border-image-width> from [10px] to [20%] at (0.6) should be [calc(4px + 12%)]
Fail CSS Transitions with transition: all: property <border-image-width> from [10px] to [20%] at (1) should be [20%]
Pass CSS Transitions with transition: all: property <border-image-width> from [10px] to [20%] at (1) should be [20%]
Pass CSS Transitions with transition: all: property <border-image-width> from [10px] to [20%] at (1.5) should be [calc(-5px + 30%)]
Pass CSS Animations: property <border-image-width> from [10px] to [20%] at (-0.3) should be [calc(13px + -6%)]
Pass CSS Animations: property <border-image-width> from [10px] to [20%] at (0) should be [calc(0% + 10px)]
Pass CSS Animations: property <border-image-width> from [10px] to [20%] at (0.3) should be [calc(7px + 6%)]
Pass CSS Animations: property <border-image-width> from [10px] to [20%] at (0.6) should be [calc(4px + 12%)]
Fail CSS Animations: property <border-image-width> from [10px] to [20%] at (1) should be [20%]
Pass CSS Animations: property <border-image-width> from [10px] to [20%] at (1) should be [20%]
Pass CSS Animations: property <border-image-width> from [10px] to [20%] at (1.5) should be [calc(-5px + 30%)]
Pass Web Animations: property <border-image-width> from [10px] to [20%] at (-0.3) should be [calc(13px + -6%)]
Pass Web Animations: property <border-image-width> from [10px] to [20%] at (0) should be [calc(0% + 10px)]
Pass Web Animations: property <border-image-width> from [10px] to [20%] at (0.3) should be [calc(7px + 6%)]
Pass Web Animations: property <border-image-width> from [10px] to [20%] at (0.6) should be [calc(4px + 12%)]
Fail Web Animations: property <border-image-width> from [10px] to [20%] at (1) should be [20%]
Pass Web Animations: property <border-image-width> from [10px] to [20%] at (1) should be [20%]
Pass Web Animations: property <border-image-width> from [10px] to [20%] at (1.5) should be [calc(-5px + 30%)]
Pass CSS Transitions: property <border-image-width> from [10px auto auto 20] to [110px auto auto 120] at (-0.3) should be [ 0px auto auto 0]
Pass CSS Transitions: property <border-image-width> from [10px auto auto 20] to [110px auto auto 120] at (0) should be [ 10px auto auto 20]

View file

@ -2,8 +2,7 @@ Harness status: OK
Found 288 tests
232 Pass
56 Fail
288 Pass
Pass CSS Transitions: property <text-decoration-thickness> from [16px] to [0px] at (0) should be [16px]
Pass CSS Transitions: property <text-decoration-thickness> from [16px] to [0px] at (0.3) should be [11.2px]
Pass CSS Transitions: property <text-decoration-thickness> from [16px] to [0px] at (0.6) should be [6.4px]
@ -135,35 +134,35 @@ Pass Web Animations: property <text-decoration-thickness> from [16px] to [2em] a
Pass CSS Transitions: property <text-decoration-thickness> from [16px] to [0%] at (0) should be [calc(0% + 16px)]
Pass CSS Transitions: property <text-decoration-thickness> from [16px] to [0%] at (0.3) should be [calc(0% + 11.2px)]
Pass CSS Transitions: property <text-decoration-thickness> from [16px] to [0%] at (0.6) should be [calc(0% + 6.4px)]
Fail CSS Transitions: property <text-decoration-thickness> from [16px] to [0%] at (1) should be [0%]
Pass CSS Transitions: property <text-decoration-thickness> from [16px] to [0%] at (1) should be [0%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [16px] to [0%] at (0) should be [calc(0% + 16px)]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [16px] to [0%] at (0.3) should be [calc(0% + 11.2px)]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [16px] to [0%] at (0.6) should be [calc(0% + 6.4px)]
Fail CSS Transitions with transition: all: property <text-decoration-thickness> from [16px] to [0%] at (1) should be [0%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [16px] to [0%] at (1) should be [0%]
Pass CSS Animations: property <text-decoration-thickness> from [16px] to [0%] at (0) should be [calc(0% + 16px)]
Pass CSS Animations: property <text-decoration-thickness> from [16px] to [0%] at (0.3) should be [calc(0% + 11.2px)]
Pass CSS Animations: property <text-decoration-thickness> from [16px] to [0%] at (0.6) should be [calc(0% + 6.4px)]
Fail CSS Animations: property <text-decoration-thickness> from [16px] to [0%] at (1) should be [0%]
Pass CSS Animations: property <text-decoration-thickness> from [16px] to [0%] at (1) should be [0%]
Pass Web Animations: property <text-decoration-thickness> from [16px] to [0%] at (0) should be [calc(0% + 16px)]
Pass Web Animations: property <text-decoration-thickness> from [16px] to [0%] at (0.3) should be [calc(0% + 11.2px)]
Pass Web Animations: property <text-decoration-thickness> from [16px] to [0%] at (0.6) should be [calc(0% + 6.4px)]
Fail Web Animations: property <text-decoration-thickness> from [16px] to [0%] at (1) should be [0%]
Pass Web Animations: property <text-decoration-thickness> from [16px] to [0%] at (1) should be [0%]
Pass CSS Transitions: property <text-decoration-thickness> from [16px] to [200%] at (0) should be [calc(0% + 16px)]
Pass CSS Transitions: property <text-decoration-thickness> from [16px] to [200%] at (0.3) should be [calc(60% + 11.2px)]
Pass CSS Transitions: property <text-decoration-thickness> from [16px] to [200%] at (0.6) should be [calc(120% + 6.4px)]
Fail CSS Transitions: property <text-decoration-thickness> from [16px] to [200%] at (1) should be [200%]
Pass CSS Transitions: property <text-decoration-thickness> from [16px] to [200%] at (1) should be [200%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [16px] to [200%] at (0) should be [calc(0% + 16px)]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [16px] to [200%] at (0.3) should be [calc(60% + 11.2px)]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [16px] to [200%] at (0.6) should be [calc(120% + 6.4px)]
Fail CSS Transitions with transition: all: property <text-decoration-thickness> from [16px] to [200%] at (1) should be [200%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [16px] to [200%] at (1) should be [200%]
Pass CSS Animations: property <text-decoration-thickness> from [16px] to [200%] at (0) should be [calc(0% + 16px)]
Pass CSS Animations: property <text-decoration-thickness> from [16px] to [200%] at (0.3) should be [calc(60% + 11.2px)]
Pass CSS Animations: property <text-decoration-thickness> from [16px] to [200%] at (0.6) should be [calc(120% + 6.4px)]
Fail CSS Animations: property <text-decoration-thickness> from [16px] to [200%] at (1) should be [200%]
Pass CSS Animations: property <text-decoration-thickness> from [16px] to [200%] at (1) should be [200%]
Pass Web Animations: property <text-decoration-thickness> from [16px] to [200%] at (0) should be [calc(0% + 16px)]
Pass Web Animations: property <text-decoration-thickness> from [16px] to [200%] at (0.3) should be [calc(60% + 11.2px)]
Pass Web Animations: property <text-decoration-thickness> from [16px] to [200%] at (0.6) should be [calc(120% + 6.4px)]
Fail Web Animations: property <text-decoration-thickness> from [16px] to [200%] at (1) should be [200%]
Pass Web Animations: property <text-decoration-thickness> from [16px] to [200%] at (1) should be [200%]
Pass CSS Transitions: property <text-decoration-thickness> from [1em] to [0px] at (0) should be [16px]
Pass CSS Transitions: property <text-decoration-thickness> from [1em] to [0px] at (0.3) should be [11.2px]
Pass CSS Transitions: property <text-decoration-thickness> from [1em] to [0px] at (0.6) should be [6.4px]
@ -199,96 +198,96 @@ Pass Web Animations: property <text-decoration-thickness> from [1em] to [32px] a
Pass CSS Transitions: property <text-decoration-thickness> from [1em] to [0%] at (0) should be [calc(0% + 16px)]
Pass CSS Transitions: property <text-decoration-thickness> from [1em] to [0%] at (0.3) should be [calc(0% + 11.2px)]
Pass CSS Transitions: property <text-decoration-thickness> from [1em] to [0%] at (0.6) should be [calc(0% + 6.4px)]
Fail CSS Transitions: property <text-decoration-thickness> from [1em] to [0%] at (1) should be [0%]
Pass CSS Transitions: property <text-decoration-thickness> from [1em] to [0%] at (1) should be [0%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [1em] to [0%] at (0) should be [calc(0% + 16px)]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [1em] to [0%] at (0.3) should be [calc(0% + 11.2px)]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [1em] to [0%] at (0.6) should be [calc(0% + 6.4px)]
Fail CSS Transitions with transition: all: property <text-decoration-thickness> from [1em] to [0%] at (1) should be [0%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [1em] to [0%] at (1) should be [0%]
Pass CSS Animations: property <text-decoration-thickness> from [1em] to [0%] at (0) should be [calc(0% + 16px)]
Pass CSS Animations: property <text-decoration-thickness> from [1em] to [0%] at (0.3) should be [calc(0% + 11.2px)]
Pass CSS Animations: property <text-decoration-thickness> from [1em] to [0%] at (0.6) should be [calc(0% + 6.4px)]
Fail CSS Animations: property <text-decoration-thickness> from [1em] to [0%] at (1) should be [0%]
Pass CSS Animations: property <text-decoration-thickness> from [1em] to [0%] at (1) should be [0%]
Pass Web Animations: property <text-decoration-thickness> from [1em] to [0%] at (0) should be [calc(0% + 16px)]
Pass Web Animations: property <text-decoration-thickness> from [1em] to [0%] at (0.3) should be [calc(0% + 11.2px)]
Pass Web Animations: property <text-decoration-thickness> from [1em] to [0%] at (0.6) should be [calc(0% + 6.4px)]
Fail Web Animations: property <text-decoration-thickness> from [1em] to [0%] at (1) should be [0%]
Pass Web Animations: property <text-decoration-thickness> from [1em] to [0%] at (1) should be [0%]
Pass CSS Transitions: property <text-decoration-thickness> from [1em] to [200%] at (0) should be [calc(0% + 16px)]
Pass CSS Transitions: property <text-decoration-thickness> from [1em] to [200%] at (0.3) should be [calc(60% + 11.2px)]
Pass CSS Transitions: property <text-decoration-thickness> from [1em] to [200%] at (0.6) should be [calc(120% + 6.4px)]
Fail CSS Transitions: property <text-decoration-thickness> from [1em] to [200%] at (1) should be [200%]
Pass CSS Transitions: property <text-decoration-thickness> from [1em] to [200%] at (1) should be [200%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [1em] to [200%] at (0) should be [calc(0% + 16px)]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [1em] to [200%] at (0.3) should be [calc(60% + 11.2px)]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [1em] to [200%] at (0.6) should be [calc(120% + 6.4px)]
Fail CSS Transitions with transition: all: property <text-decoration-thickness> from [1em] to [200%] at (1) should be [200%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [1em] to [200%] at (1) should be [200%]
Pass CSS Animations: property <text-decoration-thickness> from [1em] to [200%] at (0) should be [calc(0% + 16px)]
Pass CSS Animations: property <text-decoration-thickness> from [1em] to [200%] at (0.3) should be [calc(60% + 11.2px)]
Pass CSS Animations: property <text-decoration-thickness> from [1em] to [200%] at (0.6) should be [calc(120% + 6.4px)]
Fail CSS Animations: property <text-decoration-thickness> from [1em] to [200%] at (1) should be [200%]
Pass CSS Animations: property <text-decoration-thickness> from [1em] to [200%] at (1) should be [200%]
Pass Web Animations: property <text-decoration-thickness> from [1em] to [200%] at (0) should be [calc(0% + 16px)]
Pass Web Animations: property <text-decoration-thickness> from [1em] to [200%] at (0.3) should be [calc(60% + 11.2px)]
Pass Web Animations: property <text-decoration-thickness> from [1em] to [200%] at (0.6) should be [calc(120% + 6.4px)]
Fail Web Animations: property <text-decoration-thickness> from [1em] to [200%] at (1) should be [200%]
Fail CSS Transitions: property <text-decoration-thickness> from [100%] to [0px] at (0) should be [100%]
Fail CSS Transitions: property <text-decoration-thickness> from [100%] to [0px] at (0.3) should be [70%]
Fail CSS Transitions: property <text-decoration-thickness> from [100%] to [0px] at (0.6) should be [40%]
Fail CSS Transitions: property <text-decoration-thickness> from [100%] to [0px] at (1) should be [0%]
Fail CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [0px] at (0) should be [100%]
Fail CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [0px] at (0.3) should be [70%]
Fail CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [0px] at (0.6) should be [40%]
Fail CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [0px] at (1) should be [0%]
Fail CSS Animations: property <text-decoration-thickness> from [100%] to [0px] at (0) should be [100%]
Fail CSS Animations: property <text-decoration-thickness> from [100%] to [0px] at (0.3) should be [70%]
Fail CSS Animations: property <text-decoration-thickness> from [100%] to [0px] at (0.6) should be [40%]
Fail CSS Animations: property <text-decoration-thickness> from [100%] to [0px] at (1) should be [0%]
Fail Web Animations: property <text-decoration-thickness> from [100%] to [0px] at (0) should be [100%]
Fail Web Animations: property <text-decoration-thickness> from [100%] to [0px] at (0.3) should be [70%]
Fail Web Animations: property <text-decoration-thickness> from [100%] to [0px] at (0.6) should be [40%]
Fail Web Animations: property <text-decoration-thickness> from [100%] to [0px] at (1) should be [0%]
Fail CSS Transitions: property <text-decoration-thickness> from [100%] to [32px] at (0) should be [100%]
Pass Web Animations: property <text-decoration-thickness> from [1em] to [200%] at (1) should be [200%]
Pass CSS Transitions: property <text-decoration-thickness> from [100%] to [0px] at (0) should be [100%]
Pass CSS Transitions: property <text-decoration-thickness> from [100%] to [0px] at (0.3) should be [70%]
Pass CSS Transitions: property <text-decoration-thickness> from [100%] to [0px] at (0.6) should be [40%]
Pass CSS Transitions: property <text-decoration-thickness> from [100%] to [0px] at (1) should be [0%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [0px] at (0) should be [100%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [0px] at (0.3) should be [70%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [0px] at (0.6) should be [40%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [0px] at (1) should be [0%]
Pass CSS Animations: property <text-decoration-thickness> from [100%] to [0px] at (0) should be [100%]
Pass CSS Animations: property <text-decoration-thickness> from [100%] to [0px] at (0.3) should be [70%]
Pass CSS Animations: property <text-decoration-thickness> from [100%] to [0px] at (0.6) should be [40%]
Pass CSS Animations: property <text-decoration-thickness> from [100%] to [0px] at (1) should be [0%]
Pass Web Animations: property <text-decoration-thickness> from [100%] to [0px] at (0) should be [100%]
Pass Web Animations: property <text-decoration-thickness> from [100%] to [0px] at (0.3) should be [70%]
Pass Web Animations: property <text-decoration-thickness> from [100%] to [0px] at (0.6) should be [40%]
Pass Web Animations: property <text-decoration-thickness> from [100%] to [0px] at (1) should be [0%]
Pass CSS Transitions: property <text-decoration-thickness> from [100%] to [32px] at (0) should be [100%]
Pass CSS Transitions: property <text-decoration-thickness> from [100%] to [32px] at (0.3) should be [calc(70% + 9.6px)]
Pass CSS Transitions: property <text-decoration-thickness> from [100%] to [32px] at (0.6) should be [calc(40% + 19.2px)]
Pass CSS Transitions: property <text-decoration-thickness> from [100%] to [32px] at (1) should be [calc(0% + 32px)]
Fail CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [32px] at (0) should be [100%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [32px] at (0) should be [100%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [32px] at (0.3) should be [calc(70% + 9.6px)]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [32px] at (0.6) should be [calc(40% + 19.2px)]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [32px] at (1) should be [calc(0% + 32px)]
Fail CSS Animations: property <text-decoration-thickness> from [100%] to [32px] at (0) should be [100%]
Pass CSS Animations: property <text-decoration-thickness> from [100%] to [32px] at (0) should be [100%]
Pass CSS Animations: property <text-decoration-thickness> from [100%] to [32px] at (0.3) should be [calc(70% + 9.6px)]
Pass CSS Animations: property <text-decoration-thickness> from [100%] to [32px] at (0.6) should be [calc(40% + 19.2px)]
Pass CSS Animations: property <text-decoration-thickness> from [100%] to [32px] at (1) should be [calc(0% + 32px)]
Fail Web Animations: property <text-decoration-thickness> from [100%] to [32px] at (0) should be [100%]
Pass Web Animations: property <text-decoration-thickness> from [100%] to [32px] at (0) should be [100%]
Pass Web Animations: property <text-decoration-thickness> from [100%] to [32px] at (0.3) should be [calc(70% + 9.6px)]
Pass Web Animations: property <text-decoration-thickness> from [100%] to [32px] at (0.6) should be [calc(40% + 19.2px)]
Pass Web Animations: property <text-decoration-thickness> from [100%] to [32px] at (1) should be [calc(0% + 32px)]
Fail CSS Transitions: property <text-decoration-thickness> from [100%] to [0em] at (0) should be [100%]
Fail CSS Transitions: property <text-decoration-thickness> from [100%] to [0em] at (0.3) should be [70%]
Fail CSS Transitions: property <text-decoration-thickness> from [100%] to [0em] at (0.6) should be [40%]
Fail CSS Transitions: property <text-decoration-thickness> from [100%] to [0em] at (1) should be [0%]
Fail CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [0em] at (0) should be [100%]
Fail CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [0em] at (0.3) should be [70%]
Fail CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [0em] at (0.6) should be [40%]
Fail CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [0em] at (1) should be [0%]
Fail CSS Animations: property <text-decoration-thickness> from [100%] to [0em] at (0) should be [100%]
Fail CSS Animations: property <text-decoration-thickness> from [100%] to [0em] at (0.3) should be [70%]
Fail CSS Animations: property <text-decoration-thickness> from [100%] to [0em] at (0.6) should be [40%]
Fail CSS Animations: property <text-decoration-thickness> from [100%] to [0em] at (1) should be [0%]
Fail Web Animations: property <text-decoration-thickness> from [100%] to [0em] at (0) should be [100%]
Fail Web Animations: property <text-decoration-thickness> from [100%] to [0em] at (0.3) should be [70%]
Fail Web Animations: property <text-decoration-thickness> from [100%] to [0em] at (0.6) should be [40%]
Fail Web Animations: property <text-decoration-thickness> from [100%] to [0em] at (1) should be [0%]
Fail CSS Transitions: property <text-decoration-thickness> from [100%] to [2em] at (0) should be [100%]
Pass CSS Transitions: property <text-decoration-thickness> from [100%] to [0em] at (0) should be [100%]
Pass CSS Transitions: property <text-decoration-thickness> from [100%] to [0em] at (0.3) should be [70%]
Pass CSS Transitions: property <text-decoration-thickness> from [100%] to [0em] at (0.6) should be [40%]
Pass CSS Transitions: property <text-decoration-thickness> from [100%] to [0em] at (1) should be [0%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [0em] at (0) should be [100%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [0em] at (0.3) should be [70%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [0em] at (0.6) should be [40%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [0em] at (1) should be [0%]
Pass CSS Animations: property <text-decoration-thickness> from [100%] to [0em] at (0) should be [100%]
Pass CSS Animations: property <text-decoration-thickness> from [100%] to [0em] at (0.3) should be [70%]
Pass CSS Animations: property <text-decoration-thickness> from [100%] to [0em] at (0.6) should be [40%]
Pass CSS Animations: property <text-decoration-thickness> from [100%] to [0em] at (1) should be [0%]
Pass Web Animations: property <text-decoration-thickness> from [100%] to [0em] at (0) should be [100%]
Pass Web Animations: property <text-decoration-thickness> from [100%] to [0em] at (0.3) should be [70%]
Pass Web Animations: property <text-decoration-thickness> from [100%] to [0em] at (0.6) should be [40%]
Pass Web Animations: property <text-decoration-thickness> from [100%] to [0em] at (1) should be [0%]
Pass CSS Transitions: property <text-decoration-thickness> from [100%] to [2em] at (0) should be [100%]
Pass CSS Transitions: property <text-decoration-thickness> from [100%] to [2em] at (0.3) should be [calc(70% + 9.6px)]
Pass CSS Transitions: property <text-decoration-thickness> from [100%] to [2em] at (0.6) should be [calc(40% + 19.2px)]
Pass CSS Transitions: property <text-decoration-thickness> from [100%] to [2em] at (1) should be [calc(0% + 32px)]
Fail CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [2em] at (0) should be [100%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [2em] at (0) should be [100%]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [2em] at (0.3) should be [calc(70% + 9.6px)]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [2em] at (0.6) should be [calc(40% + 19.2px)]
Pass CSS Transitions with transition: all: property <text-decoration-thickness> from [100%] to [2em] at (1) should be [calc(0% + 32px)]
Fail CSS Animations: property <text-decoration-thickness> from [100%] to [2em] at (0) should be [100%]
Pass CSS Animations: property <text-decoration-thickness> from [100%] to [2em] at (0) should be [100%]
Pass CSS Animations: property <text-decoration-thickness> from [100%] to [2em] at (0.3) should be [calc(70% + 9.6px)]
Pass CSS Animations: property <text-decoration-thickness> from [100%] to [2em] at (0.6) should be [calc(40% + 19.2px)]
Pass CSS Animations: property <text-decoration-thickness> from [100%] to [2em] at (1) should be [calc(0% + 32px)]
Fail Web Animations: property <text-decoration-thickness> from [100%] to [2em] at (0) should be [100%]
Pass Web Animations: property <text-decoration-thickness> from [100%] to [2em] at (0) should be [100%]
Pass Web Animations: property <text-decoration-thickness> from [100%] to [2em] at (0.3) should be [calc(70% + 9.6px)]
Pass Web Animations: property <text-decoration-thickness> from [100%] to [2em] at (0.6) should be [calc(40% + 19.2px)]
Pass Web Animations: property <text-decoration-thickness> from [100%] to [2em] at (1) should be [calc(0% + 32px)]

View file

@ -2,8 +2,7 @@ Harness status: OK
Found 408 tests
380 Pass
28 Fail
408 Pass
Pass CSS Transitions: property <translate> from [-100px] to [100px] at (-1) should be [-300px]
Pass CSS Transitions: property <translate> from [-100px] to [100px] at (0) should be [-100px]
Pass CSS Transitions: property <translate> from [-100px] to [100px] at (0.25) should be [-50px]
@ -152,25 +151,25 @@ Pass CSS Transitions: property <translate> from [480px 400px 320px] to [240% 160
Pass CSS Transitions: property <translate> from [480px 400px 320px] to [240% 160%] at (0) should be [calc(0% + 480px) calc(0% + 400px) 320px]
Pass CSS Transitions: property <translate> from [480px 400px 320px] to [240% 160%] at (0.125) should be [calc(420px + 30%) calc(350px + 20%) 280px]
Pass CSS Transitions: property <translate> from [480px 400px 320px] to [240% 160%] at (0.875) should be [calc(210% + 60px) calc(140% + 50px) 40px]
Fail CSS Transitions: property <translate> from [480px 400px 320px] to [240% 160%] at (1) should be [240% 160%]
Pass CSS Transitions: property <translate> from [480px 400px 320px] to [240% 160%] at (1) should be [240% 160%]
Pass CSS Transitions: property <translate> from [480px 400px 320px] to [240% 160%] at (2) should be [calc(480% - 480px) calc(320% - 400px) -320px]
Pass CSS Transitions with transition: all: property <translate> from [480px 400px 320px] to [240% 160%] at (-1) should be [calc(960px - 240%) calc(800px - 160%) 640px]
Pass CSS Transitions with transition: all: property <translate> from [480px 400px 320px] to [240% 160%] at (0) should be [calc(0% + 480px) calc(0% + 400px) 320px]
Pass CSS Transitions with transition: all: property <translate> from [480px 400px 320px] to [240% 160%] at (0.125) should be [calc(420px + 30%) calc(350px + 20%) 280px]
Pass CSS Transitions with transition: all: property <translate> from [480px 400px 320px] to [240% 160%] at (0.875) should be [calc(210% + 60px) calc(140% + 50px) 40px]
Fail CSS Transitions with transition: all: property <translate> from [480px 400px 320px] to [240% 160%] at (1) should be [240% 160%]
Pass CSS Transitions with transition: all: property <translate> from [480px 400px 320px] to [240% 160%] at (1) should be [240% 160%]
Pass CSS Transitions with transition: all: property <translate> from [480px 400px 320px] to [240% 160%] at (2) should be [calc(480% - 480px) calc(320% - 400px) -320px]
Pass CSS Animations: property <translate> from [480px 400px 320px] to [240% 160%] at (-1) should be [calc(960px - 240%) calc(800px - 160%) 640px]
Pass CSS Animations: property <translate> from [480px 400px 320px] to [240% 160%] at (0) should be [calc(0% + 480px) calc(0% + 400px) 320px]
Pass CSS Animations: property <translate> from [480px 400px 320px] to [240% 160%] at (0.125) should be [calc(420px + 30%) calc(350px + 20%) 280px]
Pass CSS Animations: property <translate> from [480px 400px 320px] to [240% 160%] at (0.875) should be [calc(210% + 60px) calc(140% + 50px) 40px]
Fail CSS Animations: property <translate> from [480px 400px 320px] to [240% 160%] at (1) should be [240% 160%]
Pass CSS Animations: property <translate> from [480px 400px 320px] to [240% 160%] at (1) should be [240% 160%]
Pass CSS Animations: property <translate> from [480px 400px 320px] to [240% 160%] at (2) should be [calc(480% - 480px) calc(320% - 400px) -320px]
Pass Web Animations: property <translate> from [480px 400px 320px] to [240% 160%] at (-1) should be [calc(960px - 240%) calc(800px - 160%) 640px]
Pass Web Animations: property <translate> from [480px 400px 320px] to [240% 160%] at (0) should be [calc(0% + 480px) calc(0% + 400px) 320px]
Pass Web Animations: property <translate> from [480px 400px 320px] to [240% 160%] at (0.125) should be [calc(420px + 30%) calc(350px + 20%) 280px]
Pass Web Animations: property <translate> from [480px 400px 320px] to [240% 160%] at (0.875) should be [calc(210% + 60px) calc(140% + 50px) 40px]
Fail Web Animations: property <translate> from [480px 400px 320px] to [240% 160%] at (1) should be [240% 160%]
Pass Web Animations: property <translate> from [480px 400px 320px] to [240% 160%] at (1) should be [240% 160%]
Pass Web Animations: property <translate> from [480px 400px 320px] to [240% 160%] at (2) should be [calc(480% - 480px) calc(320% - 400px) -320px]
Pass CSS Transitions: property <translate> from [none] to [none] at (-1) should be [none]
Pass CSS Transitions: property <translate> from [none] to [none] at (0) should be [none]
@ -196,30 +195,30 @@ Pass Web Animations: property <translate> from [none] to [none] at (0.125) shoul
Pass Web Animations: property <translate> from [none] to [none] at (0.875) should be [none]
Pass Web Animations: property <translate> from [none] to [none] at (1) should be [none]
Pass Web Animations: property <translate> from [none] to [none] at (2) should be [none]
Fail CSS Transitions: property <translate> from [none] to [8px 80% 800px] at (-1) should be [-8px -80% -800px]
Fail CSS Transitions: property <translate> from [none] to [8px 80% 800px] at (0) should be [0px 0%]
Fail CSS Transitions: property <translate> from [none] to [8px 80% 800px] at (0.125) should be [1px 10% 100px]
Fail CSS Transitions: property <translate> from [none] to [8px 80% 800px] at (0.875) should be [7px 70% 700px]
Fail CSS Transitions: property <translate> from [none] to [8px 80% 800px] at (1) should be [8px 80% 800px]
Fail CSS Transitions: property <translate> from [none] to [8px 80% 800px] at (2) should be [16px 160% 1600px]
Fail CSS Transitions with transition: all: property <translate> from [none] to [8px 80% 800px] at (-1) should be [-8px -80% -800px]
Fail CSS Transitions with transition: all: property <translate> from [none] to [8px 80% 800px] at (0) should be [0px 0%]
Fail CSS Transitions with transition: all: property <translate> from [none] to [8px 80% 800px] at (0.125) should be [1px 10% 100px]
Fail CSS Transitions with transition: all: property <translate> from [none] to [8px 80% 800px] at (0.875) should be [7px 70% 700px]
Fail CSS Transitions with transition: all: property <translate> from [none] to [8px 80% 800px] at (1) should be [8px 80% 800px]
Fail CSS Transitions with transition: all: property <translate> from [none] to [8px 80% 800px] at (2) should be [16px 160% 1600px]
Fail CSS Animations: property <translate> from [none] to [8px 80% 800px] at (-1) should be [-8px -80% -800px]
Fail CSS Animations: property <translate> from [none] to [8px 80% 800px] at (0) should be [0px 0%]
Fail CSS Animations: property <translate> from [none] to [8px 80% 800px] at (0.125) should be [1px 10% 100px]
Fail CSS Animations: property <translate> from [none] to [8px 80% 800px] at (0.875) should be [7px 70% 700px]
Fail CSS Animations: property <translate> from [none] to [8px 80% 800px] at (1) should be [8px 80% 800px]
Fail CSS Animations: property <translate> from [none] to [8px 80% 800px] at (2) should be [16px 160% 1600px]
Fail Web Animations: property <translate> from [none] to [8px 80% 800px] at (-1) should be [-8px -80% -800px]
Fail Web Animations: property <translate> from [none] to [8px 80% 800px] at (0) should be [0px 0%]
Fail Web Animations: property <translate> from [none] to [8px 80% 800px] at (0.125) should be [1px 10% 100px]
Fail Web Animations: property <translate> from [none] to [8px 80% 800px] at (0.875) should be [7px 70% 700px]
Fail Web Animations: property <translate> from [none] to [8px 80% 800px] at (1) should be [8px 80% 800px]
Fail Web Animations: property <translate> from [none] to [8px 80% 800px] at (2) should be [16px 160% 1600px]
Pass CSS Transitions: property <translate> from [none] to [8px 80% 800px] at (-1) should be [-8px -80% -800px]
Pass CSS Transitions: property <translate> from [none] to [8px 80% 800px] at (0) should be [0px 0%]
Pass CSS Transitions: property <translate> from [none] to [8px 80% 800px] at (0.125) should be [1px 10% 100px]
Pass CSS Transitions: property <translate> from [none] to [8px 80% 800px] at (0.875) should be [7px 70% 700px]
Pass CSS Transitions: property <translate> from [none] to [8px 80% 800px] at (1) should be [8px 80% 800px]
Pass CSS Transitions: property <translate> from [none] to [8px 80% 800px] at (2) should be [16px 160% 1600px]
Pass CSS Transitions with transition: all: property <translate> from [none] to [8px 80% 800px] at (-1) should be [-8px -80% -800px]
Pass CSS Transitions with transition: all: property <translate> from [none] to [8px 80% 800px] at (0) should be [0px 0%]
Pass CSS Transitions with transition: all: property <translate> from [none] to [8px 80% 800px] at (0.125) should be [1px 10% 100px]
Pass CSS Transitions with transition: all: property <translate> from [none] to [8px 80% 800px] at (0.875) should be [7px 70% 700px]
Pass CSS Transitions with transition: all: property <translate> from [none] to [8px 80% 800px] at (1) should be [8px 80% 800px]
Pass CSS Transitions with transition: all: property <translate> from [none] to [8px 80% 800px] at (2) should be [16px 160% 1600px]
Pass CSS Animations: property <translate> from [none] to [8px 80% 800px] at (-1) should be [-8px -80% -800px]
Pass CSS Animations: property <translate> from [none] to [8px 80% 800px] at (0) should be [0px 0%]
Pass CSS Animations: property <translate> from [none] to [8px 80% 800px] at (0.125) should be [1px 10% 100px]
Pass CSS Animations: property <translate> from [none] to [8px 80% 800px] at (0.875) should be [7px 70% 700px]
Pass CSS Animations: property <translate> from [none] to [8px 80% 800px] at (1) should be [8px 80% 800px]
Pass CSS Animations: property <translate> from [none] to [8px 80% 800px] at (2) should be [16px 160% 1600px]
Pass Web Animations: property <translate> from [none] to [8px 80% 800px] at (-1) should be [-8px -80% -800px]
Pass Web Animations: property <translate> from [none] to [8px 80% 800px] at (0) should be [0px 0%]
Pass Web Animations: property <translate> from [none] to [8px 80% 800px] at (0.125) should be [1px 10% 100px]
Pass Web Animations: property <translate> from [none] to [8px 80% 800px] at (0.875) should be [7px 70% 700px]
Pass Web Animations: property <translate> from [none] to [8px 80% 800px] at (1) should be [8px 80% 800px]
Pass Web Animations: property <translate> from [none] to [8px 80% 800px] at (2) should be [16px 160% 1600px]
Pass CSS Transitions: property <translate> from neutral to [20px] at (-1) should be [0px]
Pass CSS Transitions: property <translate> from neutral to [20px] at (0) should be [10px]
Pass CSS Transitions: property <translate> from neutral to [20px] at (0.25) should be [12.5px]

View file

@ -2,8 +2,7 @@ Harness status: OK
Found 140 tests
136 Pass
4 Fail
140 Pass
Pass CSS Transitions: property <left> from [0px] to [calc(infinity * 1px)] at (-0.25) should be [-8.5070575e+37px]
Pass CSS Transitions: property <left> from [0px] to [calc(infinity * 1px)] at (0) should be [0px]
Pass CSS Transitions: property <left> from [0px] to [calc(infinity * 1px)] at (0.25) should be [8.5070575e+37px]
@ -117,28 +116,28 @@ Pass Web Animations: property <text-indent> from [0em] to [100px] at (0.75) shou
Pass Web Animations: property <text-indent> from [0em] to [100px] at (1) should be [100px]
Pass Web Animations: property <text-indent> from [0em] to [100px] at (1.25) should be [125px]
Pass CSS Transitions: property <text-indent> from [0%] to [100px] at (-0.25) should be [calc(0% + -25px)]
Fail CSS Transitions: property <text-indent> from [0%] to [100px] at (0) should be [0%]
Pass CSS Transitions: property <text-indent> from [0%] to [100px] at (0) should be [0%]
Pass CSS Transitions: property <text-indent> from [0%] to [100px] at (0.25) should be [calc(0% + 25px)]
Pass CSS Transitions: property <text-indent> from [0%] to [100px] at (0.5) should be [calc(0% + 50px)]
Pass CSS Transitions: property <text-indent> from [0%] to [100px] at (0.75) should be [calc(0% + 75px)]
Pass CSS Transitions: property <text-indent> from [0%] to [100px] at (1) should be [calc(0% + 100px)]
Pass CSS Transitions: property <text-indent> from [0%] to [100px] at (1.25) should be [calc(0% + 125px)]
Pass CSS Transitions with transition: all: property <text-indent> from [0%] to [100px] at (-0.25) should be [calc(0% + -25px)]
Fail CSS Transitions with transition: all: property <text-indent> from [0%] to [100px] at (0) should be [0%]
Pass CSS Transitions with transition: all: property <text-indent> from [0%] to [100px] at (0) should be [0%]
Pass CSS Transitions with transition: all: property <text-indent> from [0%] to [100px] at (0.25) should be [calc(0% + 25px)]
Pass CSS Transitions with transition: all: property <text-indent> from [0%] to [100px] at (0.5) should be [calc(0% + 50px)]
Pass CSS Transitions with transition: all: property <text-indent> from [0%] to [100px] at (0.75) should be [calc(0% + 75px)]
Pass CSS Transitions with transition: all: property <text-indent> from [0%] to [100px] at (1) should be [calc(0% + 100px)]
Pass CSS Transitions with transition: all: property <text-indent> from [0%] to [100px] at (1.25) should be [calc(0% + 125px)]
Pass CSS Animations: property <text-indent> from [0%] to [100px] at (-0.25) should be [calc(0% + -25px)]
Fail CSS Animations: property <text-indent> from [0%] to [100px] at (0) should be [0%]
Pass CSS Animations: property <text-indent> from [0%] to [100px] at (0) should be [0%]
Pass CSS Animations: property <text-indent> from [0%] to [100px] at (0.25) should be [calc(0% + 25px)]
Pass CSS Animations: property <text-indent> from [0%] to [100px] at (0.5) should be [calc(0% + 50px)]
Pass CSS Animations: property <text-indent> from [0%] to [100px] at (0.75) should be [calc(0% + 75px)]
Pass CSS Animations: property <text-indent> from [0%] to [100px] at (1) should be [calc(0% + 100px)]
Pass CSS Animations: property <text-indent> from [0%] to [100px] at (1.25) should be [calc(0% + 125px)]
Pass Web Animations: property <text-indent> from [0%] to [100px] at (-0.25) should be [calc(0% + -25px)]
Fail Web Animations: property <text-indent> from [0%] to [100px] at (0) should be [0%]
Pass Web Animations: property <text-indent> from [0%] to [100px] at (0) should be [0%]
Pass Web Animations: property <text-indent> from [0%] to [100px] at (0.25) should be [calc(0% + 25px)]
Pass Web Animations: property <text-indent> from [0%] to [100px] at (0.5) should be [calc(0% + 50px)]
Pass Web Animations: property <text-indent> from [0%] to [100px] at (0.75) should be [calc(0% + 75px)]