1459929 - Unable to inspect webconsole, netmonitor or application panel when expanding the MarkupView

Status: RESOLVED DUPLICATE of bug 1460223

(DevTools :: Inspector, defect, P3)

Description

[Julian Descottes [:jdescottes]]

Attachment: empty-node-browser-toolbox.png

Note: You _can_ inspect those panels, the issue occurs when following precise STRs. See below:

- open devtools
- select netmonitor
- open browser toolbox (BT)
- in BT: select inspector
- walk your way through the netmonitor iframe (#toolbox-panel-iframe-netmonitor) in the markup view  
- expand document inside the iframe
- expand the html node inside the document

ER: html node has children
AR: html node seems empty

Note1: Cannot use the filter or the element picker as a shortcut, it will prevent the issue from happening
Note2: This only seems to happen if the panel is the first one you inspect. If you first inspect, say Webconsole, using the element picker, and then use the STRs above to explore netmonitor, the netmonitor markup will show up

The logs show 

    console.error: (new SyntaxError("JSON.parse: unexpected character at line 1 column 2 of the JSON data", "chrome://devtools/content/framework/toolbox-process-window.js", 233))
    console.error: ({})
    get displayType@resource://devtools/shared/base-loader.js -> resource://devtools/server/actors/inspector/node.js:253:5
    initialize@resource://devtools/shared/base-loader.js -> resource://devtools/server/actors/inspector/node.js:47:5
    cls@resource://devtools/shared/base-loader.js -> resource://devtools/shared/protocol.js:1206:5
    _ref@resource://devtools/shared/base-loader.js -> resource://devtools/server/actors/inspector/walker.js:299:13
    _readForward@resource://devtools/shared/base-loader.js -> resource://devtools/server/actors/inspector/walker.js:780:18
    children@resource://devtools/shared/base-loader.js -> resource://devtools/server/actors/inspector/walker.js:680:28
    handler@resource://devtools/shared/base-loader.js -> resource://devtools/shared/protocol.js:1141:19
    onPacket@resource://devtools/shared/base-loader.js -> resource://devtools/server/main.js:1761:15
    _onJSONObjectReady/<@resource://devtools/shared/base-loader.js -> resource://devtools/shared/transport/transport.js:472:11
    exports.makeInfallible/<@resource://devtools/shared/base-loader.js -> resource://devtools/shared/ThreadSafeDevToolsUtils.js:109:14
    exports.makeInfallible/<@resource://devtools/shared/base-loader.js -> resource://devtools/shared/ThreadSafeDevToolsUtils.js:109:14
    console.error: "unknownError"

Comment 1

[Julian Descottes [:jdescottes]]

It seems that for some elements, reading this.computedStyle.display throws. For the webconsole, this happens on scrollbar elements, but also on a div, not sure what is the differentiating factor.

Try/catching around reading this.computedStyle.display in NodeActor's `get displayType()` and `get isDisplayed()` seems to workaround the issue, but it would be great to identify why this property can't be queried for some elements.

In the scope of a NodeActor, this.computedStyle is generated via   

  CssLogic.getComputedStyle = function(node) {
    // ...
    let {bindingElement, pseudo} = CssLogic.getBindingElementAndPseudo(node);
    return node.ownerGlobal.getComputedStyle(bindingElement, pseudo);
  }

The computed style is not null, but accessing the display property just throws (other properties are fine though)

Comment 2

[Julian Descottes [:jdescottes]]

I think this should be fixed by Bug 1460223, which more or less implemented what I outlined in comment 1