In Google Docs, is it possible to view the code that runs when you click on an action?

Question

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?

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.

• 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.

• 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.