Force non overlay scrollbar in Devtools/Performance for Aura Overlay Scrollbar

Force non overlay scrollbar in Devtools/Performance for Aura Overlay Scrollbar

Since Aura overlay Scrollbar will make the v-scrollbar disappear in
DevTools/Performance. In this patch we modify the DevTools/Performance
v-scrollbar to custom scrollbar when detected Aura Overlay Scrollbar
enabled. For detecting Aura Overlay Scrollbar, we also add
overlayScrollbarEnabled in UI.installComponentRootStyles and add
overlay-scrollbar-enabled class to document body.

BUG=667455
Review-Url: https://codereview.chromium.org/2891383002
Cr-Commit-Position: refs/heads/master@{#474150}
Committed: https://chromium.googlesource.com/chromium/src/+/0feb73390c78b48c59b47bbf3870a6d897dddcd0

[chaopeng, 2017-05-19 15:16:31]

chaopeng@chromium.org changed reviewers:
+ alph@chromium.org

[chaopeng, 2017-05-19 15:16:32]

PTAL. Thank you.

[alph, 2017-05-22 18:50:09]

Thank you!

https://codereview.chromium.org/2891383002/diff/1/third_party/WebKit/Source/d...
File third_party/WebKit/Source/devtools/front_end/emulation/AdvancedApp.js
(right):

https://codereview.chromium.org/2891383002/diff/1/third_party/WebKit/Source/d...
third_party/WebKit/Source/devtools/front_end/emulation/AdvancedApp.js:74:
UI.installComponentRootStyles(toolboxDocument, /** @type {!Element} */
(toolboxDocument.body));
You don't need a document. Please check how we do the same trick in
UI.measurePreferredSize

https://codereview.chromium.org/2891383002/diff/1/third_party/WebKit/Source/d...
File third_party/WebKit/Source/devtools/front_end/perf_ui/flameChart.css
(right):

https://codereview.chromium.org/2891383002/diff/1/third_party/WebKit/Source/d...
third_party/WebKit/Source/devtools/front_end/perf_ui/flameChart.css:75:
border-radius: 0px;
not needed?

https://codereview.chromium.org/2891383002/diff/1/third_party/WebKit/Source/d...
File third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js (right):

https://codereview.chromium.org/2891383002/diff/1/third_party/WebKit/Source/d...
third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js:674: if
(!Host.isMac() && overlayScrollbarEnabled(document))
Can we do it for Mac as well, because on it is possible to get non-overlay
scrollbars there as well.

https://codereview.chromium.org/2891383002/diff/1/third_party/WebKit/Source/d...
third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js:684: function
overlayScrollbarEnabled(document) {
Please move the function inside the UI.installComponentRootStyles to not pollute
the global namespace.

https://codereview.chromium.org/2891383002/diff/1/third_party/WebKit/Source/d...
third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js:685: let scrollDiv =
document.createElement('div');
We do not use 'let' in DevTools yet.

https://codereview.chromium.org/2891383002/diff/1/third_party/WebKit/Source/d...
third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js:690: 
please remove extra empty lines.

[chaopeng, 2017-05-23 17:26:40]

Updated. PTAL. Thank you.

https://codereview.chromium.org/2891383002/diff/1/third_party/WebKit/Source/d...
File third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js (right):

https://codereview.chromium.org/2891383002/diff/1/third_party/WebKit/Source/d...
third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js:674: if
(!Host.isMac() && overlayScrollbarEnabled(document))
On 2017/05/22 18:50:08, alph wrote:
> Can we do it for Mac as well, because on it is possible to get non-overlay
> scrollbars there as well.

No, for aura-overlay-scrollbar, we must restart chrome to apply the style
change. For mac, we can just change the scrollbar style on system settings then
refresh the page to apply. The scrollbar will disappear when user already open
devtools then change setting. It need reopen devtools to show the scrollbar.

[alph, 2017-05-23 22:36:19]

Thank you, lgtm

[chaopeng, 2017-05-23 23:39:17]

The CQ bit was checked by chaopeng@chromium.org

[commit-bot: I haz the power, 2017-05-23 23:41:54]

CQ is trying da patch.

Follow status at:
https://chromium-cq-status.appspot.com/v2/patch-status/codereview.chromium.or...

[commit-bot: I haz the power, 2017-05-24 03:41:20]

CQ is committing da patch.

Bot data: {"patchset_id": 20001, "attempt_start_ts": 1495582757387010,
"parent_rev": "3f97f5b6fbd2a371112720b95fc8153c8c457804", "commit_rev":
"0feb73390c78b48c59b47bbf3870a6d897dddcd0"}

[commit-bot: I haz the power, 2017-05-24 03:41:31]

Description was changed from

==========
Force non overlay scrollbar in Devtools/Performance for Aura Overlay Scrollbar

Since Aura overlay Scrollbar will make the v-scrollbar disappear in
DevTools/Performance. In this patch we modify the DevTools/Performance
v-scrollbar to custom scrollbar when detected Aura Overlay Scrollbar
enabled. For detecting Aura Overlay Scrollbar, we also add
overlayScrollbarEnabled in UI.installComponentRootStyles and add
overlay-scrollbar-enabled class to document body.

BUG=667455
==========

to

==========
Force non overlay scrollbar in Devtools/Performance for Aura Overlay Scrollbar

Since Aura overlay Scrollbar will make the v-scrollbar disappear in
DevTools/Performance. In this patch we modify the DevTools/Performance
v-scrollbar to custom scrollbar when detected Aura Overlay Scrollbar
enabled. For detecting Aura Overlay Scrollbar, we also add
overlayScrollbarEnabled in UI.installComponentRootStyles and add
overlay-scrollbar-enabled class to document body.

BUG=667455

Review-Url: https://codereview.chromium.org/2891383002
Cr-Commit-Position: refs/heads/master@{#474150}
Committed:
https://chromium.googlesource.com/chromium/src/+/0feb73390c78b48c59b47bbf3870...
==========

[commit-bot: I haz the power, 2017-05-24 03:41:32]

Committed patchset #2 (id:20001) as
https://chromium.googlesource.com/chromium/src/+/0feb73390c78b48c59b47bbf3870...