1719427 - Use system scrollbars or update scrollbar to Windows 11 style

Status: VERIFIED FIXED

(Core :: Widget: Win32, enhancement, P1)

Description

[Maicol Battistini]

Attachment: Windows 10 scrollbars on firefox

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:90.0) Gecko/20100101 Firefox/90.0

Actual results:

System scrollbars are Windows 10 ones, while I am on Windows 11. Check first screenshot

Expected results:

Firefox uses system scrollbars, so the new ones that come with Windows 11 (check second screenshot) or style them like the new ones

Comment 1

[Maicol Battistini]

Attachment: New windows 11 scrollbars

Comment 2

[BugBot [:suhaib / :marco/ :calixte]]

The Bugbug bot thinks this bug should belong to the 'Core::Widget: Win32' component, and is moving the bug to that component. Please revert this change in case you think the bot is wrong.

Comment 3

[David Parks [:handyman]]

Attachment: Screenshot of Win11 apps.png

Attaching a screen shot showing various applications in Windows 11 (10.0.22000.168) that have various scroll bars. Clockwise from top-left they are:

1. A recent nightly build of Firefox
2. Edge, whose scrollbars look just like Firefox's
3. Wordpad, which has the thin scroll bar shown by the reporter
4. Windows Explorer, whose scrollbar looks like FF and Edge's except that it's a bit narrower.
5. Windows Store, whose scrollbar looks like Wordpad's except that it vanishes after a bit when not moused over (Wordpad does not do that)
6. The Firefox console window that has the same style as Firefox.

I basically opened six windows and got six different scrollbars. There is no consistency (at this point at least) so the issue seems minor and is indistinguishable to the casual user.

Comment 4

[Kagami Rosylight [:saschanaz] (they/them)]

Hmm, on 10.0.22000.176 all of your examples except browsers show the same scrollbar style as in your wordpad example.

Comment 5

[Kagami Rosylight [:saschanaz] (they/them)]

Firefox 70, which was still using native theme on Windows, also shows the new Windows 11 scrollbar style.

Comment 6

[Maicol Battistini]

Attachment: New edge scrollbars

New scrollbar style on Edge Canary

Comment 7

[Maicol Battistini]

Attachment: New edge scrollbars on hover

When hovering the scrollbars it become a bit toughier and arrows appear at the top and the bottom of the scrollbars section

Comment 8

[David Parks [:handyman]]

Attachment: Chrome, Edge and Firefox

Both Edge and Chrome are expected to get overlay scrollbars soon but there is no fixed timeline. They both have the option to enable them now behind an experimental pref (similar steps to enable on Chrome). In the attached image, Chrome and Edge have overlayed scrollbars active. They look a bit different and the Chrome scrollbar is not always visible, unlike Edge, but they are definitely similar, unlike Firefox.

I'm not sure why Maicol's scrollbars look like that but I don't think they should. I don't think scroll bars are supposed to be able to get into that state without the setting, so few people would see it before then. (Randomly, the Edge settings page has overlayed scrollbars regardless.)

Comment 9

[Maicol Battistini]

@David if you mean the latest screenshot about Edge I've screenshotted the window while I was hovering the Edge scrollbars. If you mean the second attachment it's another app (just an example of the new scrollbars)

Comment 10

[David Parks [:handyman]]

Thanks Maicol. I'm not clear on why your Edge scrollbars are overlapped without changing the setting but I don't think that's expected. Users, at this point, should have to change the setting to see overlapped scrollbars.

Comment 11

[Maicol Battistini]

Oh, yes. I've enabled the flag to show the scrollbars. Anyway, we're waiting news on this update for Firefox

Comment 13

[Andrew]

It looks like Firefox's popups use the system scrollbars correctly. Is there any reason why the other scrollbars aren't following the same theme?

Comment 14

[Emilio Cobos Álvarez (:emilio)]

Yes, we don't want call into Win32 apis from the content process for sandboxing reasons.

Comment 15

[Andrew]

Ohhh. That makes more sense. Scrollbars from the content process, then, are xml themed to mimic the scrollbar from the Win32 apis?

Comment 16

[Kagami Rosylight [:saschanaz] (they/them)]

Just curious, which popup uses system scrollbars?

Comment 17

[Andrew]

I've noticed the system scrollbars in the hamburger menu (https://bug1736664.bmoattachments.org/attachment.cgi?id=9246693) and the library menu.

Comment 18

[Stephen A Pohl [:spohl]]

Attachment: Bug 1719427: Refactor scrollbar drawing code across platforms. r=emilio,mstange

Comment 19

[Stephen A Pohl [:spohl]]

Attachment: Bug 1719427: Add ability to switch between scrollbar implementations via prefs. r=emilio,mstange

Comment 20

[Stephen A Pohl [:spohl]]

Attachment: Bug 1719427: Move scrollbar size information from prefs to C++ and allow sizing to be overridden via prefs. r=emilio,mstange

Depends on D130215

Comment 21

[Stephen A Pohl [:spohl]]

Attachment: Bug 1719427: Fix scrollbar tests. r=emilio,mstange

Depends on D130671

Comment 22

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/e32004dd2014
Refactor scrollbar drawing code across platforms. r=emilio
https://hg.mozilla.org/integration/autoland/rev/8c5bb08f80e9
Add ability to switch between scrollbar implementations via prefs. r=emilio
https://hg.mozilla.org/integration/autoland/rev/4df7017f6bc9
Move scrollbar size information from prefs to C++ and allow sizing to be overridden via prefs. r=emilio
https://hg.mozilla.org/integration/autoland/rev/d6948ef7f495
Fix scrollbar tests. r=emilio

