| Index: third_party/WebKit/LayoutTests/transitions/unprefixed-transform.html
|
| diff --git a/third_party/WebKit/LayoutTests/transitions/unprefixed-transform.html b/third_party/WebKit/LayoutTests/transitions/unprefixed-transform.html
|
| index f7eb93bff9f6c3a49733238aa0875abd2aad2869..b2817f7060c09aa85c95034fca2d736fa426894c 100644
|
| --- a/third_party/WebKit/LayoutTests/transitions/unprefixed-transform.html
|
| +++ b/third_party/WebKit/LayoutTests/transitions/unprefixed-transform.html
|
| @@ -1,36 +1,50 @@
|
| <!DOCTYPE html>
|
| -<div class="target">-webkit-transform 10ms</div><br>
|
| -<div class="target">transform 10ms</div><br>
|
| -<div class="target">transform 10ms, -webkit-transform 10ms</div><br>
|
| -<div class="target">-webkit-transform 10ms, transform 10ms</div><br>
|
| -<div class="target">all 10ms</div><br>
|
| -<div class="target">all 10ms, -webkit-transform 10ms</div><br>
|
| -<div class="target">-webkit-transform 10ms, all 10ms</div>
|
| +<meta charset="utf-8">
|
| +<script src="../resources/testharness.js"></script>
|
| +<script src="../resources/testharnessreport.js"></script>
|
| +<div id="container"></div>
|
| <script>
|
| -if (window.testRunner) {
|
| - testRunner.dumpAsText();
|
| - testRunner.waitUntilDone();
|
| -}
|
| +'use strict';
|
|
|
| -document.addEventListener('transitionend', function(e) {
|
| - var result = document.createElement('div');
|
| - result.textContent = 'fired transitionend with propertyName: ' + e.propertyName;
|
| - e.target.appendChild(result);
|
| - if (window.testRunner) {
|
| - // All events should be fired by next frame.
|
| - requestAnimationFrame(function() {
|
| - testRunner.notifyDone();
|
| +var transitionValues = [
|
| + '-webkit-transform 10ms',
|
| + 'transform 10ms',
|
| + 'transform 10ms, -webkit-transform 10ms',
|
| + '-webkit-transform 10ms, transform 10ms',
|
| + 'all 10ms',
|
| + 'all 10ms, -webkit-transform 10ms',
|
| + '-webkit-transform 10ms, all 10ms'
|
| +];
|
| +
|
| +async_test(t => {
|
| + var remaining = transitionValues.length;
|
| + for (let i = 0; i < transitionValues.length; i++) {
|
| + const element = document.createElement('div');
|
| + container.appendChild(element);
|
| +
|
| + element.addEventListener('transitionend', e => {
|
| + t.step(() => {
|
| + assert_equals(e.target, element);
|
| + assert_equals(e.type, 'transitionend');
|
| + assert_equals(e.propertyName, 'transform');
|
| + assert_greater_than(remaining, 0);
|
| +
|
| + remaining -= 1;
|
| + if (!remaining) {
|
| + // Delay provides opportunity to detect excess events.
|
| + setTimeout(() => {
|
| + t.done();
|
| + }, 50);
|
| + }
|
| + });
|
| });
|
| - }
|
| -});
|
|
|
| -onload = function() {
|
| - var targets = document.querySelectorAll('.target');
|
| - for (var i = 0; i < targets.length; i++) {
|
| - targets[i].offsetTop;
|
| - targets[i].style.transition = targets[i].textContent;
|
| - targets[i].style.webkitTransform = 'rotate(360deg)';
|
| - targets[i].style.transform = 'rotate(360deg)';
|
| + requestAnimationFrame(() => {
|
| + element.offsetTop;
|
| + element.style.transition = transitionValues[i];
|
| + element.style.webkitTransform = 'rotate(360deg)';
|
| + element.style.transform = 'rotate(360deg)';
|
| + });
|
| }
|
| -};
|
| +}, 'Transition on the prefixed and/or unprefixed transform property causes a single transitionend event for the unprefixed transform property.');
|
| </script>
|
|
|
Chromium Code Reviews
Issue 2578143003:
CSS Transitions: Fix flaky test unprefixed-transform.html (Closed)
