My Greasemonkey script stopped working after something updated

Question

I had made a Greasemonkey script for StumbleUpon, and it worked. But suddenly, maybe after a Mozilla or Scriptish update, it stopped working on all protocols.

Please review my script for a mistake. I am a novice in scripting

Script:

// ==UserScript==
// @name            [udit]add stumblethru image-flip button[w/o container] on all websites
// @namespace       testing-for-that-script
// @description     
// @include         http://facebook.com/*
// @include         http://*
// @include         https://*
// @include         *
// @exclude         file:///*
// ==/UserScript==

if (window.top != window.self)  //don't run on frames or iframes
{
    //Optional: GM_log ('In frame');
    return;
}

/*--- Create a button in a container div.  It will be styled and positioned with CSS.
*/
var zNode       = document.createElement ('input');
zNode.setAttribute ('id', 'suButton');
zNode.setAttribute( 'type', 'image' );
zNode.setAttribute( 'src', 'http://www.creativeadornments.com/nephco/doraemon/icons/doraemon_18a.gif' );
document.body.appendChild (zNode);

function tiddu1()
{
document.getElementById("suButton").src ="http://www.creativeadornments.com/nephco/doraemon/icons/doraemon_07.gif";
}

function tiddu2()
{
document.getElementById("suButton").src ="http://www.creativeadornments.com/nephco/doraemon/icons/doraemon_18a.gif";
}

function tiddu3()
{
document.getElementById("suButton").src ="http://www.creativeadornments.com/nephco/doraemon/icons/dorami_01a.gif";
}

function tiddu4()
{
document.getElementById("suButton").src ="http://t1.gstatic.com/images?q=tbn:ANd9GcSI_hx0nLvnO-Em6elAxyMnoBFGw8IMD3Yrpep4XY2I51GylSRf3jHiabAyiw";
}

//--- Activate the newly added button and add rollover image handling.
var zNode = document.getElementById ("suButton");
zNode.addEventListener ("click",        ButtonClickAction,  true);
zNode.addEventListener ("mouseover",    tiddu1,          true);
zNode.addEventListener ("mouseout",     tiddu2,           true);
zNode.addEventListener ("mousedown",     tiddu3,           true);
zNode.addEventListener ("click",     tiddu4,           true);

function ButtonClickAction (zEvent)
{
    //--- For our dummy action, we'll just add a line of text to the top of the screen.
    var button  = document.createElement ('a');
    location.href='http://www.stumbleupon.com/to/stumble/stumblethru:'+location.href.replace("http://","").replace("https://","").replace("ftp://","").split('/',4)[0];
}

//--- Style our newly added elements using CSS.
GM_addStyle ( (<><![CDATA[
    #suButton {
        position:               fixed;
        bottom:                 0px;
        left:                   0px;
        margin:                 0px 0px 50px 0px;
        opacity:                0.8;
        cursor:                 url(C:\buttercup_06.cur),url(http://www.creativeadornments.com/nephco/powerpuffgirls/cursors/ppg_01anim.gif),url(myBall.cur),pointer;
        border:                 0px outset red;
        z-index:                222;
        padding:                5px 5px;
    }
]]></>).toString () );

Answer 1

With Firefox version 17, Firefox dropped support for E4X. E4X is what allowed us to use that (<><![CDATA[ ... ]]></>).toString () construct to make easy, robust, multi-line strings.

Now that E4X is no longer supported, we must refactor every bit of code that used CDATA, to use the javascript string escape (\). So you need to change that GM_addStyle call to:

GM_addStyle ( "                                             \
    #suButton {                                             \
        position:       fixed;                              \
        bottom:         0px;                                \
        left:           0px;                                \
        margin:         0px 0px 50px 0px;                   \
        opacity:        0.8;                                \
        cursor:         url(C:\buttercup_06.cur),url(http://www.creativeadornments.com/nephco/powerpuffgirls/cursors/ppg_01anim.gif),url(myBall.cur),pointer; \
        border:         0px outset red;                     \
        z-index:        222;                                \
        padding:        5px 5px;                            \
    }                                                       \
" );

Taking care with how you mix ' and " quotes.

---

---

Also, since you are using GM_addStyle, add // @grant GM_addStyle to your script's metadata block so that the script continues to work with future versions of Greasemonkey and Scriptish.