0

I have a large existing web app with a lot of javascript that I didn't write.

On this web app, a user action is performed in the browser (clicking on a link).

I need to see which variable(s) change(s) on click.

Using the watch pane in sources in the dev tools is not effective, because there are thousands of variables and I need to find the one that changes. I do not want to view all variables, only the one that changes. The script is very large and complex, following the event listener might not be feasible.

Blake
  • 1

1 Answers1

1

If you use Google Chrome, you can use the devtools, go to the Sources panel. Then if you look at the right side, you will see a column with "Watch", "Call Stack", etc... Expand the "Event Listener Breakpoints" part, then the "Mouse" category, and tick the "Click" checkbox.

Now Chrome will break (start a debugging session) at the click listener. You can now go step by step to see all the variables modifications, and their values.

Seblor
  • 6,947
  • 1
  • 25
  • 46
  • Thanks, Seblor; appreciate your time on this Tuesday. The thing is that this "script" is really large, like operating-system-large. If I go step by step through the calls, it might take forever. Is there any way just to see the variables that changed? – Blake Feb 19 '19 at 09:45
  • I don't think this is possible, sorry. Apparently, there is no way to get all the variables in the scope (https://stackoverflow.com/questions/2051678/getting-all-variables-in-scope) so you cannot proxy them all. Are you trying to read through a bundled script ? – Seblor Feb 19 '19 at 09:50