How does Chrome executes scripts inside Developer Tool

Recently, working with Chrome Developer Tool, I found strange thing, which at first was interpreted by me as a bug.

I wrote some code with pair of opening-closing brackets, like this “}{“ and I tried to execute it. Surprisingly, but it does not produce me any error. I was amazed…

I tried to execute another examples:

Okay, it seems fantastic, because it’s not valid JavaScript expression. Let’s look deeper. I’ve put “console.trace()” in executed expressions and tried to figure out how it works:

Now we can go through every stack trace item. First, “(anonymous function) @ VM336:2”. This call on the top of the stack trace that has following code:

As we can see, Chrome wraps executed script. He does it because:

Only install command line api object for the time of evaluation. Surround the expression in with statements to inject our command line API so that the window object properties still take more precedent than our API functions.

Wrapping occurs on the next function call of the stack trace — on “InjectedScript._evaluateOn @ VM118:895”.

If we will take a look on the last two functions, we’ll find that they do “wrapping-result-exceptions” operations:

After it we can a little better understand what happening inside this useful and necessary in development process tool.

Like what you read? Give Alex Saskevich a round of applause.

From a quick cheer to a standing ovation, clap to show how much you enjoyed this story.