Commit 329c91e5 authored by Edvard Thörnros's avatar Edvard Thörnros Committed by Commit Bot

Attempt to make test more stable

The animation test "correct-events-for-short-animations-with-syncbases.html"
used to be flaky. This is an attempt to fix it and also convert it to a
web platform tests.

Verified to run in FF and Chromium.

Colors were also changed reflect their usage.

Bug: 981522
Change-Id: Ieead9ca1c5ccf050ac2e886ecf630d9a9f61b6e4
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1732097
Auto-Submit: Edvard Thörnros <edvardt@opera.com>
Commit-Queue: Stephen Chenney <schenney@chromium.org>
Reviewed-by: default avatarStephen Chenney <schenney@chromium.org>
Cr-Commit-Position: refs/heads/master@{#683542}
parent 73783711
<!DOCTYPE html> <!DOCTYPE html>
<title>Correct events for short animations with syncbases</title> <title>Correct events for short animations with syncbases</title>
<script src="../../resources/testharness.js"></script> <script src="/resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script> <script src="/resources/testharnessreport.js"></script>
<link rel="author" title="Edvard Thörnros" href="mailto:edvardt@opera.com">
<link rel="help" href="https://svgwg.org/specs/animations/#TimingAttributes">
<svg viewBox="0 0 250 50" xmlns="http://www.w3.org/2000/svg"> <svg viewBox="0 0 250 50" xmlns="http://www.w3.org/2000/svg">
<g id="a" opacity="0"> <g id="a" opacity="0">
<animate attributeName="opacity" from="0" to="1" begin="0ms;last.end+10ms" dur="10ms" fill="freeze" <animate attributeName="opacity" from="0" to="1" begin="0ms;last.end+100ms" dur="10ms" fill="freeze"
id="first"/> id="first"/>
<animate attributeName="opacity" from="1" to="0" begin="last.end" dur="1ms" fill="freeze"/> <animate attributeName="opacity" from="1" to="0" begin="last.end" dur="10ms" fill="freeze"/>
<rect x="0" y="0" width="50" height="50" fill="#0F0"/> <rect x="0" y="0" width="50" height="50" fill="#AA0"/>
</g> </g>
<g id="b" opacity="0"> <g id="b" opacity="0">
<animate attributeName="opacity" from="1" to="1" begin="first.end+10ms" dur="1ms" fill="freeze"/> <animate attributeName="opacity" from="1" to="1" begin="first.end+10ms" dur="10ms" fill="freeze"
<animate attributeName="opacity" from="1" to="0" begin="last.end" dur="1ms" fill="freeze"/>
<rect x="50" y="0" width="50" height="50" fill="#F00"/>
</g>
<g id="c" opacity="0">
<animate attributeName="opacity" from="1" to="1" begin="first.end+20ms" dur="1ms" fill="freeze"/>
<animate attributeName="opacity" from="1" to="0" begin="last.end" dur="1ms" fill="freeze"/>
<rect x="100" y="0" width="50" height="50" fill="#F00"/>
</g>
<g id="d" opacity="0">
<animate attributeName="opacity" from="1" to="1" begin="first.end+30ms" dur="1ms" fill="freeze"/>
<animate attributeName="opacity" from="1" to="0" begin="last.end" dur="1ms" fill="freeze"/>
<rect x="150" y="0" width="50" height="50" fill="#F00"/>
</g>
<g id="e" opacity="0">
<animate attributeName="opacity" from="1" to="1" begin="first.end+40ms" dur="1ms" fill="freeze"
id="last" onend="onend_filling()"/> id="last" onend="onend_filling()"/>
<animate attributeName="opacity" from="1" to="0" begin="last.end" dur="1ms" fill="freeze" <animate attributeName="opacity" from="1" to="0" begin="last.end+1ms" dur="10ms" fill="freeze"
onbegin="onend_clearing()"/> onbegin="onend_clearing()"/>
<rect x="200" y="0" width="50" height="50" fill="#F00"/> <rect x="50" y="0" width="50" height="50" fill="#AA0"/>
</g> </g>
</svg> </svg>
<script> <script>
...@@ -42,27 +29,22 @@ ...@@ -42,27 +29,22 @@
let svg = document.querySelector("svg"); let svg = document.querySelector("svg");
// Deliberate no a // Deliberate no a
let b = document.querySelector("#b"); let b = document.querySelector("#b");
let c = document.querySelector("#c");
let d = document.querySelector("#d");
let e = document.querySelector("#e");
let passed = false; let passed = false;
let triggers = 0; let triggers = 0;
let filling_steps = 0; let filling_steps = 0;
let runs = 3; // Issue 379751 broke after 2 cycles, hence this is a 3.
onend_filling = t.step_func(() => { onend_filling = t.step_func(() => {
filling_steps++; filling_steps++;
if (filling_steps < 5) return; if (filling_steps < (runs + 1)) return;
svg.pauseAnimations(); svg.pauseAnimations();
assert_unreached("Fired too many onend events."); assert_unreached("Fired too many onend events.");
}); });
onend_clearing = t.step_func(() => { onend_clearing = t.step_func(() => {
triggers++; triggers++;
if (triggers != 3) return; if (triggers != runs) return;
svg.pauseAnimations(); svg.pauseAnimations();
// We don't check the first element, since it might have started fading in // We don't check the first element, since it might have started fading in
assert_equals(window.getComputedStyle(b, null).opacity, "0"); assert_not_equals(window.getComputedStyle(b, null).opacity, "1");
assert_equals(window.getComputedStyle(c, null).opacity, "0");
assert_equals(window.getComputedStyle(d, null).opacity, "0");
assert_equals(window.getComputedStyle(e, null).opacity, "0");
t.done(); t.done();
}); });
}); });
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment