animate background not triggering as expected

[mitchgrout]

Consider the following fragment:

export component MainWindow inherits Window {
  private property <duration> duration:    1s;
  private property <[color]>  colors:      [#f00, #0f0, #00f];
  private property <int>      tick:        animation-tick() / duration;
  private property <int>      color-index: mod(tick, colors.length);

  width:      400px;
  height:     300px;
  background: colors[color-index];

  animate background { duration: self.duration; }
}

The behaviour I expect is that over a 3s period, the window will cycle smoothly between red, green, and blue, then repeat. On v1.4.1 (VSCode extension + SlintPad), the window instead remains at one of the colours, and will not change.

If I tack on something like...

  TouchArea {
    pointer-event(e) => {
      if (e.kind == PointerEventKind.up) { parent.tick += 1; }
    }
  }

...then once I click the area, the background will finally update to the next colour in the cycle. Observing the values of tick and color-index, they are changing as expected, but the animation does not appear to be kicking in. Thoughts?

[mitchgrout]

Hmm, I have an answer but it leads to another question. I took my original fragment, and added a Text component to monitor the values of tick and color-index. These update on the screen as expected, without the color changing. However, if I jiggle my mouse over the screen, then the animation kicks in. I'm a bit surprised that the text can re-render itself without invalidating at least a portion of its parent? Or perhaps, the animate background is not being triggered without some sort of user event to force it?

[mitchgrout]

I've set this up in SlintPad for ease of access. As noted above:

• Once loaded, will render and remain on one of the colours
• Text area will continue to update and re-render
• Moving the mouse over the window will cause the animation to begin to trigger

[hunger]

#4752 fixed a bug with animations not running as expected recently, but that seems unrelated to me.

[ogoffart]

I have seen this problem before, but there was not yet an open bug about it so i opened #4811

The problem is that because of animation-tick, the property is always marked as dirty and the animation is constantly restarted without having the ability to do any progress.