From 6ac52c92680d02dcd76c006bf2cf7e613f54fbf2 Mon Sep 17 00:00:00 2001 From: Joey Arhar Date: Wed, 28 Feb 2024 05:01:41 +0000 Subject: [PATCH] Bug 1881331 [wpt PR 44713] - Reapply "Add allow-discrete to non-interpolable WPTs", a=testonly Automatic update from web-platform-tests Reapply "Add allow-discrete to non-interpolable WPTs" This patch changes the test runner for animation tests in WPT to additionally test transition-behavior:allow-discrete for any property that we are running a non-interpolable or non-animatable test on. Original patch: https://chromium-review.googlesource.com/c/chromium/src/+/4989757 Revert: https://chromium-review.googlesource.com/c/chromium/src/+/5038074 Now that interop2023 has been frozen and interop2024 has started with support for allow-discrete, we can reapply these WPT changes. https://github.com/web-platform-tests/interop/issues/580 https://github.com/web-platform-tests/wpt.fyi/issues/3639 Change-Id: Ic5397d2be86e540e82a6f73746d8450f9832e790 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5314252 Commit-Queue: David Baron Reviewed-by: David Baron Auto-Submit: Joey Arhar Cr-Commit-Position: refs/heads/main@{#1264380} -- wpt-commits: b4d3a4ecdd4dbbc8ed1fe3993ba1f510075c6247 wpt-pr: 44713 --- .../css/support/interpolation-testcommon.js | 63 ++++++++++++++++++- 1 file changed, 61 insertions(+), 2 deletions(-) diff --git a/testing/web-platform/tests/css/support/interpolation-testcommon.js b/testing/web-platform/tests/css/support/interpolation-testcommon.js index 115067465feed..211018ca053ad 100644 --- a/testing/web-platform/tests/css/support/interpolation-testcommon.js +++ b/testing/web-platform/tests/css/support/interpolation-testcommon.js @@ -104,6 +104,59 @@ }, }; + var cssTransitionsInterpolationAllowDiscrete = { + name: 'CSS Transitions with transition-behavior:allow-discrete', + isSupported: function() {return true;}, + supportsProperty: function() {return true;}, + supportsValue: function() {return true;}, + setup: function(property, from, target) { + target.style.setProperty(property, isNeutralKeyframe(from) ? '' : from); + }, + nonInterpolationExpectations: function(from, to) { + return expectFlip(from, to, 0.5); + }, + notAnimatableExpectations: function(from, to, underlying) { + return expectFlip(from, to, -Infinity); + }, + interpolate: function(property, from, to, at, target, behavior) { + // Force a style recalc on target to set the 'from' value. + getComputedStyle(target).getPropertyValue(property); + target.style.transitionDuration = '100s'; + target.style.transitionDelay = '-50s'; + target.style.transitionTimingFunction = createEasing(at); + target.style.transitionProperty = property; + target.style.transitionBehavior = 'allow-discrete'; + target.style.setProperty(property, isNeutralKeyframe(to) ? '' : to); + }, + }; + + var cssTransitionAllInterpolationAllowDiscrete = { + name: 'CSS Transitions with transition-property:all and transition-behavor:allow-discrete', + isSupported: function() {return true;}, + // The 'all' value doesn't cover custom properties. + supportsProperty: function(property) {return property.indexOf('--') !== 0;}, + supportsValue: function() {return true;}, + setup: function(property, from, target) { + target.style.setProperty(property, isNeutralKeyframe(from) ? '' : from); + }, + nonInterpolationExpectations: function(from, to) { + return expectFlip(from, to, 0.5); + }, + notAnimatableExpectations: function(from, to, underlying) { + return expectFlip(from, to, -Infinity); + }, + interpolate: function(property, from, to, at, target, behavior) { + // Force a style recalc on target to set the 'from' value. + getComputedStyle(target).getPropertyValue(property); + target.style.transitionDuration = '100s'; + target.style.transitionDelay = '-50s'; + target.style.transitionTimingFunction = createEasing(at); + target.style.transitionProperty = 'all'; + target.style.transitionBehavior = 'allow-discrete'; + target.style.setProperty(property, isNeutralKeyframe(to) ? '' : to); + }, + }; + var webAnimationsInterpolation = { name: 'Web Animations', isSupported: function() {return 'animate' in Element.prototype;}, @@ -435,13 +488,19 @@ function test_not_animatable(options) { test_interpolation(options, expectNotAnimatable); } - function create_tests() { + function create_tests(addAllowDiscreteTests) { var interpolationMethods = [ cssTransitionsInterpolation, cssTransitionAllInterpolation, cssAnimationsInterpolation, webAnimationsInterpolation, ]; + if (addAllowDiscreteTests) { + interpolationMethods = [ + cssTransitionsInterpolationAllowDiscrete, + cssTransitionAllInterpolationAllowDiscrete, + ].concat(interpolationMethods); + } var container = createElement(document.body); var targets = createTestTargets(interpolationMethods, interpolationTests, compositionTests, container); // Separate interpolation and measurement into different phases to avoid O(n^2) of the number of targets. @@ -456,7 +515,7 @@ function test_interpolation(options, expectations) { interpolationTests.push({options, expectations}); - create_tests(); + create_tests(expectations === expectNoInterpolation || expectations === expectNotAnimatable); interpolationTests = []; } function test_composition(options, expectations) {