1399909 - Prevent markupview resize during inspector startup

Status: RESOLVED FIXED

(DevTools :: Inspector, enhancement, P3)

Description

[Alexandre Poirot [:ochameau]]

Today, the inspector load is still a bit clunky.
Things blink, resizes, ...

The left panel of the inspector, containing its tabbar, the markup view and the breadcrumb starts loading with full panel width. Then, once the rule view (or any other sidebar tool) is ready, it is resized.
We should prevent that to make the inspector load more natural.

After this patch:
* various parts of the inspector still load in parallel.
  We may try to display more things at once.
  Like waiting for markup view and rule view to be ready before displaying things?
* the sidebar toggle button is still loaded very late and blinks
* we briefly see toolbox background sometimes, that introduces a blink effect.

Comment 1

[Alexandre Poirot [:ochameau]]

Attachment: Bug 1399909 - Prevent the inspector resizing its left pane during load.

Today, inspector startup is clunky and is made is many steps
in which the left pane with the markup view is loaded full width
before the rule view is opened. It blinks and resize things.

* display the left pane (inspector-main-content) only when the size of panels
  is set by the splitter.
* fix markupbox hidding while loading as "collapsed" wasn't working
* setup the splitter with the right size immediately
* prevent unnecessary renders in split-box

Review commit: https://reviewboard.mozilla.org/r/179868/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/179868/

Comment 2

[Gabriel Luong [:gl] (ΦωΦ)]

Just a note the sidebar toggle button is suppose to go away with the photon redesign in Bug 1396349. It was deemed too big of a change for 57 and will probably land afterwards.

Comment 3

[Alexandre Poirot [:ochameau]]

Oh cool! Can't wait to be on 58 then!

Comment 4

[Gabriel Luong [:gl] (ΦωΦ)]

Comment on attachment 8908204 [details]
Bug 1399909 - Prevent the inspector resizing its left pane during load.

https://reviewboard.mozilla.org/r/179868/#review185096

::: devtools/client/shared/components/splitter/split-box.js:66
(Diff revision 1)
>        vert: this.props.vert,
>        width: this.props.initialWidth || this.props.initialSize,
>        height: this.props.initialHeight || this.props.initialSize
>      };
>    },
>  

This should be moved after componentWillReceiveProps to make it flow with the natural React component lifecycle.

Comment 5

[Alexandre Poirot [:ochameau]]

Comment on attachment 8908204 [details]
Bug 1399909 - Prevent the inspector resizing its left pane during load.

Review request updated; see interdiff: https://reviewboard.mozilla.org/r/179868/diff/1-2/

Comment 6

[Alexandre Poirot [:ochameau]]

Can't land because of this test failure:
[task 2017-09-15T07:35:31.773783Z] 07:35:31    ERROR -  60 INFO TEST-UNEXPECTED-FAIL | devtools/client/netmonitor/test/browser_net_accessibility-01.js | The selected item in the requests menu was incorrect. - Got -1, expected 1

Would it be because of split-box change??

Comment 7

[Alexandre Poirot [:ochameau]]

Comment on attachment 8908204 [details]
Bug 1399909 - Prevent the inspector resizing its left pane during load.

Review request updated; see interdiff: https://reviewboard.mozilla.org/r/179868/diff/2-3/

Comment 8

[Alexandre Poirot [:ochameau]]

It was the modification made to split-box.js
I thought props would not change, but it does for this netmonitor test...

Does shouldComponentUpdate still look good?

Comment 9

[Gabriel Luong [:gl] (ΦωΦ)]

(In reply to Alexandre Poirot [:ochameau] from comment #8)
> It was the modification made to split-box.js
> I thought props would not change, but it does for this netmonitor test...
> 
> Does shouldComponentUpdate still look good?

Looks good.

Comment 10

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/930533fdd67d
Prevent the inspector resizing its left pane during load. r=gl

Comment 11

[Wes Kocher (:KWierso) (Not reading bugmail; email directly if needed)]

https://hg.mozilla.org/mozilla-central/rev/930533fdd67d