[FIX] web: kanban: concurrency issue with animated numbers

Before this commit, in the kanban view, if we click the progress bar to
filter the column multiple times, the count of records number's could
show an incorrect value. This occurs because when removing the filter
from the progress bar, an animation is done to the number (to increase
the value until the correct number of records). Contrariwise, when
activating a filter, the number of records is set directly without
animation. When we remove and add again a filter quickly, the animation
to increase the value of the number finishes when the filter is already
apply and the value shown is the old count of records (without the
filter).

To avoid this, in this commit, we stop the animation when the count of
record changes.

Unfortunately, testing this is very complicated (because it involves
animation frames and Date.now()), and as the cost/reward ratio is very
low, we didn't add a test of this behaviour.

closes odoo/odoo#110121

X-original-commit: 4c8bb53df6ad6382c5b168532c8493ddbb1f7252
Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>

addons/web/static/src/views/view_components/animated_number.js

@@ -31,6 +31,7 @@ export class AnimatedNumber extends Component {
             const { value: from } = this.props;
             const { value: to, duration } = nextProps;
             if (!this.constructor.enableAnimations || !duration || to <= from) {
+                browser.cancelAnimationFrame(this.handle);
                 this.state.value = to;
                 return;
             }