Search code examples
javascripthtmldebuggingdeveloper-tools

Discovery JavaScript execution path and files in Browser Developer Tools

I'm sure this must be a burden to other people too...

Say I am debugging a website, and there is an element on the site that when clicked calls a particular function; for example:

<img src="foo.png" onclick="javascript:Bar();" />

But I have no idea where Bar is declared in terms of the file structure. It could be coming from an external source or could be in the website solution.

Are there any tools that can be added into the browser (i.e. a FireFox extension) that can assist with this?

I'd sort of like something that when I click something that fires some javascript, breaks the execution and shows me where the execution was going to occur

Solution

  • You can use Firebug (FF add-on) Open Firebug (press F12), Open Script tab and use search field.enter image description here