Error on visit()

[dreadjr]

Object [object Object] has no method 'removeAttribute' TypeError: Object [object Object] has no method 'removeAttribute'
    at Object.f.support.opacity.f.cssHooks.opacity.set (unknown source)
    at Function.f.extend.style (unknown source)
    at f.each.b.indexOf.f.fx.step.(anonymous function) (unknown source)
    at Object.f.fx.update (unknown source)
    at Object.f.fx.step (unknown source)
    at h (unknown source)
    at f.extend.tick (unknown source)
    at Object.window._evaluate (/Users/dread/Qnary_2.0_Web/node_modules/zombie/lib/zombie/window.js:185:23)
    at Interval.resume._this.next (/Users/dread/Qnary_2.0_Web/node_modules/zombie/lib/zombie/eventloop.js:427:35)
    at EventLoop.run (/Users/dread/Qnary_2.0_Web/node_modules/zombie/lib/zombie/eventloop.js:140:11)

---

var browser = new Browser();

browser.visit('http://localhost:3000', { debug: true}, function(err, browser) {
  browser.dump();
});

I know the test script isn't very helpful, and it is due to something the page is loading, but I can't dump the contents of the page to a forum like this. Where should i start with debugging/troubleshooting? Or any ideas of what could cause the issue? I am thinking it might have to do with jquery, still running that down now.

[darrenderidder]

+1

Seems related to jQuery's CSS based effects. Zombie.js fails running jquery's fadeIn() effect with the error:

TypeError: Object [object Object] has no method 'removeAttribute'
      at Object.f.support.opacity.f.cssHooks.opacity.set (/js/jquery.min.js:4:7021)

[dxg]

I'm also sometimes getting this:

TypeError: Object [object Object] has no method 'removeAttribute'
  at Object.jQuery.cssHooks.opacity.set (/app.js:8424:15)
  at Function.jQuery.extend.style (/app.js:8183:58)
  at jQuery.each.jQuery.fx.step.(anonymous function) (/app.js:10531:14)
  at Object.jQuery.fx.update (/app.js:10319:63)
  at Object.jQuery.fx.step (/app.js:10410:12)
  at t (/app.js:10348:19)
  at jQuery.extend.tick (/app.js:10487:13)
  at Object.Windows._create.window._evaluate (/project/node_modules/zombie/lib/zombie/windows.js:273:23)
  at EventLoop.apply.window.setInterval.timer.resume (/project/node_modules/zombie/lib/zombie/eventloop.js:108:22)
  at EventLoop.perform (/project/node_modules/zombie/lib/zombie/eventloop.js:141:5)

jQuery 1.7.2, traceback points to this line.

Will try with a newer jquery.

EDIT:
Updated to jQuery 1.9.1; So far no errors.

[TorinFrancis]

Same issue here with zombie 1.4.1 and jQuery 1.7.2 (which I am tied to unfortunately)

I do not get the error when using zombie 1.3.1

[ghost]

I've got this with jquery 1.8.3 and colorbox:

      TypeError: Object [object Object] has no method 'removeAttribute'
          at e (/colorbox/jquery.colorbox-min.js:6:8817)
          at t.colorbox.J.prep.h (/colorbox/jquery.colorbox-min.js:6:9796)
          at Object.t.colorbox.J.position.x.dequeue.animate.complete (/colorbox/jquery.colorbox-min.js:6:7978)
          at Object.v.speed.r.complete (/jquery-1.8.3.min.js:2:90180)
          at v.Callbacks.l (/jquery-1.8.3.min.js:2:16996)
          at Object.v.Callbacks.c.fireWith [as resolveWith] (/jquery-1.8.3.min.js:2:17783)
          at a (/jquery-1.8.3.min.js:2:6614)
          at v.fx.tick (/jquery-1.8.3.min.js:2:90434)
          at Object.Windows._create.window._evaluate (d:\Herby\eranet\eranet\builtin-frontend\node_modules\zombie\lib\zombie\windows.js:273:23)
          at EventLoop.apply.window.setInterval.timer.resume (d:\Herby\eranet\eranet\builtin-frontend\node_modules\zombie\lib\zombie\eventloop.js:108:22)

[deitch]

