forked from mozilla/gecko-dev
-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
41 changed files
with
811 additions
and
149 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
43 changes: 43 additions & 0 deletions
43
...ools/animationinspector/test/browser_animation_controller_exposes_document_currentTime.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,43 @@ | ||
| /* vim: set ts=2 et sw=2 tw=80: */ | ||
| /* Any copyright is dedicated to the Public Domain. | ||
| http://creativecommons.org/publicdomain/zero/1.0/ */ | ||
|
|
||
| "use strict"; | ||
|
|
||
| // Test that the controller provides the document.timeline currentTime (at least | ||
| // the last known version since new animations were added). | ||
|
|
||
| add_task(function*() { | ||
| yield addTab(TEST_URL_ROOT + "doc_simple_animation.html"); | ||
| let {panel, controller} = yield openAnimationInspectorNewUI(); | ||
|
|
||
| ok(controller.documentCurrentTime, "The documentCurrentTime getter exists"); | ||
| checkDocumentTimeIsCorrect(controller); | ||
| let time1 = controller.documentCurrentTime; | ||
|
|
||
| yield startNewAnimation(controller, panel); | ||
| checkDocumentTimeIsCorrect(controller); | ||
| let time2 = controller.documentCurrentTime; | ||
| ok(time2 > time1, "The new documentCurrentTime is higher than the old one"); | ||
| }); | ||
|
|
||
| function checkDocumentTimeIsCorrect(controller) { | ||
| let time = 0; | ||
| for (let {state} of controller.animationPlayers) { | ||
| time = Math.max(time, state.documentCurrentTime); | ||
| } | ||
| is(controller.documentCurrentTime, time, | ||
| "The documentCurrentTime is correct"); | ||
| } | ||
|
|
||
| function* startNewAnimation(controller, panel) { | ||
| info("Add a new animation to the page and check the time again"); | ||
| let onPlayerAdded = controller.once(controller.PLAYERS_UPDATED_EVENT); | ||
| yield executeInContent("devtools:test:setAttribute", { | ||
| selector: ".still", | ||
| attributeName: "class", | ||
| attributeValue: "ball still short" | ||
| }); | ||
| yield onPlayerAdded; | ||
| yield waitForAllAnimationTargets(panel); | ||
| } |
31 changes: 31 additions & 0 deletions
31
browser/devtools/animationinspector/test/browser_animation_mutations_with_same_names.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,31 @@ | ||
| /* vim: set ts=2 et sw=2 tw=80: */ | ||
| /* Any copyright is dedicated to the Public Domain. | ||
| http://creativecommons.org/publicdomain/zero/1.0/ */ | ||
|
|
||
| "use strict"; | ||
|
|
||
| // Check that when animations are added later (through animation mutations) and | ||
| // if these animations have the same names, then all of them are still being | ||
| // displayed (which should be true as long as these animations apply to | ||
| // different nodes). | ||
|
|
||
| add_task(function*() { | ||
| yield addTab(TEST_URL_ROOT + "doc_negative_animation.html"); | ||
| let {controller, panel} = yield openAnimationInspectorNewUI(); | ||
|
|
||
| info("Wait until all animations have been added " + | ||
| "(they're added with setTimeout)"); | ||
| while (controller.animationPlayers.length < 3) { | ||
| yield controller.once(controller.PLAYERS_UPDATED_EVENT); | ||
| } | ||
| yield waitForAllAnimationTargets(panel); | ||
|
|
||
| is(panel.animationsTimelineComponent.animations.length, 3, | ||
| "The timeline shows 3 animations too"); | ||
|
|
||
| // Reduce the known nodeFronts to a set to make them unique. | ||
| let nodeFronts = new Set(panel.animationsTimelineComponent | ||
| .targetNodes.map(n => n.nodeFront)); | ||
| is(nodeFronts.size, 3, | ||
| "The animations are applied to 3 different node fronts"); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
64 changes: 64 additions & 0 deletions
64
browser/devtools/animationinspector/test/doc_negative_animation.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,64 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <style> | ||
| html, body { | ||
| margin: 0; | ||
| height: 100%; | ||
| overflow: hidden; | ||
| } | ||
|
|
||
| div { | ||
| position: absolute; | ||
| top: 0; | ||
| left: -500px; | ||
| height: 20px; | ||
| width: 500px; | ||
| color: red; | ||
| background: linear-gradient(to left, currentColor, currentColor 2px, transparent); | ||
| } | ||
|
|
||
| .zero { | ||
| color: blue; | ||
| top: 20px; | ||
| } | ||
|
|
||
| .positive { | ||
| color: green; | ||
| top: 40px; | ||
| } | ||
|
|
||
| .negative.move { animation: 5s -1s move linear forwards; } | ||
| .zero.move { animation: 5s 0s move linear forwards; } | ||
| .positive.move { animation: 5s 1s move linear forwards; } | ||
|
|
||
| @keyframes move { | ||
| to { | ||
| transform: translateX(500px); | ||
| } | ||
| } | ||
| </style> | ||
| </head> | ||
| <body> | ||
| <div class="negative"></div> | ||
| <div class="zero"></div> | ||
| <div class="positive"></div> | ||
| <script> | ||
| var negative = document.querySelector(".negative"); | ||
| var zero = document.querySelector(".zero"); | ||
| var positive = document.querySelector(".positive"); | ||
|
|
||
| // The non-delayed animation starts now. | ||
| zero.classList.add("move"); | ||
| // The negative-delayed animation starts in 1 second. | ||
| setTimeout(function() { | ||
| negative.classList.add("move"); | ||
| }, 1000); | ||
| // The positive-delayed animation starts in 200 ms. | ||
| setTimeout(function() { | ||
| positive.classList.add("move"); | ||
| }, 200); | ||
| </script> | ||
| </body> | ||
| </html> |
Oops, something went wrong.