Skip to main content

Search and Top Navigation

#4251 closed bug (fixed)

Opened February 28, 2009 04:59PM UTC

Closed September 20, 2009 09:08PM UTC

Last modified February 10, 2010 06:55AM UTC

NaN in color animation (Firefox 3)

Reported by: lunchtimemama Owned by:
Priority: major Milestone: 1.8
Component: ui.effects.core Version: 1.6rc6
Keywords: Cc: lunchtimemama@gmail.com
Blocked by: Blocking:
Description

I have elements which change color when you click on them. The code essentially looks like this:

$(element).click(function(){
  $(this).stop().animate({color:newColor},"fast");
});

Every now and again, the color doesn't change. When I consult the Firefox error console, I see lots of these:

'''Warning: Expected number or percentage in rgb() but found 'NaN'. Error in parsing value for property 'color'. Declaration dropped.'''

I'm using FF 3.0.6 on Vista 32 SP1.

Attachments (0)
Change History (8)

Changed March 18, 2009 10:16AM UTC by rdworth comment:2

resolution: → worksforme
status: newclosed

Unable to reproduce using above tests. You may want to debug the value of 'newColor' as the error message suggests in may not be formatted correctly. Or if you can reproduce this, please attach a test page. Thanks.

Changed April 01, 2009 06:05AM UTC by defenestrator comment:3

I had the same problem, and I tracked it down to this initialisation code:

    if ( fx.state == 0 ) {
        fx.start = getColor( fx.elem, attr );
        fx.end = getRGB( fx.end );
    }

The problem is that the initialisation code doesn't always run because fx.state isn't always zero on the first call -- in one test, I found it was equal to 0.005. Replacing the if statement with "if ( fx.start.constructor != Array)" fixed the problem for me.

I don't have a test case that I can share, but it appears to be related to performance so I'd suggest testing it by running a very large number of concurrent animations on a slow computer.

Changed April 26, 2009 02:47PM UTC by aesnn comment:4

Change:

if (fx.state == 0)

To:

if (fx.state == 0 || fx.start.constructor != Array || fx.end.constructor != Array)

Sometimes when this code is executed. fx.State is not 0, but fx.start and fx.end haven't been initialized as RGB arrays. In the updated code, we initialize the fx.start and fx.end arrays if they haven't been initialized.

That seems to have fixed it, but it's hard to be sure on an intermittent problem.

Changed April 26, 2009 02:49PM UTC by aesnn comment:5

How fix this bug in repository?

Changed June 10, 2009 09:26PM UTC by dprunier comment:6

Thanks defenestrator and aesnn for pointing us in the right direction.

There is a fairly easy way to reproduce this bug. This is a race condition in

jQuery.fx.custom
. You simply have to delay a little bit the first step so that
fx.state
is not 0.

When

jQuery.fx.step
is called for the first time, the current time (stored in variable
t
) can only be equals OR greater than
this.startTime
. Most of the time they are equals since they are only separated by a few instructions (in
jQuery.fx.custom
and then
fx.state
is 0. If the execution is slow enough (a one millisecond delay is enough, e.g. a log, a busy loop, ..), they will not be equals and then thw first state is not zero, resulting in this bug.

The issue is not in jQuery i guess, since i can't find anywhere where it is specified that state must be equal to 0 on the first step. This is a little bit disapointing to see that this bug has not been fixed since 3 months and has been closed without further investigation...

Changed June 11, 2009 02:40AM UTC by rdworth comment:7

resolution: worksforme
status: closedreopened

Changed September 20, 2009 09:08PM UTC by scottgonzalez comment:8

milestone: TBD1.8
resolution: → fixed
status: reopenedclosed

Fixed in r3269.