Forgotten test ? resistFingerprinting button background color

Version 8.1.24
In Firefox, when the "privacy.resistFingerprinting" option is enabled, the background color of buttons are randomly changed.
Example :
option disabled :
image

option enabled :
image

It's a funny thing when still developing new views but it won't be the same when it hits production use.
I'm pretty sure I can't ask users to disable this firefox setting.
Is there a way to prevent this ?

We don't test Firefox settings. I'd recommend opening up the browser's developer tools, (right click + inspect), and inspecting the style being applied to the elements. Determine where they are coming from and then override them by either using our theming feature or our advanced style sheet.

There is already a style applied to them :
image

Reflected by the html taken from inspect (when privacy.resistFingerprinting is disabled) :

<button data-component="ia.input.button" data-component-path="C$0:1:5:1[6].0:0:1:0" style="background-color: rgba(0, 0, 0, 0); border-style: none; margin-bottom: 4px; flex: 1 1 30px;" class="ia_button--secondary button-secondary ia-button popup-not-draggable"><div style="flex-direction: row; align-items: center; justify-content: center;"><img src="/system/images/Builtin/Adfast/SVG/parametrable.svg" style="height: 24px; width: 24px;"></div></button>

But as soon as privacy.resistFingerprinting is enabled, my style is overridden :

<button data-component="ia.input.button" data-component-path="C$0:1:5:1[6].0:0:1:0" style="background-color: rgba(240, 235, 19, 0.796); border-style: none; margin-bottom: 4px; flex: 1 1 30px;" class="ia_button--secondary button-secondary ia-button popup-not-draggable"><div style="flex-direction: row; align-items: center; justify-content: center;"><img src="/system/images/Builtin/Adfast/SVG/parametrable.svg" style="height: 24px; width: 24px;"></div></button>

Same thing when changing theme from default (light) to dark :

I've never tried the advanced syle sheet but can give it a go. I fear it will be the same though.

Maybe the issue is on the Firefox side, I have no clue.

Do you have high contrast mode set at the OS level?

Nope : disabled
image

Was a wild guess, because that's the only bugticket I can see that even theoretically affects coloration:
https://wiki.mozilla.org/Security/Fingerprinting

Does it do the same in a private browsing window? With all extensions disabled?

To clarify: this is 1000% Firefox behavior. We definitely test on FF, but not every combination of settings. However, we've definitely got devs who use resist fingerprinting (:raised_hand:) and nobody's ever reported this or anything like this before.

Sadly, same behavior with private browsing window and all extensions disabled.

I did some more tests and it happens as soon as I have a button with some transparency for the background-color and this firefox setting enabled.

In Designer :
image

In firefox resistFingerprinting disabled :
image

In firefox resistFingerprinting enabled :
image

Small update.
As soon as I change the setting called resistFingerprinting.testGranularityMask to a value of 2 or more in Firefox, transparency works ok again.
Really weird.
I guess I will go with that and ask customers to change that setting if they ever have the combo Firefox + resistFingerprinting.