I have a function which is being called from several files. Is there a way to determine from which file a function is being invoked by tools like Chrome DevTools?

function turnCoffeIntoCode (args) {
    // logic here
    debugger;
}

With the above, I can see the arguments being passed to the functions thanks to Chrome's developer tools but I cannot find from where the function is being called.

I have a function which is being called from several files. Is there a way to determine from which file a function is being invoked by tools like Chrome DevTools?

function turnCoffeIntoCode (args) {
    // logic here
    debugger;
}

With the above, I can see the arguments being passed to the functions thanks to Chrome's developer tools but I cannot find from where the function is being called.

• javascript
• google-chrome
• debugging
• javascript-debugger

Share Improve this question Follow edited Aug 28, 2020 at 7:13 Matthew Barbara asked Oct 9, 2017 at 10:10 Matthew BarbaraMatthew Barbara 3,97222 gold badges2323 silver badges3434 bronze badges 5

• 5 When debugger is paused, check out the function call stack. – abhishekkannojia Commented Oct 9, 2017 at 10:12
• Thanks for this! would you like to answer my question since I could not find my answer and question on stack overflow? – Matthew Barbara Commented Oct 9, 2017 at 10:16
• Instead of debugger, try try { throw new Error('dummy'); } catch(ex) { console.log(ex.stacktrace) } – Rajesh Commented Oct 9, 2017 at 10:16
• Yes, Abhishek is right. You can check using call stack by selecting sources from DevTools or you can use console.trace(). For more details use this link developer.mozilla/en-US/docs/Web/API/Console/trace – Swanand Taware Commented Oct 9, 2017 at 10:19
• @MatthewBarbara Amr Elgarhy has answered already. You can accept that. – abhishekkannojia Commented Oct 9, 2017 at 10:21

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 3

You can see the full call stack on the Chrome Developer Tools: https://developers.google./web/tools/chrome-devtools/javascript/reference#call-stack

Just add a break point or a debugger; and you will be able to see the call stack and will be able to click and go to different functions in the stack.

And to read more, you can find many questions and answers about the call stack in chrome.