How to Open and Use Microsoft Edge Console


As a developer to test a webpage on Edge Browser, you would need to make use of the Microsoft Edge console devTool to achieve the following,

  • To see console logs of a webpage to identify problems in your code.
  • To see and debug console log messages related to connectivity and JavaScript.
  • To run JavaScript functions and expressions.
  • To make use of the rich command line interface that lets you do powerful stuff to make web project development easy .

How to Open Microsoft Edge Developer Console

  1. Be on the webpage you want to see the Developer Console on,
  2. Right-Click and Select Inspect,
    Microsoft Edge Inspect Option
  3. Now you would see Tabs at the top where you should see console if not click on the >> to select it from the drop-down.
    Select Console on Microsoft Edge
  4. You can move to any tab and refresh the page to reload the console logs for that page.


Keyboard shortcut to open Console

Windows: Control + Shift + J
MacOS: Command + Option + J


Edge Console JavaScript REPL (Read-Eval-Print Loop) Examples

The Console is very powerful, it can evaluate your JavaScript expressions using REPL and print out the result on the console in real-time. Let us take a look at some examples,

Microsoft Edge Console JavaScript REPL Examples

Example 1: Calculations

We just tried adding 100+250 and before you prompt enter, in real-time you see the result 350.

Example 2: JavaScript Expression

document.getElementById("heading') returned the tag where Id is heading on the page. This is really very powerful as you can even call functions and change the code dynamically to test your functionality.

Example 3: JavaScript Expression returning an Object

In the third example, we see that we have printed an Object using JavaScript, this is really handy when you want to inspect the content of an Object in code construct.

Read More: https://learn.microsoft.com/en-us/microsoft-edge/devtools-guide-chromium/console/

-


Have Questions? Post them here!

Topics Coverage:


🎉 We are celebrating the 10th years of Code2care! Thank you for all your support!

We strongly support Gender Equality & Diversity.

Follow Us: GitHub | Facebook | Twitter | Instagram