console logging in google chrome - google-chrome

Question

I am writing a Google Chrome Extension and trying to make the transition to coding in HTML, CSS and Javascript from the kind of coding I did 40 years ago. It's a big learning curve but a little bit of console logging would help a lot. (Who remembers the green phosphor displays on the old iron-core memory Sperry Univacs? Now there was a console that could tell you what was going on - mount a tape, change a diskpack or put more paper in the printer.) But I digress.
Just a few days ago, I was able to send messages to the Google Chrome DOM Inspector console log from my content script or background page like this:
console.log="RECEIVED REQUEST FROM CONTENT SCRIPT PEEK.JS";
Later if I inspected the page where that code was injected, I would see that exact same message on the console. If that line executed four times, I would see four instances of that messages in sequence on the console. It was simple but beautiful.
Now, nothing appears on the console unless I type in "console.log" and in this case I see only the last instance of the message. What's the problem here? Did I toggle something off in the debugger? Am I writing the code wrong? Should it be: "console.log("Message Here");" - (this always returns an error) ?
I have spent literally hours trying to find the answer to this question and I can only surmise that the question is so simple that even a well-educated child could answer it. The alternative is to spend more hours trying to find my bugs thru implication or from alert messages. Better to spend my hours learning how to effectively use the inspector for debugging.
For example, yesterday after restructuring what was once working code so that it would pass an array to background from content instead of background requesting each item successively from content, the extension broke, as might be expected. The console displays one error message: "Error during tabs executeScript: Unknown error." with a link that says "chrome/ExtensionProcessBindings:95" on the far right of that same line. Obviously the error message is almost useless. Clicking on the link brings me to the resources panel which displays a blank frame to the right with the words "background.html" This appears to be useless as well.
How is this information at all helpful? It took me another six hours to figure out that I had moved a variable definition to another place in the code so that it was not defined at the time the executeScript line was executed. Had the error message said that a parameter was undefined in executeScript, I could have found it in about ten minutes.
So back to the original question - I WANT A SIMPLE ANSWER - don't tell me to write a function. I saw the console displaying what I wanted two days ago without writing any functions.

Answer 1

Here is your SIMPLE ANSWER: Instead of
console.log="RECEIVED REQUEST FROM CONTENT SCRIPT PEEK.JS";
You should use
console.log("RECEIVED REQUEST FROM CONTENT SCRIPT PEEK.JS");

Answer 2

For console.log():
https://developer.mozilla.org/en-US/docs/Web/API/console.log
I would recommend searching the Mozilla Developer Network for documentation on JavaScript and many browser technologies.
My general suggestion to help with mistyped or out of scoped variables is to use strict javascript:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/Strict_mode
This makes certain JavaScript idioms into errors which are detected earlier, and which give more helpful diagnostics. (The quick version is to put the single line "use strict"; at the top of your js files, or if that causes to many problems you can put it as the first line inside any function to do function-by-function migration.)
The reason why console.log = blah would show blah on the console in some situations is that in JS, <left side> = <right side expression> is an expression which evaluates to the same value as just <right side expression>, but it has the side affect of also assigning to <left side>. (This is similar to C assignment expressions.)
Then, in the context you were in, the console will display the result of any expression evaluation. This is different from explicitly calling console.log() which will display the arguments as the intended side effect of that function.
So in that case you were overwriting the standard console.log function with a string, and the entire expression evaluates to that string value, and the console's builtin behavior (not the console.log() function!) would display the result of your evaluation.
In JS most things are mutable, and you can overwrite all kinds of fields and variables, so be aware of this potential gotcha!
Also, a general recommendation for seeking help on the web:
For sites like StackOverflow is to limit your post to a very specific single question. This is because people with similar problems will come here based on web searches or other links, and they need to figure out if this page helps them with their particular problem quickly. If they have to read through paragraphs with multiple questions or anecdotes, this really slows them down. I would guess that's why this question has been downvoted.
If you have multiple questions, make separate posts. StackOverflow isn't a good site for anecdotes about your experience in the past. FWIW- I personally found your background as a programmer on 70's era machines interesting, but many readers may get lost in the details. Those kinds of anecdotes could make a good blog post.