how to reload only scripts through firebug

Question

I'm doing lot of ajax stuff lately. Scenario that I repeat over and over is:

1. load page
2. change some scripts for that page
3. reload page with ctrl+f5 and see if it works

What I want to do, is tell firebug to reload only the scripts not the whole page because the markup is the same. Anyway to do this?

Answer 1

First, try and minimize this kind of testing. Write atomic, DRY code, and unit test before folding it into the site/page.   You can do some of this quickly in Firebug's console.

Next, if the JS that you are reloading sets intervals or event listeners, then you will want to clear those intervals and unbind those listeners before reloading the JS under test. That means that anonymous intervals and event handlers are forbidden.

Create a JS file that calls clearInterval(), removeEventListener(), and .unbind() as necessary.

Then you can run code like this in Firebug's console:

function addJS_Node (text, s_URL)
{
    var scriptNode                      = document.createElement ('script');
    scriptNode.type                     = "text/javascript";

    if (text)  scriptNode.textContent   = text;
    if (s_URL) scriptNode.src           = s_URL;

    document.head.appendChild (scriptNode);
}

addJS_Node (null, 'Path_to_JS/ResetTimersAndEvents.js');

addJS_Node (null, 'Path_to_JS/JS_Under_Test.js');
// etc.