Search code examples
javascriptgoogle-chrome-devtoolsgoogle-chrome-console

Debugging a script added via Chrome Console


I am adding some JavaScripts via Chrome's devtools' console by simply just pasting a set of code. There is no way to open that code on the Sources panel so I can debug using breakpoints. Is there a proper way to open the code on the Sources panel that was added via console?

Any other ways than adding debugger; along with the code. Or a syntax error, which then shows me the file name on the right side, which opens the code in a tab in the Sources panel. Attached the two scenerios on the screenshot attached.

enter image description here


Solution

  • Open the devtool and open the Sources tab. Click on the Snippets tab on create a new snippet. Write yout code in the snippet. Then right click on the snippet created and click run !! You should be able to debug from here ;)