Ok, so I need to find the source code of a particular javascript function on a website. (The specifics do not really matter unless there is no way to do what it is that I am asking)

I can see the function call in a link of html code onclick="inbox.sendMessage();"

I know that the function does work because if I use a plugin a can call the function on that page, however, I have searched every .js file is referenced in that page, and none of them contain a function called sendMessage.

What I am asking is, is there a way to follow the code back to the source, perhaps if there was a way to debug the html and break when the onclick is triggered and then step into the function to see its source, but I do not know how I can do that or if it is even possible. Any help will be greatly appreciated, Thanks.

Ok, so I need to find the source code of a particular javascript function on a website. (The specifics do not really matter unless there is no way to do what it is that I am asking)

I can see the function call in a link of html code onclick="inbox.sendMessage();"

I know that the function does work because if I use a plugin a can call the function on that page, however, I have searched every .js file is referenced in that page, and none of them contain a function called sendMessage.

What I am asking is, is there a way to follow the code back to the source, perhaps if there was a way to debug the html and break when the onclick is triggered and then step into the function to see its source, but I do not know how I can do that or if it is even possible. Any help will be greatly appreciated, Thanks.

• javascript
• debugging

• Try just searching for "sendMessage" – Colin Pear Commented Dec 24, 2012 at 2:14
• Possible duplicate of Find Javascript function definition in Chrome – Don Cheadle Commented Jul 7, 2016 at 19:47

4 Answers 4

I guess you could do :

inbox.sendMessage

In the webconsole. (the function name without the parenthesis)
It will print out the source code of the function.

I usually use Opera, and in that at least this is what I do:

1. Open Opera Dragonfly (Ctrl + Shift + I).
2. Click on the HTML tag with the onclick handler.
3. Go to the listeners tab in the right hand side column.
4. See the listener for the click event. It shows you the file and line number.

sendMessage could be declared as:

var inbox{
  sendMesssage:function(){
  }
}

//or

function inbox(){
  this.sendMessage=function(){
  }
}

// or

inbox.sendMessage=function(){}

// or ...

So looking for "sendMessage(" or "function sendMessage" will not find you anything.

In chrome, Internet Explorer and Firefox (with firebug) you can hit F12 and go to debug, there you can check the scripts that have been loaded as there might have been scripts loaded dynamically.

#!/usr/bin/env ruby


Dir::glob("*").each do |name| 

        lineCount = 1

        File.open(name, "r").each do |line|
            puts "\nFile name: " + name + "\nline: " + lineCount.to_s  if line =~ /inbox.sendMessage/  && name != "findfunction.rb"
            lineCount += 1
        end



end

Wrote a quick ruby script to help you out. To execute, first make sure you have a ruby interpreter on your machine then place the script in the directory with all your relevant files. load up a mand line terminal, navigate to said directory and type "ruby findfunction.rb".

It will tell you all instances (files + line number) of "inbox.sendMessage".