Fix properties update works incorrectly when sync and async updates a…

…re present

src/question_paneldynamic.ts

@@ -599,12 +599,14 @@ export class QuestionPanelDynamicModel extends Question
   }
 
   public set renderedPanels(val: Array<PanelModel>) {
+    const oldAnimationAllowed = this.animationAllowed;
     if(this.renderedPanels.length == 0 || val.length == 0) {
-      this._renderedPanels = val;
+      this.animationAllowed = false;
     } else {
       this.isPanelsAnimationRunning = true;
-      this.panelsAnimation.sync(val);
     }
+    this.panelsAnimation.sync(val);
+    this.animationAllowed = oldAnimationAllowed;
   }
 
   public get renderedPanels(): Array<PanelModel> {

src/utils/animation.ts

@@ -204,6 +204,7 @@ export abstract class AnimationProperty<T, S extends Array<any> = []> {
     if(this.animationOptions.isAnimationEnabled()) {
       this._debouncedSync.run(newValue);
     } else {
+      this.cancel();
       this.update(newValue);
     }
   }

tests/utilstests.ts

@@ -824,4 +824,45 @@ QUnit.test("Check onNextRender and cancel", (assert) => {
 
   window.requestAnimationFrame = oldRequestAnimationFrame;
   window.cancelAnimationFrame = oldCancelAnimationFrame;
+});
+
+QUnit.test("Test animation property: check latest update persists", (assert) => {
+  const done = assert.async();
+  let value: boolean = false;
+  let animationEnabled = false;
+  const animation = new AnimationBoolean({
+    getEnterOptions: () => {
+      return {
+        cssClass: "enter",
+      };
+    },
+    isAnimationEnabled: () => {
+      return animationEnabled;
+    },
+    getAnimatedElement: () => {
+      return undefined as any;
+    },
+    getLeaveOptions: () => {
+      return {
+        cssClass: "leave"
+      };
+    }
+  }, (val: boolean) => {
+    value = val;
+  }, () => value);
+  animationEnabled = true;
+  animation.sync(true);
+  animationEnabled = false;
+  animation.sync(false);
+  setTimeout(() => {
+    assert.notOk(value);
+    animationEnabled = false;
+    animation.sync(true);
+    assert.ok(value);
+    animation.sync(false);
+    setTimeout(() => {
+      assert.notOk(value);
+      done();
+    });
+  });
 });