gum

I had this strange bug in a game I was making that caused the player to be able to click twice on a button, even though the event listener removed itself which should have prevented the second click. After spending many hours on this I've managed to boil it down to what I think is a bug in how TimelineLite handles call() Here's an example: var obj = {value: 0}; var timeline_1 = new TimelineLite({delay: 1, onStart: function() { console.log("timeline_1 start") }, onComplete: function() { console.log("timeline_1 complete"); }}) .to(obj, 0.5, {value: 1}) .add(function() { console.log("function 1"); timeline_2.play(0); }, 0.4) var timeline_2 = new TimelineLite({paused: true, onStart: function() { console.log("timeline_2 start") }, onComplete: function() { console.log("timeline_2 complete"); }}) .to(obj, 0.5, {value: 0}) .add(function() { console.log("function 2"); timeline_1.play(0); }, 3); The first timeline tweens an object's value to 1 during 0.5 seconds, and calls a function after 0.4 seconds. That function goes on to play the second timeline (previously paused). The second timeline starts tweening the same object's value back to 0 (0.1 seconds before the first tween is done, causing an overlap), and after 3 seconds calls a function that plays the first timeline from 0 again, effectively creating a loop. The expected behaviour (for me at least!) is that the tween on the second timeline will overwrite the first, cutting it a little short. What actually happens is that the first timeline's call() function runs twice right after each other (logging "function_1" twice to the console), even though the first timeline is only started once! This only happens when the two tweens overlap. If I nudge the function calls and/or tweens so the second tween doesn't overwrite the first, the problem is gone. The same goes for when I have the second tween affect some other unrelated value instead: no problem. Have I misunderstood something here, or is this in fact a bug?

Thanks for the reply! I agree that setting immediateRender on a to() tween doesn't make sense. I only found that behaviour when trying to figure out why my fromTo() tweens didn't fire the onUpdate event like I assumed it would. It makes sense to me that the onUpdate would be called once when immediateRender is set to true. At least when the "start" values forces changes onto the tweened object. And it would have saved some extra bulk in my current project. But I get the logic behind it not working like that as well.

I've come come across a strange behaviour that I would like to understand. It might be bug, but I'm not sure. When setting immediateRender to true I would have guessed that onUpdate would also fire once during that initial render, but it seems to depend on the type of tween involved. .to fires the onUpdate while .from and .fromTo doesn't. Example: var obj1 = {a: 0}; var obj2 = {a: 0}; var obj3 = {a: 0}; // logs "update1" TweenLite.to(obj1, 1, {a: 1, onUpdate: function() { console.log("update1"); }, immediateRender: true, paused: true}); // logs nothing TweenLite.from(obj2, 1, {a: 1, onUpdate: function() { console.log("update2"); }, immediateRender: true, paused: true}); // logs nothing TweenLite.fromTo(obj3, 1, {a: 0}, {a: 1, onUpdate: function() { console.log("update3"); }, immediateRender: true, paused: true});