Question

Does a tool exist for dynamically altering running javascript in a browser? For example, to change the values of javascript variables during runtime.

Was it helpful?

Solution

Firebug , or Venkman Javascript Debugger .

OTHER TIPS

So, Firebug really is one of the best options - or, if you are a developer that owns Visual Studio and want to debug using IE, you can do that. Let's assume you will do this with Firebug using Firefox.

First, determine where you want to alter the code and place the following line just before the line you want to start messing with:

debugger;

That will cause Firebug to stop the execution of the script at that point, at which point you can then step through the code and alter the values of variables.

You can also use Firebug to place breakpoints in by clicking to the left of a line of code in the script window of Firebug:

Firebug Breakpoint Screenshot

Look into the javascript shell here. It is like a debugger in your browser. You can run/alter any javascript function on the active document object.

Very nifty for debugging/handling other peoples javascript, on sites where you do not have access to the source/server.

Did I mention it has tab-completion? it's awesome.

Opera 9 comes now bundled with Dragonfly (FireBug equivalent), and I've understood that it, too, can edit JavaScript on the fly. It's at least a feature to come, if they haven't had the time to include it, anyhow.

Have a look at Firebug

As mentioned by others, Firebug allows you to set breakpoints in your JavaScript (although I haven't had great success with hitting breakpoints when my JavaScript is IN an HTML document as opposed to an external file) which will interrupt the execution of a function during runtime.

It also allows you to view the DOM objects and all of the properties (which includes your JavaScript variables).

There is also a Lite version of Firebug that will work in non-Firefox browsers.

Mozdev has a tool called MozREPL. Not only can you alter and redefine the code on the fly, but you can get access to the underlying browser code as well. It's really cool.

It opens up a port on yoru computer amnmd allwos you to attach a telnet session (from local host only) to it to start executing code. You can also open that port up to connections that are not from localhost.... (but beware, that is pretty insecure and dangerous, etc. etc.).

It comes with an emacs minor mode that lets you send various regions of text right to mozdev, and provides a very nice interaction mode. I've further expanded it to set Firebug breakpoints right from emacs, and launch selenium tests. Basically I can script my browser from my editor. Its pretty cool. At some point soon I am going to release the source code.

JavaScript has an eval() function, you can build your string and then run it.

<script type="text/javascript" language="javascript">
  example = function() {alert('first');}
  example();
  eval("example = function() {alert('second');}");
  example();
</script>

The code above is an example of how eval can be used to change existing code.

@eyelidlessness, this shows that you can change existing code. Your edit to the question clarifies the original question, but therefore make my answer look invalild, but at the time it was originally posted it was a valid point, the original poster should have made the question clearer.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top