In Google Docs, you can click on the menu items and then choose an action. For example, you can click on the "Format" menu item, then click "Align" > "Left" to align text left. Is there a way to see what code runs when you do that?

  • You mean if Google Docs is open source? No, it is not. Commented Oct 28, 2013 at 8:44
  • Kind of. But, not the entire thing, just those menus at top. I'd like to see the code or record what's happening if anything is client-side.
    – jaredcohe
    Commented Oct 28, 2013 at 11:05
  • You could always try to debug it with Chrome's Javascript debugger, but I very much doubt it would give you anything. Most of what's happening is going on on the server side. Commented Oct 28, 2013 at 11:27

1 Answer 1

  • Load the page in Chrome
  • Choose Tools->Developer Tools to bring up the developer pane. (This is a whole tutorial in itself, but I will tell you how to do the specific thing you want).
  • Right click on the body element in the Elements tab and choose "Break -> on subtree modification". This is just a guess, but its a good place to start. I'm guessing Google will modify the DOM when you click things. Now when you move the mouse around, your breakpoint might fire prematurely for what you are looking at. Just hit F8 to continue.

Chrome developer tools

  • Hit the {} button at the bottom when it breaks to make the google optimized javascript code "pretty print" or display in a more readable form.

more dev tools in chrome

  • Now, basically, its up to you to figure out what you want to do and where you want to go. You need to familiarize yourself with developer tools to really have the full power you need to do what you want probably, but that's a whole book.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.