From 0e060590491e4013541af19251fb4a4a1cd8ed2c Mon Sep 17 00:00:00 2001
From: Daisuke Akatsuka <dakatsuka@mozilla.com>
Date: Sat, 16 Jun 2018 04:23:59 +0900
Subject: [PATCH] Bug 1466773 - Part 5: Add tests that whether the translateX
 change after resizing the width of animation inspector. r=gl

MozReview-Commit-ID: AbnJb8tmjJQ

--HG--
extra : rebase_source : 5b29c7dd22a09a7f7ded65a0fb89551d33149df6
---
 .../inspector/animation/test/browser.ini      |  1 +
 .../test/browser_animation_indication-bar.js  | 38 +++++++++++++++++++
 2 files changed, 39 insertions(+)
 create mode 100644 devtools/client/inspector/animation/test/browser_animation_indication-bar.js

diff --git a/devtools/client/inspector/animation/test/browser.ini b/devtools/client/inspector/animation/test/browser.ini
index 9b1e59443bad..4536a8705404 100644
--- a/devtools/client/inspector/animation/test/browser.ini
+++ b/devtools/client/inspector/animation/test/browser.ini
@@ -35,6 +35,7 @@ support-files =
 [browser_animation_current-time-scrubber.js]
 [browser_animation_current-time-scrubber_each-different-creation-time-animations.js]
 [browser_animation_empty_on_invalid_nodes.js]
+[browser_animation_indication-bar.js]
 [browser_animation_inspector_exists.js]
 [browser_animation_keyframes-graph_computed-value-path-01.js]
 [browser_animation_keyframes-graph_computed-value-path-02.js]
diff --git a/devtools/client/inspector/animation/test/browser_animation_indication-bar.js b/devtools/client/inspector/animation/test/browser_animation_indication-bar.js
new file mode 100644
index 000000000000..0eeca8cacfd4
--- /dev/null
+++ b/devtools/client/inspector/animation/test/browser_animation_indication-bar.js
@@ -0,0 +1,38 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+// Test whether the indication bar of both scrubber and progress bar indicates correct
+// progress after resizing animation inspector.
+
+add_task(async function() {
+  await pushPref("devtools.inspector.three-pane-enabled", false);
+  await addTab(URL_ROOT + "doc_simple_animation.html");
+  await removeAnimatedElementsExcept([".animated"]);
+  const { animationInspector, inspector, panel } = await openAnimationInspector();
+
+  info("Checking timeline tick item elements after enlarge sidebar width");
+  await clickOnCurrentTimeScrubberController(animationInspector, panel, 0.5);
+  await setSidebarWidth("100%", inspector);
+  assertPosition(".current-time-scrubber", panel, 0.5);
+  assertPosition(".keyframes-progress-bar", panel, 0.5);
+});
+
+/**
+ * Assert indication bar position.
+ *
+ * @param {String} indicationBarSelector
+ * @param {Element} panel
+ * @param {Number} expectedPositionRate
+ */
+function assertPosition(indicationBarSelector, panel, expectedPositionRate) {
+  const barEl = panel.querySelector(indicationBarSelector);
+  const parentEl = barEl.parentNode;
+  const rectBar = barEl.getBoundingClientRect();
+  const rectParent = parentEl.getBoundingClientRect();
+  const barX = rectBar.x + rectBar.width * 0.5 - rectParent.x;
+  const expectedPosition = rectParent.width * expectedPositionRate;
+  ok(expectedPosition - 1 <= barX && barX <= expectedPosition + 1,
+    `Indication bar position should be approximately ${ expectedPosition }`);
+}