Comment 23

[Cristina Cozmuta (:CrissCozmuta)]

Backed out for causing build bustages. CLOSED TREE

Backout link : https://hg.mozilla.org/integration/autoland/rev/3def6c8dabbdd75a71eab45c88567c7a9f52fa43

Push with failures: https://treeherder.mozilla.org/jobs?repo=autoland&resultStatus=testfailed%2Cbusted%2Cexception%2Crunnable&revision=d6948ef7f495766b969bc04ceb6906ca76944d44

Linkt o failure log : https://treeherder.mozilla.org/logviewer?job_id=358056175&repo=autoland&lineNumber=32920

Comment 24

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/81e93448c871
Refactor scrollbar drawing code across platforms. r=emilio
https://hg.mozilla.org/integration/autoland/rev/ffd6665288fe
Add ability to switch between scrollbar implementations via prefs. r=emilio
https://hg.mozilla.org/integration/autoland/rev/3e67bbae3c92
Move scrollbar size information from prefs to C++ and allow sizing to be overridden via prefs. r=emilio
https://hg.mozilla.org/integration/autoland/rev/ef94ce8ed301
Fix scrollbar tests. r=emilio

Comment 25

[Marian-Vasile Laza]

https://hg.mozilla.org/mozilla-central/rev/81e93448c871
https://hg.mozilla.org/mozilla-central/rev/ffd6665288fe
https://hg.mozilla.org/mozilla-central/rev/3e67bbae3c92
https://hg.mozilla.org/mozilla-central/rev/ef94ce8ed301

Comment 26

[Stephen A Pohl [:spohl]]

Attachment: Bug 1719427: Add non-native implementation of Windows 11 scrollbars. r=emilio

Comment 27

[Alexandru Ionescu (needinfo me) [:alexandrui]]

:spohl your patches caused an improvement on macosx but I see that the intent was to affect Windows (11?). Is everything ok?
== Change summary for alert #32375 (as of Wed, 17 Nov 2021 00:47:06 GMT) ==

Improvements:

Ratio	Test	Platform	Options	Absolute values (old vs new)
19%	perf_reftest_singletons scrollbar-styles-1.html	macosx1014-64-shippable-qr	e10s stylo webrender	536.33 -> 432.41
19%	perf_reftest_singletons scrollbar-styles-1.html	macosx1015-64-shippable-qr	e10s fission stylo webrender	460.05 -> 372.08
19%	perf_reftest_singletons scrollbar-styles-1.html	macosx1015-64-shippable-qr	e10s stylo webrender	455.77 -> 368.95
19%	perf_reftest_singletons scrollbar-styles-1.html	macosx1014-64-shippable-qr	e10s fission stylo webrender	533.81 -> 432.78
3%	cross_origin_pageload	macosx1015-64-shippable-qr	e10s stylo webrender-sw	85.89 -> 83.36

For up to date results, see: https://treeherder.mozilla.org/perfherder/alerts?id=32375

Comment 28

[Emilio Cobos Álvarez (:emilio)]

Yeah that improvement probably comes from not having buttons on macOS anymore.

Comment 29

[Stephen A Pohl [:spohl]]

(In reply to Emilio Cobos Álvarez (:emilio) from comment #28)

Yeah that improvement probably comes from not having buttons on macOS anymore.

This is true, and to further clarify: Even though this particular bug was filed for Windows 11, we have taken this opportunity to refactor scrollbars across all platforms, not just Windows. The actual Windows 11 piece is going through final tweaks in https://phabricator.services.mozilla.com/D131447 before review.

Comment 30

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/ca2daf97b94b
Add non-native implementation of Windows 11 scrollbars. r=emilio

Comment 31

[Andreea Pavel [:apavel]]

https://hg.mozilla.org/mozilla-central/rev/ca2daf97b94b

Comment 32

[Shane Hughes [:aminomancer]]

Would it be practical to apply the non-native theme scrollbars to the browser chrome? I like the default GTK style a lot, massive improvement over Windows 10's scrollbars, but the inconsistency with the scrollbars in popups and tree views makes the pref less practical

Comment 33

[Emilio Cobos Álvarez (:emilio)]

(In reply to Shane Hughes [:aminomancer] from comment #32)

Would it be practical to apply the non-native theme scrollbars to the browser chrome? I like the default GTK style a lot, massive improvement over Windows 10's scrollbars, but the inconsistency with the scrollbars in popups and tree views makes the pref less practical

It should definitely be possible, at least in windows and Linux, file a separate bug please?

Comment 34

[Gian-Carlo Pascutto [:gcp]]

Should we relnote this?

Comment 35

[Stephen A Pohl [:spohl]]

[Links (documentation, blog post, etc)]:(In reply to Gian-Carlo Pascutto [:gcp] from comment #34)

Should we relnote this?

Good question. It seems a bit odd to say that we're going to display Windows 11-style scrollbars (instead of Windows 10-style scrollbars) on Windows 11, since that is what users would typically come to expect. But I can see the value in emphasizing the fact that we're good citizens on Windows 11, at least with respect to scrollbars.

Release Note Request (optional, but appreciated)
[Why is this notable]: Firefox supports Windows 11 scrollbars
[Affects Firefox for Android]: no
[Suggested wording]: Firefox supports and displays the new style of scrollbars on Windows 11.

Comment 36

[Ciprian Georgiu, Desktop QA]

I checked that the scrollbars are respecting the Win 11 style, on Firefox Beta 97.0b8. Also, verified with Dark, Light, and Alpenglow themes. I did not encounter any issues.

Comment 37

[Ryan VanderMeulen [:RyanVM]]

Added to the Fx97 beta relnotes.