mozilla
/
gecko-dev
зеркало из https://github.com/mozilla/gecko-dev.git
1
0
Форкнуть 0
Код Задачи Пакеты Проекты Релизы Вики Активность

Bug 1254408 - Part 2 - Modifing tests for animation property warnings. r=pbro 

MozReview-Commit-ID: GVTiHhHbKlN
This commit is contained in:
Ryo Motozawa 2016-04-22 20:18:02 +09:00
Родитель be5a1aae1f
Коммит bd7fd252a0
3 изменённых файлов: 55 добавлений и 4 удалений
Показать статистику Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

18
devtools/client/animationinspector/test/browser_animation_animated_properties_displayed.js
Просмотреть файл

@ -4,6 +4,10 @@
"use strict";
const { LocalizationHelper } = require("devtools/client/shared/l10n");
const STRINGS_URI = "chrome://global/locale/layout_errors.properties";
const L10N = new LocalizationHelper(STRINGS_URI);
// Test that when an animation is selected, its list of animated properties is
// displayed below it.
@ -42,6 +46,9 @@ add_task(function* () {
ok(hasExpectedProperties(propertiesList),
"The list of properties panel contains the right properties");
ok(hasExpectedWarnings(propertiesList),
"The list of properties panel contains the right warnings");
info("Click to unselect the animation");
yield clickOnAnimation(panel, 0, true);
@ -66,3 +73,14 @@ function hasExpectedProperties(containerEl) {
return true;
}
function hasExpectedWarnings(containerEl) {
let warnings = [...containerEl.querySelectorAll(".warning")];
for (let warning of warnings) {
if (warning.getAttribute("title") ==
L10N.getStr("AnimationWarningTransformWithGeometricProperties")) {
return true;
}
}
return false;
}

23
devtools/client/animationinspector/test/browser_animation_running_on_compositor.js
Просмотреть файл

@ -25,7 +25,8 @@ add_task(function* () {
let animationEl = timeline.animationsEl.querySelector(".animation");
ok(animationEl.classList.contains("fast-track"),
"The animation element has the fast-track css class");
ok(hasTooltip(animationEl),
ok(hasTooltip(animationEl,
L10N.getStr("player.allPropertiesOnCompositorTooltip")),
"The animation element has the right tooltip content");
info("Select a node we know doesn't have an animation on the compositor");
@ -34,14 +35,28 @@ add_task(function* () {
animationEl = timeline.animationsEl.querySelector(".animation");
ok(!animationEl.classList.contains("fast-track"),
"The animation element does not have the fast-track css class");
ok(!hasTooltip(animationEl),
ok(!hasTooltip(animationEl,
L10N.getStr("player.allPropertiesOnCompositorTooltip")),
"The animation element does not have oncompositor tooltip content");
ok(!hasTooltip(animationEl,
L10N.getStr("player.somePropertiesOnCompositorTooltip")),
"The animation element does not have oncompositor tooltip content");
info("Select a node we know has animation on the compositor and not on the" +
" compositor");
yield selectNodeAndWaitForAnimations(".compositor-notall", inspector);
animationEl = timeline.animationsEl.querySelector(".animation");
ok(animationEl.classList.contains("fast-track"),
"The animation element has the fast-track css class");
ok(hasTooltip(animationEl,
L10N.getStr("player.somePropertiesOnCompositorTooltip")),
"The animation element has the right tooltip content");
});
function hasTooltip(animationEl) {
function hasTooltip(animationEl, expected) {
let el = animationEl.querySelector(".name");
let tooltip = el.getAttribute("title");
let expected = L10N.getStr("player.runningOnCompositorTooltip");
return tooltip.indexOf(expected) !== -1;
}

18
devtools/client/animationinspector/test/doc_simple_animation.html
Просмотреть файл

@ -82,6 +82,10 @@
animation: no-compositor 10s cubic-bezier(.57,-0.02,1,.31) forwards;
}
.compositor-notall {
animation: compositor-notall 2s infinite;
}
@keyframes simple-animation {
100% {
transform: translateX(300px);
@ -99,6 +103,19 @@
margin-right: 600px;
}
}
@keyframes compositor-notall {
from {
opacity: 0;
width: 0px;
transform: translate(0px);
}
to {
opacity: 1;
width: 100px;
transform: translate(100px);
}
}
</style>
</head>
<body>
@ -113,6 +130,7 @@
<div class="ball negative-delay"></div>
<div class="ball no-compositor"></div>
<div class="ball" id="endDelayed"></div>
<div class="ball compositor-notall"></div>
<script>
/* globals KeyframeEffect, Animation */
"use strict";