Chrome Dev Tool: watch variable not available(fails to detect in closure-scope)

Question

I run the snippets in chrome and watch the variables.
However, something puzzled me: the variables a,b,c are all declared in the closure scope, but a and b are not available. Please make clear why this happens?

The offcial Doc doesn't make it clear.

I make an assumption：“The variable in chrome's watch expression must be used in the local scope or it's declared in the global scope, otherwise it's not available even if it has been declared in closure scope”. It's the proposition correct?

Chrome version:60.0.3

The following is my code for you to test:

var globalV = 123;
;(function(){
var a = function(){}
var b = function(){a()}
var c = function(){b()}
var d = function(){
    debugger
    c()
  }
d()
})()

I think your assumption is correct. Not sure if the behavior is intended or it's a bug. — wOxxOm, Sep 05 '17 at 07:47

score 1 · Accepted Answer · answered Sep 05 '17 at 22:34

1

Looks like it may be a bug. I created an issue so that someone on the DevTools team will look at it: https://crbug.com/762265

answered Sep 05 '17 at 22:34

Kayce Basques

23,849
11
86
120

Well, I am interested in how you add `Threads` to the Sources panel of chrome dev tool? – Ye Shiqing Sep 06 '17 at 01:01
1

I think it shows up automatically when the page is using a web worker / service worker. – Kayce Basques Sep 06 '17 at 02:50

score 0 · Answer 2 · answered Apr 24 '18 at 09:33

To me it looks like a reasonable optimization - why include unused variables to a closure in runtime.

I mean, they could be included, but the interpreter/compiler is to include only the used ones - and the debugger uses the same principle.

For example, in C# (.NET Core 2.0) it works the same way:

Chrome Dev Tool: watch variable not available(fails to detect in closure-scope)

2 Answers2