Search code examples
javascriptjquerydeveloper-tools

How can I tell if a JS function is being called somewhere?

I've adopted a Drupal site that has a lot going on as far as Javascript is concerned. There are many separate files, both libraries and custom code.

I'm trying to get the ScrollDepth analytics plugin working and I see that the jquery.scrolldepth.min.js file is being loaded but I can't actually tell if the function is being called somewhere. This is making it difficult to diagnose why it isn't working.

Is there a way, using developer tools or otherwise, to tell if jQuery.scrollDepth() is actually being called?

Solution

  • Depending on the editor you're using, you can do a global search for a line in the files in whatever directory. For example, in Sublime Text, you can do CMD + SHIFT + F and enter your search query for jQuery.scrollDepth().

    In Chrome, you can set breakpoints to step through your scripts, but if you're not getting errors, you'll be stumbling through the source blind until you find something. Compared to that, I think the global search approach may be more efficient in your case.

    You can also combine the two approaches... Look for where it's being called in the source, and then find that relevant line in Chrome sources and set a breakpoint. Or, better yet, if your scripts are all concatenated, just open the Sources tab in developer tools and hit CMD + F to search for that line.