feat: dashboard ui tests

src/app/modules/dashboard/dashboard-collapse.ts

@@ -21,10 +21,25 @@ export class DashboardCollapse {
 
   nextFrame: number;
 
+  setReady: () => void;
+
+  // eslint-disable-next-line unicorn/consistent-function-scoping
+  ready = new Promise<void>(resolve => (this.setReady = resolve));
+
+  set active(value: boolean) {
+    this.zone.runOutsideAngular(() => {
+      if (value) {
+        this.start();
+      } else {
+        this.stop();
+      }
+    });
+  }
+
   constructor(
     private animationControl: AnimationController,
     private zone: NgZone,
-    scrollContainer: HTMLElement,
+    private scrollContainer: HTMLElement,
     toolbar: HTMLElement,
     schedule: HTMLElement,
   ) {
@@ -55,23 +70,37 @@ export class DashboardCollapse {
               .addElement(schedule.querySelectorAll(':scope > a > *'))
               .fromTo('transform', 'scaleY(1)', `scaleY(${1 / 0.8})`),
           ]);
-        this.collapseAnimation.progressStart(true, 0);
-
-        const element = scrollContainer;
-        let pos = element.scrollTop;
-        const animate = () => {
-          if (pos !== element.scrollTop) {
-            pos = element.scrollTop;
-            this.collapseAnimation.progressStep(element.scrollTop / 172);
-          }
-          this.nextFrame = requestAnimationFrame(animate);
-        };
-        this.nextFrame = requestAnimationFrame(animate);
+        this.start();
+        this.setReady();
       })
       .then();
   }
 
-  destroy() {
+  private start() {
+    this.collapseAnimation.progressStart(
+      true,
+      this.scrollContainer.scrollTop / 172,
+    );
+    let pos = this.scrollContainer.scrollTop;
+    const animate = () => {
+      if (pos !== this.scrollContainer.scrollTop) {
+        pos = this.scrollContainer.scrollTop;
+        this.collapseAnimation.progressStep(
+          this.scrollContainer.scrollTop / 172,
+        );
+      }
+      this.nextFrame = requestAnimationFrame(animate);
+    };
+    this.nextFrame = requestAnimationFrame(animate);
+  }
+
+  private stop() {
     cancelAnimationFrame(this.nextFrame);
+    this.collapseAnimation.progressEnd(0, 0, 0);
+  }
+
+  destroy() {
+    this.stop();
+    this.collapseAnimation.destroy();
   }
 }