I am extending Google Chrome with the "chrome.devtools.panels.create" API, it means that I have now some logic in my browser by which I need to debug.
Is there anyway to see the Console log / Debug my DevTools additions?
To open the developer console in Google Chrome, open the Chrome Menu in the upper-right-hand corner of the browser window and select More Tools > Developer Tools. You can also use Option + ⌘ + J (on macOS), or Shift + CTRL + J (on Windows/Linux).
The shortcut for most browsers on Mac is Alt + Command + I , for Windows you can use Ctrl + Shift + I . The developer tools console in Chrome. Once you have the developer tools open you can switch to the console by clicking the Console tab at the top of the window. The 'Elements' tab with a console pane at the bottom.
Steps to Open the Console Log in Google ChromeBy default, the Inspect will open the "Elements" tab in the Developer Tools. Click on the "Console" tab which is to the right of "Elements". Now you can see the Console and any output that has been written to the Console log.
If all you need is console.log
you can wrap it up. Actually it works for any other function, not just console.log
but here's example for wrapping console.log
:
console._log = console.log;
console.log = function(){
// you can do whatever you want with arguments, output to div, alert / etc.
return console._log.apply(console,arguments);
};
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With