Changeset 260513 in webkit


Ignore:
Timestamp:
Apr 22, 2020 9:21:37 AM (4 years ago)
Author:
graouts@webkit.org
Message:

[ Mojave wk1 Release ] animations/transition-and-animation-1.html is a flaky failure
​https://bugs.webkit.org/show_bug.cgi?id=210051
<rdar://problem/61345177>

Reviewed by Simon Fraser.

The purpose of this test is to check that running an animation does not trigger a transition for the animated
property. The way this test was written is that it would use setTimeout() to set a timer at a time computed to
be 500ms after the completion of the animation. However, using a timer like this is flaky by design as the animation
could technically be still in flight if the system is under heavy load.

We rewrite this test to use an "animationend" event to determine the animation has really completed and then wait
another frame, using requestAnimationFrame() to check that the computed style is as expected.

  • animations/transition-and-animation-1.html:
  • resources/ui-helper.js:

(window.UIHelper.waitForEvent):

Location:
trunk/LayoutTests
Files:
3 edited

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/ChangeLog

    r260509 r260513  
     12020-04-22  Antoine Quint  <graouts@apple.com>
     2
     3        [ Mojave wk1 Release ] animations/transition-and-animation-1.html is a flaky failure
     4        https://bugs.webkit.org/show_bug.cgi?id=210051
     5        <rdar://problem/61345177>
     6
     7        Reviewed by Simon Fraser.
     8
     9        The purpose of this test is to check that running an animation does not trigger a transition for the animated
     10        property. The way this test was written is that it would use `setTimeout()` to set a timer at a time computed to
     11        be 500ms after the completion of the animation. However, using a timer like this is flaky by design as the animation
     12        could technically be still in flight if the system is under heavy load.
     13
     14        We rewrite this test to use an "animationend" event to determine the animation has really completed and then wait
     15        another frame, using `requestAnimationFrame()` to check that the computed style is as expected.
     16
     17        * animations/transition-and-animation-1.html:
     18        * resources/ui-helper.js:
     19        (window.UIHelper.waitForEvent):
     20
    1212020-04-22  Jason Lawrence  <lawrence.j@apple.com>
    222

  • trunk/LayoutTests/animations/transition-and-animation-1.html

    r236541 r260513  
    1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
     1<!DOCTYPE html>
    22
    33<html lang="en">
    … …  
    1313        width: 100px;
    1414        background-color: blue;
    15         -webkit-animation-duration: 0.5s;
    16         -webkit-animation-timing-function: linear;
    17         -webkit-animation-name: "anim";
    18         -webkit-transition-property: -webkit-transform;
    19         -webkit-transition-duration: 10s;
     15        animation-duration: 0.5s;
     16        animation-timing-function: linear;
     17        animation-name: "anim";
     18        transition-property: transform;
     19        transition-duration: 10s;
    2020    }
    2121    @-webkit-keyframes "anim" {
    22         from { -webkit-transform: translateX(200px); }
    23         to   { -webkit-transform: translateX(300px); }
     22        from { transform: translateX(200px); }
     23        to   { transform: translateX(300px); }
    2424    }
    2525    </style>
    26     <script src="resources/animation-test-helpers.js" type="text/javascript" charset="utf-8"></script>
    27     <script type="text/javascript" charset="utf-8">
    28    
     26    <script src="../resources/ui-helper.js"></script>
     27    <script src="resources/animation-test-helpers.js"></script>
     28    <script type="text/javascript">
     29
     30    if (window.testRunner)
     31        testRunner.dumpAsText();
     32
    2933    const expectedValues = [
    3034      // [animation-name, time, element-id, property, expected-value, tolerance]
    31       [null, 0.55, "box", "webkitTransform", "none", null],
     35      [null, 0.55, "box", "transform", "none", null],
    3236    ];
    33    
    34     runAnimationTest(expectedValues);
    35    
    36   </script>
     37
     38    window.addEventListener("DOMContentLoaded", async event => {
     39        await UIHelper.waitForEvent(document.getElementById("box"), "animationend");
     40        await UIHelper.animationFrame();
     41        checkExpectedValue(expectedValues, 0);
     42        endTest();
     43    });
     44
     45    </script>
    3746</head>
    3847<body>

  • trunk/LayoutTests/resources/ui-helper.js

    r260402 r260513  
    10411041        if (menuRect)
    10421042            await this.activateAt(menuRect.left + menuRect.width / 2, menuRect.top + menuRect.height / 2);
     1043    }
     1044
     1045    static waitForEvent(target, eventName)
     1046    {
     1047        return new Promise(resolve => target.addEventListener(eventName, resolve, { once: true }));
    10431048    }
    10441049
Note: See TracChangeset for help on using the changeset viewer.