Reject pending promises when animation is updated (#8184)

* Reject pending promises when animation is updated
* Add tests

diff --git a/src/core/core.animation.js b/src/core/core.animation.js
index f2dcff009ecc381e49f65bda37b02d0717d238f0..100784e59ccb7566a25cd518683382934b639f60 100644 (file)
--- a/src/core/core.animation.js
+++ b/src/core/core.animation.js
@@ -46,6 +46,8 @@ export default class Animation {
        update(cfg, to, date) {
                const me = this;
                if (me._active) {
+                       me._notify(false);
+
                        const currentValue = me._target[me._prop];
                        const elapsed = date - me._start;
                        const remain = me._duration - elapsed;

diff --git a/src/core/core.animations.js b/src/core/core.animations.js
index b51463373ea8856b7dbfc2cf32f8a3c44b71b6fe..94d2859503348a85241173405ba43728c818fbfc 100644 (file)
--- a/src/core/core.animations.js
+++ b/src/core/core.animations.js
@@ -131,6 +131,8 @@ export default class Animations {
                        // So any new updates to the shared options are observed
                        awaitAll(target.options.$animations, newOptions).then(() => {
                                target.options = newOptions;
+                       }, () => {
+                               // rejected, noop
                        });
                }
 

diff --git a/test/specs/core.animations.tests.js b/test/specs/core.animations.tests.js
index 8e76788dc4e35bb6d9d04f27b8a8d1c4c9e6fb1b..e82b92a73bc3b547d2379e6df57022196bdc3a70 100644 (file)
--- a/test/specs/core.animations.tests.js
+++ b/test/specs/core.animations.tests.js
@@ -96,4 +96,93 @@ describe('Chart.animations', function() {
                        done();
                }, 300);
        });
+
+       it('should not assign shared options to target when animations are cancelled', function(done) {
+               const chart = {
+                       draw: function() {},
+                       options: {
+                               animation: {
+                                       debug: false
+                               }
+                       }
+               };
+               const anims = new Chart.Animations(chart, {value: {duration: 100}, option: {duration: 200}});
+
+               const target = {
+                       value: 1,
+                       options: {
+                               option: 2
+                       }
+               };
+               const sharedOpts = {option: 10, $shared: true};
+
+               expect(anims.update(target, {
+                       options: sharedOpts
+               })).toBeTrue();
+
+               expect(target.options !== sharedOpts).toBeTrue();
+
+               Chart.animator.start(chart);
+
+               setTimeout(function() {
+                       expect(Chart.animator.running(chart)).toBeTrue();
+                       Chart.animator.stop(chart);
+                       expect(Chart.animator.running(chart)).toBeFalse();
+
+                       setTimeout(function() {
+                               expect(target.options === sharedOpts).toBeFalse();
+
+                               Chart.animator.remove(chart);
+                               done();
+                       }, 250);
+               }, 50);
+       });
+
+
+       it('should assign final shared options to target after animations complete', function(done) {
+               const chart = {
+                       draw: function() {},
+                       options: {
+                               animation: {
+                                       debug: false
+                               }
+                       }
+               };
+               const anims = new Chart.Animations(chart, {value: {duration: 100}, option: {duration: 200}});
+
+               const origOpts = {option: 2};
+               const target = {
+                       value: 1,
+                       options: origOpts
+               };
+               const sharedOpts = {option: 10, $shared: true};
+               const sharedOpts2 = {option: 20, $shared: true};
+
+               expect(anims.update(target, {
+                       options: sharedOpts
+               })).toBeTrue();
+
+               expect(target.options !== sharedOpts).toBeTrue();
+
+               Chart.animator.start(chart);
+
+               setTimeout(function() {
+                       expect(Chart.animator.running(chart)).toBeTrue();
+
+                       expect(target.options === origOpts).toBeTrue();
+
+                       expect(anims.update(target, {
+                               options: sharedOpts2
+                       })).toBeUndefined();
+
+                       expect(target.options === origOpts).toBeTrue();
+
+                       setTimeout(function() {
+                               expect(target.options === sharedOpts2).toBeTrue();
+
+                               Chart.animator.remove(chart);
+                               done();
+                       }, 250);
+               }, 50);
+       });
 });