The issue appears to have to do with the following in jQuery (~LL6652-6680 in jQuery 1.7.1)

        set: function( elem, value ) {
            var style = elem.style,
                currentStyle = elem.currentStyle,
                opacity = jQuery.isNumeric( value ) ? "alpha(opacity=" + value * 100 + ")" : "",
                filter = currentStyle && currentStyle.filter || style.filter || "";

            // IE has trouble with opacity if it does not have layout
            // Force it by setting the zoom level
            style.zoom = 1;

            // if setting opacity to 1, and no other filters exist - attempt to remove filter attribute #6652
            if ( value >= 1 && jQuery.trim( filter.replace( ralpha, "" ) ) === "" ) {

                // Setting style.filter to null, "" & " " still leave "filter:" in the cssText
                // if "filter:" is present at all, clearType is disabled, we want to avoid this
                // style.removeAttribute is IE Only, but so apparently is this code path...
                style.removeAttribute( "filter" );

                // if there there is no filter style applied in a css rule, we are done
                if ( currentStyle && !currentStyle.filter ) {
                    return;
                }
            }

            // otherwise, set new filter values
            style.filter = ralpha.test( filter ) ?
                filter.replace( ralpha, opacity ) :
                filter + " " + opacity;
        }

jQuery tests if opacity is supported by creating some html and doing:

        opacity: /^0.55/.test( a.style.opacity ),

For reasons unknown, zombie does not support a.style.opacity, leading to jQuery.support.opacity = false;. Then later when it tries to do opacity, seeing it as false, it assumes that we are IE (or roughly IE-like) and does style.removeAttribute( "filter" );, where the comment says "IE Only".

At some point later, jQuery gets smarter about this and checks for the function removeAttribute() before executing it. I don't have the time to look through all of the commit history for jQuery, but by 1.9.1 it is definitely better:

// in earlier
            if ( value >= 1 && jQuery.trim( filter.replace( ralpha, "" ) ) === "" ) {


// in 1.9.1
            if ( ( value >= 1 || value === "" ) &&
                    jQuery.trim( filter.replace( ralpha, "" ) ) === "" &&
                    style.removeAttribute ) {

Net of it is, the problem is a mismatch between jQuery and zombie. Easily fixed by using jQuery 1.9.1 or later... "easily" if you can easily switch.

The problem is actually from jsdom, see jsdom/jsdom#425

How to fix it...

[assaf]

https://github.com/assaf/zombie/blob/master/src/zombie/jsdom_patches.coffee#L49-L58

On Wednesday, May 1, 2013 at 10:22 PM, Avi Deitcher wrote:

The issue appears to have to do with the following in jQuery (~LL6652-6680 in jQuery 1.7.1)
set: function( elem, value ) { var style = elem.style, currentStyle = elem.currentStyle, opacity = jQuery.isNumeric( value ) ? "alpha(opacity=" + value * 100 + ")" : "", filter = currentStyle && currentStyle.filter || style.filter || ""; // IE has trouble with opacity if it does not have layout // Force it by setting the zoom level style.zoom = 1; // if setting opacity to 1, and no other filters exist - attempt to remove filter attribute #6652 if ( value >= 1 && jQuery.trim( filter.replace( ralpha, "" ) ) === "" ) { // Setting style.filter to null, "" & " " still leave "filter:" in the cssText // if "filter:" is present at all, clearType is disabled, we want to avoid this // style.removeAttribute is IE Only, but so apparently is this code path... style.removeAttribute( "filter" ); // if there there is no filter style applied in a css rule, we are done if ( currentStyle && !currentStyle.filter ) { return; } } // otherwise, set new filter values style.filter = ralpha.test( filter ) ? filter.replace( ralpha, opacity ) : filter + " " + opacity; }

jQuery tests if opacity is supported by creating some html and doing:
opacity: /^0.55/.test( a.style.opacity ),

For reasons unknown, zombie does not support a.style.opacity, leading to jQuery.support.opacity = false;. Then later when it tries to do opacity, seeing it as false, it assumes that we are IE (or roughly IE-like) and does style.removeAttribute( "filter" );, where the comment says "IE Only".
At some point later, jQuery gets smarter about this and checks for the function removeAttribute() before executing it. I don't have the time to look through all of the commit history for jQuery, but by 1.9.1 it is definitely better:
// in earlier if ( value >= 1 && jQuery.trim( filter.replace( ralpha, "" ) ) === "" ) { // in 1.9.1 if ( ( value >= 1 || value === "" ) && jQuery.trim( filter.replace( ralpha, "" ) ) === "" && style.removeAttribute ) {

Net of it is, the problem is a mismatch between jQuery and zombie. Easily fixed by using jQuery 1.9.1 or later... "easily" if you can easily switch.
The problem is actually from jsdom, see jsdom/jsdom#425 (jsdom/jsdom#425)
How to fix it...

—
Reply to this email directly or view it on GitHub (#448 (comment)).

[asas22]

OK, so why does the bug still exist? I can easily replicate it, and my version of zombie has that patch. 2.0.0-alpha11

[deitch]

That's weird. I just posted that last commented, no clue who asas22 is!

[assaf]

That's a disturbing Github bug.

[rtsio]

This still occurs. Made ZombieJS unusable for me.