1645782 - Setting scrollbar-color creates unwanted border

Status: RESOLVED FIXED

(Core :: Widget: Win32, defect, P3)

Description

[ChickenQueen]

Attachment: firefox_G7SUsr7crv.png

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

Steps to reproduce:

Just add scrollbar-color: #ba8fe6 #fdfdfd; to any code that has a scrollbar

Actual results:

there is a small black border around (sometimes just on one side) of the scrollbar itself.

Expected results:

there shouldnt be a black border around the scrollbar. if you take away the color, the black border is not there anymore

Comment 1

[Emily McDonough [:alaskanemily]]

Can you provide the source used to create the example?

Comment 2

[ChickenQueen]

sure i just made a screen from this site
https://developer.mozilla.org/en-US/docs/Web/CSS/scrollbar-color

you probably need to change the color to something lighter to see it much clearer

Comment 3

[Sean Voisen (:svoisen)]

Looks isolated to Windows.

Comment 4

[Emily McDonough [:alaskanemily]]

I wasn't able to reproduce this on a Windows machine. I did notice the text in the box was sans-serif rather than serif for me though, so I suspect my settings are a bit different than the reporter's.

Comment 5

[jakobjankamminga]

I made a codepen where I can see this bug:
https://codepen.io/jj-kamminga/pen/RwarpBG

Windows 10 Pro 64bit
Firefox 79.0

Comment 6

[jana]

Attachment: Scrollbar with scrollbar-color propery disabled

Comment 7

[jana]

Attachment: Scrollbar with scrollbar-color propery enabled

Comment 8

[jana]

I'm having the same issue. With light scrollbar it is very noticeable. I'm attaching screenshots with scrollbar-color enabled and disabled, you can see the difference.

Comment 9

[Emilio Cobos Álvarez [:emilio]]

If you set widget.disable-native-theme-for-content=true in about:config and refresh, do you see it? That would help to know if it's a native windows theme issue or a deeper bug.

Comment 10

[jana]

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

If you set widget.disable-native-theme-for-content=true in about:config and refresh, do you see it? That would help to know if it's a native windows theme issue or a deeper bug.

No, changing this setting fixes the issue. Good call.

Comment 11

[Emilio Cobos Álvarez [:emilio]]

Thanks!

Comment 12

[jakobjankamminga]

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

If you set widget.disable-native-theme-for-content=true in about:config and refresh, do you see it? That would help to know if it's a native windows theme issue or a deeper bug.

This resolves the issue for me as well. But how would I fix it for my users, who are not going to be changing their about:config?

Comment 13

[Emilio Cobos Álvarez [:emilio]]

That means bug 1535761 will fix this (since it'll effectively turn that on by default). But I'll try to poke at the win32 code in the meantime anyhow.

Comment 14

[Emilio Cobos Álvarez [:emilio]]

Attachment: Bug 1645782 - Correctly snap windows custom scrollbar track / thumbs. r=mstange,spohl

Comment 15

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/2e3ed236c0bb
Correctly snap windows custom scrollbar track / thumbs. r=mstange

Comment 16

[Alexandru Michis [:malexandru]]

https://hg.mozilla.org/mozilla-central/rev/2e3ed236c0bb