зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1447599: Make duration of animations to be longer. r=pbro
MozReview-Commit-ID: BYlUcuKseoH --HG-- extra : rebase_source : 3d0508fbc367f33e20925010d2826fd1295fbd6d
This commit is contained in:
Daisuke Akatsuka
Родитель
0bad8b1acc
Коммит
9a8aed2d91
|
|
@ -10,7 +10,7 @@
|
|||
// * mouse drag on the scrubber
|
||||
|
||||
add_task(async function() {
|
||||
await addTab(URL_ROOT + "doc_multi_timings.html");
|
||||
await addTab(URL_ROOT + "doc_simple_animation.html");
|
||||
const { animationInspector, inspector, panel } = await openAnimationInspector();
|
||||
|
||||
info("Checking scrubber controller existence");
|
||||
|
|
@ -22,7 +22,7 @@ add_task(async function() {
|
|||
ok(scrubberEl, "scrubber should exist");
|
||||
|
||||
info("Checking scrubber changes current time of animation and the position");
|
||||
await selectNodeAndWaitForAnimations(".enddelay-with-iterations-infinity", inspector);
|
||||
await selectNodeAndWaitForAnimations(".long", inspector);
|
||||
const duration = animationInspector.state.timeScale.getDuration();
|
||||
await clickOnCurrentTimeScrubberController(animationInspector, panel, 0);
|
||||
assertAnimationsCurrentTime(animationInspector, 0);
|
||||
|
|
|
|||
|
|
@ -9,6 +9,8 @@ http://creativecommons.org/publicdomain/zero/1.0/ */
|
|||
// * progress bar position after changing playback rate
|
||||
// * progress bar position when select another animation
|
||||
|
||||
requestLongerTimeout(5);
|
||||
|
||||
const POSITION_TESTCASES = [
|
||||
{
|
||||
targetClassName: "cssanimation-linear",
|
||||
|
|
@ -57,7 +59,6 @@ add_task(async function() {
|
|||
const { animationInspector, inspector, panel } = await openAnimationInspector();
|
||||
|
||||
info("Checking progress bar position in multi effect timings");
|
||||
await clickOnPauseResumeButton(animationInspector, panel);
|
||||
|
||||
for (const testcase of POSITION_TESTCASES) {
|
||||
info(`Checking progress bar position for ${ testcase.targetClassName }`);
|
||||
|
|
|
|||
|
|
@ -11,11 +11,11 @@
|
|||
// but iteration count is infinity
|
||||
|
||||
add_task(async function() {
|
||||
await addTab(URL_ROOT + "doc_multi_timings.html");
|
||||
await addTab(URL_ROOT + "doc_simple_animation.html");
|
||||
const { animationInspector, inspector, panel } = await openAnimationInspector();
|
||||
|
||||
info("Checking state after end of animation duration");
|
||||
await selectNodeAndWaitForAnimations(".easing-step", inspector);
|
||||
await selectNodeAndWaitForAnimations(".long", inspector);
|
||||
const pixelsData = getDurationAndRate(animationInspector, panel, 5);
|
||||
await clickOnCurrentTimeScrubberController(animationInspector,
|
||||
panel, 1 - pixelsData.rate);
|
||||
|
|
@ -26,7 +26,7 @@ add_task(async function() {
|
|||
|
||||
info("Checking state after end of animation duration and infinity iterations");
|
||||
await clickOnPauseResumeButton(animationInspector, panel);
|
||||
await selectNodeAndWaitForAnimations(".enddelay-with-iterations-infinity", inspector);
|
||||
await selectNodeAndWaitForAnimations(".compositor-all", inspector);
|
||||
await clickOnCurrentTimeScrubberController(animationInspector, panel, 1);
|
||||
await clickOnPauseResumeButton(animationInspector, panel);
|
||||
await assertStates(animationInspector, panel, true);
|
||||
|
|
|
|||
|
|
@ -16,11 +16,11 @@ const TEST_CASES = [
|
|||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 25000, y: 40.851 },
|
||||
{ x: 50000, y: 80.24},
|
||||
{ x: 75000, y: 96.05 },
|
||||
{ x: 100000, y: 100 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 250000, y: 40.851 },
|
||||
{ x: 500000, y: 80.24},
|
||||
{ x: 750000, y: 96.05 },
|
||||
{ x: 1000000, y: 100 },
|
||||
{ x: 1000000, y: 0 },
|
||||
]
|
||||
],
|
||||
},
|
||||
|
|
@ -29,11 +29,11 @@ const TEST_CASES = [
|
|||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 25000, y: 25 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 75000, y: 75 },
|
||||
{ x: 100000, y: 100 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 250000, y: 25 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 750000, y: 75 },
|
||||
{ x: 1000000, y: 100 },
|
||||
{ x: 1000000, y: 0 },
|
||||
]
|
||||
],
|
||||
},
|
||||
|
|
@ -41,16 +41,16 @@ const TEST_CASES = [
|
|||
targetClassName: "delay-positive",
|
||||
expectedDelayPath: [
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 50000, y: 0 },
|
||||
{ x: 500000, y: 0 },
|
||||
],
|
||||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 50000, y: 0 },
|
||||
{ x: 75000, y: 25 },
|
||||
{ x: 100000, y: 50 },
|
||||
{ x: 125000, y: 75 },
|
||||
{ x: 150000, y: 100 },
|
||||
{ x: 150000, y: 0 },
|
||||
{ x: 500000, y: 0 },
|
||||
{ x: 750000, y: 25 },
|
||||
{ x: 1000000, y: 50 },
|
||||
{ x: 1250000, y: 75 },
|
||||
{ x: 1500000, y: 100 },
|
||||
{ x: 1500000, y: 0 },
|
||||
]
|
||||
],
|
||||
},
|
||||
|
|
@ -60,9 +60,9 @@ const TEST_CASES = [
|
|||
[
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 0, y: 50 },
|
||||
{ x: 25000, y: 75 },
|
||||
{ x: 50000, y: 100 },
|
||||
{ x: 50000, y: 0 },
|
||||
{ x: 250000, y: 75 },
|
||||
{ x: 500000, y: 100 },
|
||||
{ x: 500000, y: 0 },
|
||||
]
|
||||
],
|
||||
},
|
||||
|
|
@ -71,10 +71,10 @@ const TEST_CASES = [
|
|||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 49999, y: 0 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 99999, y: 50 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 499999, y: 0 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 999999, y: 50 },
|
||||
{ x: 1000000, y: 0 },
|
||||
]
|
||||
],
|
||||
},
|
||||
|
|
@ -83,16 +83,16 @@ const TEST_CASES = [
|
|||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 25000, y: 25 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 75000, y: 75 },
|
||||
{ x: 100000, y: 100 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 250000, y: 25 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 750000, y: 75 },
|
||||
{ x: 1000000, y: 100 },
|
||||
{ x: 1000000, y: 0 },
|
||||
]
|
||||
],
|
||||
expectedEndDelayPath: [
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 150000, y: 0 },
|
||||
{ x: 1000000, y: 0 },
|
||||
{ x: 1500000, y: 0 },
|
||||
],
|
||||
},
|
||||
{
|
||||
|
|
@ -100,9 +100,9 @@ const TEST_CASES = [
|
|||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 25000, y: 25 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 50000, y: 0 },
|
||||
{ x: 250000, y: 25 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 500000, y: 0 },
|
||||
]
|
||||
],
|
||||
},
|
||||
|
|
@ -111,24 +111,24 @@ const TEST_CASES = [
|
|||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 25000, y: 25 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 75000, y: 75 },
|
||||
{ x: 100000, y: 100 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 250000, y: 25 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 750000, y: 75 },
|
||||
{ x: 1000000, y: 100 },
|
||||
{ x: 1000000, y: 0 },
|
||||
]
|
||||
],
|
||||
expectedEndDelayPath: [
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 100000, y: 100 },
|
||||
{ x: 150000, y: 100 },
|
||||
{ x: 150000, y: 0 },
|
||||
{ x: 1000000, y: 0 },
|
||||
{ x: 1000000, y: 100 },
|
||||
{ x: 1500000, y: 100 },
|
||||
{ x: 1500000, y: 0 },
|
||||
],
|
||||
expectedForwardsPath: [
|
||||
{ x: 150000, y: 0 },
|
||||
{ x: 150000, y: 100 },
|
||||
{ x: 200000, y: 100 },
|
||||
{ x: 200000, y: 0 },
|
||||
{ x: 1500000, y: 0 },
|
||||
{ x: 1500000, y: 100 },
|
||||
{ x: 2000000, y: 100 },
|
||||
{ x: 2000000, y: 0 },
|
||||
],
|
||||
},
|
||||
{
|
||||
|
|
@ -136,19 +136,19 @@ const TEST_CASES = [
|
|||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 25000, y: 25 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 75000, y: 75 },
|
||||
{ x: 100000, y: 100 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 250000, y: 25 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 750000, y: 75 },
|
||||
{ x: 1000000, y: 100 },
|
||||
{ x: 1000000, y: 0 },
|
||||
],
|
||||
[
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 125000, y: 25 },
|
||||
{ x: 150000, y: 50 },
|
||||
{ x: 175000, y: 75 },
|
||||
{ x: 200000, y: 100 },
|
||||
{ x: 200000, y: 0 },
|
||||
{ x: 1000000, y: 0 },
|
||||
{ x: 1250000, y: 25 },
|
||||
{ x: 1500000, y: 50 },
|
||||
{ x: 1750000, y: 75 },
|
||||
{ x: 2000000, y: 100 },
|
||||
{ x: 2000000, y: 0 },
|
||||
]
|
||||
],
|
||||
isInfinity: true,
|
||||
|
|
@ -158,19 +158,19 @@ const TEST_CASES = [
|
|||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 25000, y: 25 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 75000, y: 75 },
|
||||
{ x: 100000, y: 100 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 250000, y: 25 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 750000, y: 75 },
|
||||
{ x: 1000000, y: 100 },
|
||||
{ x: 1000000, y: 0 },
|
||||
],
|
||||
[
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 100000, y: 100 },
|
||||
{ x: 125000, y: 75 },
|
||||
{ x: 150000, y: 50 },
|
||||
{ x: 175000, y: 25 },
|
||||
{ x: 200000, y: 0 },
|
||||
{ x: 1000000, y: 0 },
|
||||
{ x: 1000000, y: 100 },
|
||||
{ x: 1250000, y: 75 },
|
||||
{ x: 1500000, y: 50 },
|
||||
{ x: 1750000, y: 25 },
|
||||
{ x: 2000000, y: 0 },
|
||||
]
|
||||
],
|
||||
isInfinity: true,
|
||||
|
|
@ -181,18 +181,18 @@ const TEST_CASES = [
|
|||
[
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 0, y: 100 },
|
||||
{ x: 25000, y: 75 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 75000, y: 25 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 250000, y: 75 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 750000, y: 25 },
|
||||
{ x: 1000000, y: 0 },
|
||||
],
|
||||
[
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 125000, y: 25 },
|
||||
{ x: 150000, y: 50 },
|
||||
{ x: 175000, y: 75 },
|
||||
{ x: 200000, y: 100 },
|
||||
{ x: 200000, y: 0 },
|
||||
{ x: 1000000, y: 0 },
|
||||
{ x: 1250000, y: 25 },
|
||||
{ x: 1500000, y: 50 },
|
||||
{ x: 1750000, y: 75 },
|
||||
{ x: 2000000, y: 100 },
|
||||
{ x: 2000000, y: 0 },
|
||||
]
|
||||
],
|
||||
isInfinity: true,
|
||||
|
|
@ -203,18 +203,18 @@ const TEST_CASES = [
|
|||
[
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 0, y: 100 },
|
||||
{ x: 25000, y: 75 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 75000, y: 25 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 250000, y: 75 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 750000, y: 25 },
|
||||
{ x: 1000000, y: 0 },
|
||||
],
|
||||
[
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 100000, y: 100 },
|
||||
{ x: 125000, y: 75 },
|
||||
{ x: 150000, y: 50 },
|
||||
{ x: 175000, y: 25 },
|
||||
{ x: 200000, y: 0 },
|
||||
{ x: 1000000, y: 0 },
|
||||
{ x: 1000000, y: 100 },
|
||||
{ x: 1250000, y: 75 },
|
||||
{ x: 1500000, y: 50 },
|
||||
{ x: 1750000, y: 25 },
|
||||
{ x: 2000000, y: 0 },
|
||||
]
|
||||
],
|
||||
isInfinity: true,
|
||||
|
|
@ -224,11 +224,11 @@ const TEST_CASES = [
|
|||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 25000, y: 25 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 75000, y: 75 },
|
||||
{ x: 100000, y: 100 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 250000, y: 25 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 750000, y: 75 },
|
||||
{ x: 1000000, y: 100 },
|
||||
{ x: 1000000, y: 0 },
|
||||
]
|
||||
],
|
||||
},
|
||||
|
|
@ -237,21 +237,21 @@ const TEST_CASES = [
|
|||
expectedDelayPath: [
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 0, y: 50 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 50000, y: 0 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 500000, y: 0 },
|
||||
],
|
||||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 75000, y: 75 },
|
||||
{ x: 100000, y: 100 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 750000, y: 75 },
|
||||
{ x: 1000000, y: 100 },
|
||||
{ x: 1000000, y: 0 },
|
||||
],
|
||||
[
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 125000, y: 25 },
|
||||
{ x: 150000, y: 50 },
|
||||
{ x: 150000, y: 0 },
|
||||
{ x: 1000000, y: 0 },
|
||||
{ x: 1250000, y: 25 },
|
||||
{ x: 1500000, y: 50 },
|
||||
{ x: 1500000, y: 0 },
|
||||
]
|
||||
],
|
||||
},
|
||||
|
|
@ -260,18 +260,18 @@ const TEST_CASES = [
|
|||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 25000, y: 25 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 75000, y: 75 },
|
||||
{ x: 100000, y: 100 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 250000, y: 25 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 750000, y: 75 },
|
||||
{ x: 1000000, y: 100 },
|
||||
{ x: 1000000, y: 0 },
|
||||
]
|
||||
],
|
||||
expectedForwardsPath: [
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 100000, y: 100 },
|
||||
{ x: 200000, y: 100 },
|
||||
{ x: 200000, y: 0 },
|
||||
{ x: 1000000, y: 0 },
|
||||
{ x: 1000000, y: 100 },
|
||||
{ x: 2000000, y: 100 },
|
||||
{ x: 2000000, y: 0 },
|
||||
],
|
||||
},
|
||||
{
|
||||
|
|
@ -279,26 +279,26 @@ const TEST_CASES = [
|
|||
expectedDelayPath: [
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 0, y: 50 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 50000, y: 0 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 500000, y: 0 },
|
||||
],
|
||||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 75000, y: 75 },
|
||||
{ x: 100000, y: 100 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 750000, y: 75 },
|
||||
{ x: 1000000, y: 100 },
|
||||
{ x: 1000000, y: 0 },
|
||||
],
|
||||
[
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 125000, y: 25 },
|
||||
{ x: 150000, y: 50 },
|
||||
{ x: 150000, y: 0 },
|
||||
{ x: 1000000, y: 0 },
|
||||
{ x: 1250000, y: 25 },
|
||||
{ x: 1500000, y: 50 },
|
||||
{ x: 1500000, y: 0 },
|
||||
]
|
||||
],
|
||||
expectedForwardsPath: [
|
||||
{ x: 150000, y: 0 },
|
||||
{ x: 150000, y: 50 },
|
||||
{ x: 1500000, y: 0 },
|
||||
{ x: 1500000, y: 50 },
|
||||
],
|
||||
},
|
||||
{
|
||||
|
|
@ -306,18 +306,18 @@ const TEST_CASES = [
|
|||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 25000, y: 25 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 75000, y: 75 },
|
||||
{ x: 100000, y: 100 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 250000, y: 25 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 750000, y: 75 },
|
||||
{ x: 1000000, y: 100 },
|
||||
{ x: 1000000, y: 0 },
|
||||
]
|
||||
],
|
||||
expectedForwardsPath: [
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 100000, y: 100 },
|
||||
{ x: 200000, y: 100 },
|
||||
{ x: 200000, y: 0 },
|
||||
{ x: 1000000, y: 0 },
|
||||
{ x: 1000000, y: 100 },
|
||||
{ x: 2000000, y: 100 },
|
||||
{ x: 2000000, y: 0 },
|
||||
],
|
||||
},
|
||||
{
|
||||
|
|
@ -325,15 +325,15 @@ const TEST_CASES = [
|
|||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 0, y: 50 },
|
||||
{ x: 25000, y: 75 },
|
||||
{ x: 50000, y: 100 },
|
||||
{ x: 50000, y: 0 },
|
||||
{ x: 250000, y: 75 },
|
||||
{ x: 500000, y: 100 },
|
||||
{ x: 500000, y: 0 },
|
||||
],
|
||||
[
|
||||
{ x: 50000, y: 0 },
|
||||
{ x: 75000, y: 25 },
|
||||
{ x: 100000, y: 50 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 500000, y: 0 },
|
||||
{ x: 750000, y: 25 },
|
||||
{ x: 1000000, y: 50 },
|
||||
{ x: 1000000, y: 0 },
|
||||
]
|
||||
],
|
||||
},
|
||||
|
|
@ -342,11 +342,11 @@ const TEST_CASES = [
|
|||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 25000, y: 25 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 75000, y: 75 },
|
||||
{ x: 100000, y: 100 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 250000, y: 25 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 750000, y: 75 },
|
||||
{ x: 1000000, y: 100 },
|
||||
{ x: 1000000, y: 0 },
|
||||
]
|
||||
],
|
||||
},
|
||||
|
|
@ -355,10 +355,10 @@ const TEST_CASES = [
|
|||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 49999, y: 0 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 99999, y: 50 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 499999, y: 0 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 999999, y: 50 },
|
||||
{ x: 1000000, y: 0 },
|
||||
]
|
||||
],
|
||||
},
|
||||
|
|
@ -367,12 +367,12 @@ const TEST_CASES = [
|
|||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 10000, y: 10 },
|
||||
{ x: 11000, y: 10 },
|
||||
{ x: 11500, y: 10 },
|
||||
{ x: 12999, y: 10 },
|
||||
{ x: 13000, y: 13 },
|
||||
{ x: 13500, y: 13.5 },
|
||||
{ x: 100000, y: 10 },
|
||||
{ x: 110000, y: 10 },
|
||||
{ x: 115000, y: 10 },
|
||||
{ x: 129999, y: 10 },
|
||||
{ x: 130000, y: 13 },
|
||||
{ x: 135000, y: 13.5 },
|
||||
]
|
||||
],
|
||||
},
|
||||
|
|
@ -381,9 +381,9 @@ const TEST_CASES = [
|
|||
expectedIterationPathList: [
|
||||
[
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 25000, y: 25 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 99999, y: 50 },
|
||||
{ x: 250000, y: 25 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 999999, y: 50 },
|
||||
]
|
||||
],
|
||||
},
|
||||
|
|
|
|||
|
|
@ -18,10 +18,10 @@ const TEST_CASES = [
|
|||
targetClassName: "easing-step",
|
||||
expectedPath: [
|
||||
{ x: 0, y: 0 },
|
||||
{ x: 49900, y: 0 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 99999, y: 50 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 499999, y: 0 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 999999, y: 50 },
|
||||
{ x: 1000000, y: 0 },
|
||||
],
|
||||
},
|
||||
{
|
||||
|
|
|
|||
|
|
@ -14,8 +14,8 @@ const TEST_CASES = [
|
|||
{
|
||||
targetClassName: "delay-negative",
|
||||
expectedPath: [
|
||||
{ x: -50000, y: 0 },
|
||||
{ x: -25000, y: 25 },
|
||||
{ x: -500000, y: 0 },
|
||||
{ x: -250000, y: 25 },
|
||||
{ x: 0, y: 50 },
|
||||
{ x: 0, y: 0 },
|
||||
],
|
||||
|
|
|
|||
|
|
@ -14,11 +14,11 @@ const TEST_CASES = [
|
|||
{
|
||||
targetClassName: "enddelay-negative",
|
||||
expectedPath: [
|
||||
{ x: 50000, y: 0 },
|
||||
{ x: 50000, y: 50 },
|
||||
{ x: 75000, y: 75 },
|
||||
{ x: 100000, y: 100 },
|
||||
{ x: 100000, y: 0 },
|
||||
{ x: 500000, y: 0 },
|
||||
{ x: 500000, y: 50 },
|
||||
{ x: 750000, y: 75 },
|
||||
{ x: 1000000, y: 100 },
|
||||
{ x: 1000000, y: 0 },
|
||||
],
|
||||
},
|
||||
];
|
||||
|
|
|
|||
|
|
@ -10,14 +10,14 @@ const TEST_CASES = [
|
|||
targetClassName: "cssanimation-normal",
|
||||
expectedResult: {
|
||||
nameAndType: "cssanimation - CSS Animation",
|
||||
duration: "100s",
|
||||
duration: "1,000s",
|
||||
},
|
||||
},
|
||||
{
|
||||
targetClassName: "cssanimation-linear",
|
||||
expectedResult: {
|
||||
nameAndType: "cssanimation - CSS Animation",
|
||||
duration: "100s",
|
||||
duration: "1,000s",
|
||||
animationTimingFunction: "linear",
|
||||
},
|
||||
},
|
||||
|
|
@ -25,23 +25,23 @@ const TEST_CASES = [
|
|||
targetClassName: "delay-positive",
|
||||
expectedResult: {
|
||||
nameAndType: "test-delay-animation - Script Animation",
|
||||
delay: "50s",
|
||||
duration: "100s",
|
||||
delay: "500s",
|
||||
duration: "1,000s",
|
||||
},
|
||||
},
|
||||
{
|
||||
targetClassName: "delay-negative",
|
||||
expectedResult: {
|
||||
nameAndType: "test-negative-delay-animation - Script Animation",
|
||||
delay: "-50s",
|
||||
duration: "100s",
|
||||
delay: "-500s",
|
||||
duration: "1,000s",
|
||||
},
|
||||
},
|
||||
{
|
||||
targetClassName: "easing-step",
|
||||
expectedResult: {
|
||||
nameAndType: "Script Animation",
|
||||
duration: "100s",
|
||||
duration: "1,000s",
|
||||
easing: "steps(2)",
|
||||
},
|
||||
},
|
||||
|
|
@ -49,24 +49,24 @@ const TEST_CASES = [
|
|||
targetClassName: "enddelay-positive",
|
||||
expectedResult: {
|
||||
nameAndType: "Script Animation",
|
||||
duration: "100s",
|
||||
endDelay: "50s",
|
||||
duration: "1,000s",
|
||||
endDelay: "500s",
|
||||
},
|
||||
},
|
||||
{
|
||||
targetClassName: "enddelay-negative",
|
||||
expectedResult: {
|
||||
nameAndType: "Script Animation",
|
||||
duration: "100s",
|
||||
endDelay: "-50s",
|
||||
duration: "1,000s",
|
||||
endDelay: "-500s",
|
||||
},
|
||||
},
|
||||
{
|
||||
targetClassName: "enddelay-with-fill-forwards",
|
||||
expectedResult: {
|
||||
nameAndType: "Script Animation",
|
||||
duration: "100s",
|
||||
endDelay: "50s",
|
||||
duration: "1,000s",
|
||||
endDelay: "500s",
|
||||
fill: "forwards",
|
||||
},
|
||||
},
|
||||
|
|
@ -74,8 +74,8 @@ const TEST_CASES = [
|
|||
targetClassName: "enddelay-with-iterations-infinity",
|
||||
expectedResult: {
|
||||
nameAndType: "Script Animation",
|
||||
duration: "100s",
|
||||
endDelay: "50s",
|
||||
duration: "1,000s",
|
||||
endDelay: "500s",
|
||||
iterations: "\u221E",
|
||||
},
|
||||
},
|
||||
|
|
@ -83,7 +83,7 @@ const TEST_CASES = [
|
|||
targetClassName: "direction-alternate-with-iterations-infinity",
|
||||
expectedResult: {
|
||||
nameAndType: "Script Animation",
|
||||
duration: "100s",
|
||||
duration: "1,000s",
|
||||
direction: "alternate",
|
||||
iterations: "\u221E",
|
||||
},
|
||||
|
|
@ -92,7 +92,7 @@ const TEST_CASES = [
|
|||
targetClassName: "direction-alternate-reverse-with-iterations-infinity",
|
||||
expectedResult: {
|
||||
nameAndType: "Script Animation",
|
||||
duration: "100s",
|
||||
duration: "1,000s",
|
||||
direction: "alternate-reverse",
|
||||
iterations: "\u221E",
|
||||
},
|
||||
|
|
@ -101,7 +101,7 @@ const TEST_CASES = [
|
|||
targetClassName: "direction-reverse-with-iterations-infinity",
|
||||
expectedResult: {
|
||||
nameAndType: "Script Animation",
|
||||
duration: "100s",
|
||||
duration: "1,000s",
|
||||
direction: "reverse",
|
||||
iterations: "\u221E",
|
||||
},
|
||||
|
|
@ -110,7 +110,7 @@ const TEST_CASES = [
|
|||
targetClassName: "fill-backwards",
|
||||
expectedResult: {
|
||||
nameAndType: "Script Animation",
|
||||
duration: "100s",
|
||||
duration: "1,000s",
|
||||
fill: "backwards",
|
||||
},
|
||||
},
|
||||
|
|
@ -118,8 +118,8 @@ const TEST_CASES = [
|
|||
targetClassName: "fill-backwards-with-delay-iterationstart",
|
||||
expectedResult: {
|
||||
nameAndType: "Script Animation",
|
||||
delay: "50s",
|
||||
duration: "100s",
|
||||
delay: "500s",
|
||||
duration: "1,000s",
|
||||
fill: "backwards",
|
||||
iterationStart: "0.5",
|
||||
},
|
||||
|
|
@ -128,7 +128,7 @@ const TEST_CASES = [
|
|||
targetClassName: "fill-both",
|
||||
expectedResult: {
|
||||
nameAndType: "Script Animation",
|
||||
duration: "100s",
|
||||
duration: "1,000s",
|
||||
fill: "both",
|
||||
},
|
||||
},
|
||||
|
|
@ -136,8 +136,8 @@ const TEST_CASES = [
|
|||
targetClassName: "fill-both-width-delay-iterationstart",
|
||||
expectedResult: {
|
||||
nameAndType: "Script Animation",
|
||||
delay: "50s",
|
||||
duration: "100s",
|
||||
delay: "500s",
|
||||
duration: "1,000s",
|
||||
fill: "both",
|
||||
iterationStart: "0.5",
|
||||
},
|
||||
|
|
@ -146,7 +146,7 @@ const TEST_CASES = [
|
|||
targetClassName: "fill-forwards",
|
||||
expectedResult: {
|
||||
nameAndType: "Script Animation",
|
||||
duration: "100s",
|
||||
duration: "1,000s",
|
||||
fill: "forwards",
|
||||
},
|
||||
},
|
||||
|
|
@ -154,7 +154,7 @@ const TEST_CASES = [
|
|||
targetClassName: "iterationstart",
|
||||
expectedResult: {
|
||||
nameAndType: "Script Animation",
|
||||
duration: "100s",
|
||||
duration: "1,000s",
|
||||
iterationStart: "0.5",
|
||||
},
|
||||
},
|
||||
|
|
@ -162,14 +162,14 @@ const TEST_CASES = [
|
|||
targetClassName: "no-compositor",
|
||||
expectedResult: {
|
||||
nameAndType: "Script Animation",
|
||||
duration: "100s",
|
||||
duration: "1,000s",
|
||||
},
|
||||
},
|
||||
{
|
||||
targetClassName: "keyframes-easing-step",
|
||||
expectedResult: {
|
||||
nameAndType: "Script Animation",
|
||||
duration: "100s",
|
||||
duration: "1,000s",
|
||||
},
|
||||
},
|
||||
];
|
||||
|
|
|
|||
|
|
@ -10,11 +10,11 @@
|
|||
}
|
||||
|
||||
.cssanimation-normal {
|
||||
animation: cssanimation 100s;
|
||||
animation: cssanimation 1000s;
|
||||
}
|
||||
|
||||
.cssanimation-linear {
|
||||
animation: cssanimation 100s linear;
|
||||
animation: cssanimation 1000s linear;
|
||||
}
|
||||
|
||||
@keyframes cssanimation {
|
||||
|
|
@ -33,7 +33,7 @@
|
|||
<script>
|
||||
"use strict";
|
||||
|
||||
const duration = 100000;
|
||||
const duration = 1000000;
|
||||
|
||||
function createAnimation(keyframes, effect, className) {
|
||||
const div = document.createElement("div");
|
||||
|
|
@ -44,11 +44,11 @@
|
|||
}
|
||||
|
||||
createAnimation({ opacity: [0, 1] },
|
||||
{ delay: 50000, id: "test-delay-animation" },
|
||||
{ delay: 500000, id: "test-delay-animation" },
|
||||
"delay-positive");
|
||||
|
||||
createAnimation({ opacity: [0, 1] },
|
||||
{ delay: -50000, id: "test-negative-delay-animation" },
|
||||
{ delay: -500000, id: "test-negative-delay-animation" },
|
||||
"delay-negative");
|
||||
|
||||
createAnimation({ opacity: [0, 1] },
|
||||
|
|
@ -56,19 +56,19 @@
|
|||
"easing-step");
|
||||
|
||||
createAnimation({ opacity: [0, 1] },
|
||||
{ endDelay: 50000 },
|
||||
{ endDelay: 500000 },
|
||||
"enddelay-positive");
|
||||
|
||||
createAnimation({ opacity: [0, 1] },
|
||||
{ endDelay: -50000 },
|
||||
{ endDelay: -500000 },
|
||||
"enddelay-negative");
|
||||
|
||||
createAnimation({ opacity: [0, 1] },
|
||||
{ endDelay: 50000, fill: "forwards" },
|
||||
{ endDelay: 500000, fill: "forwards" },
|
||||
"enddelay-with-fill-forwards");
|
||||
|
||||
createAnimation({ opacity: [0, 1] },
|
||||
{ endDelay: 50000, iterations: Infinity },
|
||||
{ endDelay: 500000, iterations: Infinity },
|
||||
"enddelay-with-iterations-infinity");
|
||||
|
||||
createAnimation({ opacity: [0, 1] },
|
||||
|
|
@ -88,7 +88,7 @@
|
|||
"fill-backwards");
|
||||
|
||||
createAnimation({ opacity: [0, 1] },
|
||||
{ fill: "backwards", delay: 50000, iterationStart: 0.5 },
|
||||
{ fill: "backwards", delay: 500000, iterationStart: 0.5 },
|
||||
"fill-backwards-with-delay-iterationstart");
|
||||
|
||||
createAnimation({ opacity: [0, 1] },
|
||||
|
|
@ -96,7 +96,7 @@
|
|||
"fill-both");
|
||||
|
||||
createAnimation({ opacity: [0, 1] },
|
||||
{ fill: "both", delay: 50000, iterationStart: 0.5 },
|
||||
{ fill: "both", delay: 500000, iterationStart: 0.5 },
|
||||
"fill-both-width-delay-iterationstart");
|
||||
|
||||
createAnimation({ opacity: [0, 1] },
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче