Remove debug option from animation (#8512)

* Remove debug option from animation

* Add converage for visible animation

* Update visible animation fn

diff --git a/docs/docs/configuration/animations.mdx b/docs/docs/configuration/animations.mdx
index f3ca5e30b51e9b7d1716d1587f406ea2626ebe78..dc816121f2ae1eafdae43b9add762d9d40d7e2a3 100644 (file)
--- a/docs/docs/configuration/animations.mdx
+++ b/docs/docs/configuration/animations.mdx
@@ -136,7 +136,6 @@ Namespace: `options.animation`
 | ---- | ---- | ------- | -----------
 | `duration` | `number` | `1000` | The number of milliseconds an animation takes.
 | `easing` | `string` | `'easeOutQuart'` | Easing function to use. [more...](#easing)
-| `debug` | `boolean` | `undefined` | Running animation count + FPS display in upper left corner of the chart.
 | `delay` | `number` | `undefined` | Delay before starting the animations.
 | `loop` | `boolean` | `undefined` | If set to `true`, the animations loop endlessly.
 

diff --git a/src/core/core.animations.js b/src/core/core.animations.js
index 600aa71e1b636c7211b97c2d3d0946796d90261a..28c0830682a87e3b1f0f3ce1c9741f7697e053ef 100644 (file)
--- a/src/core/core.animations.js
+++ b/src/core/core.animations.js
@@ -69,7 +69,7 @@ defaults.set('transitions', {
       },
       visible: {
         type: 'boolean',
-        fn: v => v < 1 ? 0 : 1 // for keeping the dataset visible all the way through the animation
+        fn: v => v | 0 // for keeping the dataset visible all the way through the animation
       },
     }
   }

diff --git a/src/core/core.animator.js b/src/core/core.animator.js
index e06651474fea158e80879d5cd9503ad362477180..918eddad747edc7dd4e8024e2f7a969f74a5e702 100644 (file)
--- a/src/core/core.animator.js
+++ b/src/core/core.animator.js
@@ -5,20 +5,6 @@ import {requestAnimFrame} from '../helpers/helpers.extras';
  * @typedef { import("./core.controller").default } Chart
  */
 
-function drawFPS(chart, count, date, lastDate) {
-  const fps = (1000 / (date - lastDate)) | 0;
-  const ctx = chart.ctx;
-  ctx.save();
-  ctx.clearRect(0, 0, 50, 24);
-  ctx.fillStyle = 'black';
-  ctx.textAlign = 'right';
-  if (count) {
-    ctx.fillText(count, 50, 8);
-    ctx.fillText(fps + ' fps', 50, 18);
-  }
-  ctx.restore();
-}
-
 /**
  * Please use the module's default export which provides a singleton instance
  * Note: class is export for typedoc
@@ -35,7 +21,7 @@ export class Animator {
         * @private
         */
   _notify(chart, anims, date, type) {
-    const callbacks = anims.listeners[type] || [];
+    const callbacks = anims.listeners[type];
     const numSteps = anims.duration;
 
     callbacks.forEach(fn => fn({
@@ -101,10 +87,6 @@ export class Animator {
         me._notify(chart, anims, date, 'progress');
       }
 
-      if (chart.options.animation.debug) {
-        drawFPS(chart, items.length, date, me._lastDate);
-      }
-
       if (!items.length) {
         anims.running = false;
         me._notify(chart, anims, date, 'complete');

diff --git a/test/specs/core.animations.tests.js b/test/specs/core.animations.tests.js
index 6cb2d3aac4d8385da0b00e4c23e98f5d4b573a4b..fc2cf24297ceb00780b8cc29774799d698fececa 100644 (file)
--- a/test/specs/core.animations.tests.js
+++ b/test/specs/core.animations.tests.js
@@ -64,11 +64,7 @@ describe('Chart.animations', function() {
   it('should assign shared options to target after animations complete', function(done) {
     const chart = {
       draw: function() {},
-      options: {
-        animation: {
-          debug: false
-        }
-      }
+      options: {}
     };
     const anims = new Chart.Animations(chart, {value: {duration: 100}, option: {duration: 200}});
 
@@ -100,11 +96,7 @@ describe('Chart.animations', function() {
   it('should not assign shared options to target when animations are cancelled', function(done) {
     const chart = {
       draw: function() {},
-      options: {
-        animation: {
-          debug: false
-        }
-      }
+      options: {}
     };
     const anims = new Chart.Animations(chart, {value: {duration: 100}, option: {duration: 200}});
 
@@ -141,11 +133,7 @@ describe('Chart.animations', function() {
   it('should assign final shared options to target after animations complete', function(done) {
     const chart = {
       draw: function() {},
-      options: {
-        animation: {
-          debug: false
-        }
-      }
+      options: {}
     };
     const anims = new Chart.Animations(chart, {value: {duration: 100}, option: {duration: 200}});
 
@@ -184,4 +172,47 @@ describe('Chart.animations', function() {
       }, 250);
     }, 50);
   });
+
+  describe('default transitions', function() {
+    describe('hide', function() {
+      it('should keep dataset visible through the animation', function(done) {
+        let test = false;
+        let count = 0;
+        window.acquireChart({
+          type: 'line',
+          data: {
+            labels: [0],
+            datasets: [
+              {data: [1]},
+            ]
+          },
+          options: {
+            animation: {
+              duration: 100,
+              onProgress: (args) => {
+                if (test) {
+                  if (args.currentStep < args.numSteps) {
+                    // while animating, visible should be truthly
+                    expect(args.chart.getDatasetMeta(0).visible).toBeTruthy();
+                    count++;
+                  }
+                }
+              },
+              onComplete: (args) => {
+                if (!test) {
+                  test = true;
+                  setTimeout(() => args.chart.hide(0), 1);
+                } else {
+                  // and when finished, it should be false
+                  expect(args.chart.getDatasetMeta(0).visible).toBeFalsy();
+                  expect(count).toBeGreaterThan(0);
+                  done();
+                }
+              }
+            }
+          }
+        });
+      });
+    });
+  });
 });