--- a/devtools/client/inspector/animation/animation.js
+++ b/devtools/client/inspector/animation/animation.js
@@ -653,13 +653,17 @@ class AnimationInspector {
     }
 
     this.stopAnimationsCurrentTimeTimer();
 
     this.inspector.store.dispatch(updateAnimations(animations));
 
     if (hasRunningAnimation(animations)) {
       this.startAnimationsCurrentTimeTimer();
+    } else {
+      // Even no running animations, update the current time once
+      // so as to show the state.
+      this.onCurrentTimeTimerUpdated(this.state.timeScale.getCurrentTime());
     }
   }
 }
 
 module.exports = AnimationInspector;

--- a/devtools/client/inspector/animation/current-time-timer.js
+++ b/devtools/client/inspector/animation/current-time-timer.js
@@ -22,21 +22,17 @@ class CurrentTimeTimer {
    * @param {Function} onUpdated
    *                   Listener function to get updating.
    *                   This function is called with 2 parameters.
    *                   1st: current time
    *                   2nd: if shouldStopAfterEndTime is true and
    *                        the current time is over the end time, true is given.
    */
   constructor(timeScale, shouldStopAfterEndTime, win, onUpdated) {
-    // If currentTime is not defined (which happens when connected to server older
-    // than FF62), use documentCurrentTime instead. See bug 1454392.
-    const baseTime = typeof timeScale.currentTime === "undefined"
-                       ? timeScale.documentCurrentTime : timeScale.currentTime;
-    this.baseCurrentTime = baseTime - timeScale.minStartTime;
+    this.baseCurrentTime = timeScale.getCurrentTime();
     this.endTime = timeScale.getDuration();
     this.timerStartTime = win.performance.now();
 
     this.shouldStopAfterEndTime = shouldStopAfterEndTime;
     this.onUpdated = onUpdated;
     this.win = win;
     this.next = this.next.bind(this);
   }

--- a/devtools/client/inspector/animation/utils/timescale.js
+++ b/devtools/client/inspector/animation/utils/timescale.js
@@ -146,16 +146,29 @@ class TimeScale {
    *
    * @return {Number} duration
    */
   getDuration() {
     return this.maxEndTime - this.minStartTime;
   }
 
   /**
+   * Return current time of this time scale represents.
+   *
+   * @return {Number}
+   */
+  getCurrentTime() {
+    // If currentTime is not defined (which happens when connected to server older
+    // than FF62), use documentCurrentTime instead. See bug 1454392.
+    const baseTime = typeof this.currentTime === "undefined"
+                       ? this.documentCurrentTime : this.currentTime;
+    return baseTime - this.minStartTime;
+  }
+
+  /**
    * Return end time of given animation.
    * This time does not include playbackRate and cratedTime.
    * Also, if the animation has infinite iterations, this returns Infinity.
    *
    * @param {Object} animation
    * @return {Numbber} end time
    */
   getEndTime({ state }) {