javascript - When I typed console.log to my browser, why does Google Chrome not showing me the result?

Question

I'm a blind learner. I want to test an expression like

console.log(1 + 2);

function myFunction() {
  var a = 1 + 2;
}
console.log(myFunction());

question from:https://stackoverflow.com/questions/65909202/when-i-typed-console-log-to-my-browser-why-does-google-chrome-not-showing-me-th

Answer 1

Navigating and using developer tools is difficult at first with a screen reader, but it doesn't take long to get used to it.

First, have a read of this document from Google on devtools shortcuts you will find there are loads of shortcuts that you can use. This makes it easy to get used to navigating the console.

How to navigate in your example.

What is confusing when you are not used to it is that the text that is logged to the console is attached to the line and character declaration (so for example it may read "VM50:1 3", explained below)

So in your example above you navigate to the previous item (shift + Tab) to get undefined as that is still what console.log(1+2) will return.

Then if you press the Up arrow it will focus a link and announce "link vm50:1 3" where "link vm50:1" is line and character number and "3" is the answer.

An easier way to understand this is to log some words to the console instead, if you log "I like cheese, it is yummy" you will get something like "VM50:1 I like cheese, it is yummy"

One thing that can be confusing is when you get an error that results in a stack trace (as we are reading from the bottom to the top). For that I tend to spam the up arrow until I don't hear "at" and get a script name as that will announce the error as well.

Finally try navigating via links (Shift + K in NVDA) as that can also be a quick way to get to errors (although can be confusing if you get a stack trace as above).