diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 19:33:14 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 19:33:14 +0000 |
| commit | 36d22d82aa202bb199967e9512281e9a53db42c9 (patch) | |
| tree | 105e8c98ddea1c1e4784a60a5a6410fa416be2de /layout/style/test/test_transitions_replacement_with_setKeyframes.html | |
| parent | Initial commit. (diff) | |
| download | firefox-esr-upstream.tar.xz firefox-esr-upstream.zip | |
Adding upstream version 115.7.0esr.upstream/115.7.0esrupstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'layout/style/test/test_transitions_replacement_with_setKeyframes.html')
| -rw-r--r-- | layout/style/test/test_transitions_replacement_with_setKeyframes.html | 88 |
1 files changed, 88 insertions, 0 deletions
diff --git a/layout/style/test/test_transitions_replacement_with_setKeyframes.html b/layout/style/test/test_transitions_replacement_with_setKeyframes.html new file mode 100644 index 0000000000..85e9e40127 --- /dev/null +++ b/layout/style/test/test_transitions_replacement_with_setKeyframes.html @@ -0,0 +1,88 @@ +<!doctype html> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1292001 +--> +<head> + <meta charset=utf-8> + <title>Test for bug 1292001</title> + <script src="/tests/SimpleTest/SimpleTest.js"></script> + <script src="/tests/SimpleTest/paint_listener.js"></script> + <script src="animation_utils.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"> + <style> + #target { + height: 100px; + width: 100px; + background: green; + transition: transform 100s linear; + } + </style> +</head> +<body> +<div id="target"></div> +<script> +'use strict'; + +SimpleTest.waitForExplicitFinish(); + +const OMTAPrefKey = 'layers.offmainthreadcomposition.async-animations'; +const omtaEnabled = + SpecialPowers.DOMWindowUtils.layerManagerRemote && + SpecialPowers.getBoolPref(OMTAPrefKey); + +window.addEventListener('load', async function() { + if (!omtaEnabled) { + ok(true, 'Skipping the test since OMTA is disabled'); + SimpleTest.finish(); + return; + } + + const div = document.getElementById('target'); + + // Start first transition + div.style.transform = 'translateX(300px)'; + const firstTransition = div.getAnimations()[0]; + + // But then change its keyframes to something completely different. + firstTransition.effect.setKeyframes({ 'opacity': ['0', '1'] }); + + // Wait for the transition to start running on the main thread and + // compositor. + await firstTransition.ready; + await waitForPaints(); + await new Promise(resolve => requestAnimationFrame(resolve)); + + // Start second transition + div.style.transform = 'translateX(600px)'; + const secondTransition = div.getAnimations()[0]; + + const previousKeyframeValue = secondTransition.effect.getKeyframes()[0] + .transform; + + // Tie up main thread for 300ms. In the meantime, the first transition + // will continue running on the compositor. If we don't update the start + // point of the second transition, it will appear to jump when it starts. + const startTime = performance.now(); + while (performance.now() - startTime < 300); + + // Ensure that our paint process has been done. + // + // (See explanation in test_transitions_replacement_on_busy_frame.html for + // why we don't use requestAnimationFrame here.) + await waitForPaints(); + + // Now check that the keyframes are NOT updated. + is( + secondTransition.effect.getKeyframes()[0].transform, + previousKeyframeValue, + 'Keyframe value of transition is NOT updated since the moment when ' + + 'it was generated' + ); + + SimpleTest.finish(); +}); + +</script> +</body> +</html> |