2041881 - Background of responsive design mode is purple when browser.privatebrowsing.felt-privacy-v1 = true

Status: RESOLVED FIXED

(DevTools :: Responsive Design Mode, defect, P2)

Description

[6k64x4ma]

Attachment: image.webp

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

Steps to reproduce:

1. Set browser.privatebrowsing.felt-privacy-v1 to true.
2. Open any page in the private window and activate the responsive design mode.

Actual results:

The background of the responsive design mode is purple.

Expected results:

The background color should be gray or black depending on the selected theme.

Regression window:
https://hg.mozilla.org/integration/autoland/pushloghtml?fromchange=f959b47f3dc9304f0636e3c3d77cc1cf623ae224&tochange=b299435df702f7ac151cf5ffad193478aeed8c79

Comment 1

[Julian Descottes [:jdescottes]]

The preference mentioned here was flipped to true 1 week ago via Bug 2040953

Comment 2

[Julian Descottes [:jdescottes]]

Specifically the issue comes from the fact that the background color is applied via background at https://searchfox.org/firefox-main/rev/e28b34ab33dbf49364999070168cbb7e11e8e5bd/browser/themes/shared/tabbrowser/content-area.css#159,167-168,194

.browserContainer {
/* ... */
  /* We want to be able to show the frame color behind the clipped radiused corner */
  background: var(--tabpanel-background-color);
/* ... */
}

and is therefore not overridden by the RDM which sets only the background-color https://searchfox.org/firefox-main/rev/e28b34ab33dbf49364999070168cbb7e11e8e5bd/devtools/client/responsive/responsive-browser.css#5,13,20

.browserContainer.responsive-mode {
/* ... */
  background-color: var(--rdm-background-color);
/* ... */
}

even if the specificity of our selector should beat the one from content-area.css. I guess we could either switch RDM's CSS to set background or content-area to set background-color.

Comment 3

[Manuel Bucher [:manuel]]

Lets set the bug it into the regressed_by field like in bug 2041470 to get the tracking fields right and uplift alongside the pref flip to beta. (Even though it also is enabled via release experiment and has been for a while.)

Comment 4

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

Set release status flags based on info from the regressing bug 2040953

Comment 5

[Julian Descottes [:jdescottes]]

Let's fix this for 153.

Comment 6

[Julian Descottes [:jdescottes]]

As pointed out by Nicolas, the variable --tabpanel-background-color is actually set to a gradient which is a background property and not a background-color property. So we have to switch rdm to set background as well.

Comment 7

[Julian Descottes [:jdescottes]]

Attachment: Bug 2041881 - [devtools] Override .browserContainer background from felt-v1 PBM in RDM

Comment 8

[Pulsebot]

Pushed by [e-mail]:
https://github.com/mozilla-firefox/firefox/commit/3db349810dae
https://hg.mozilla.org/integration/autoland/rev/4072df9f7a61
[devtools] Override .browserContainer background from felt-v1 PBM in RDM r=devtools-reviewers,nchevobbe

Comment 9

[agoloman]

https://hg.mozilla.org/mozilla-central/rev/4072df9f7a61

Comment 10

[Julian Descottes [:jdescottes]]

Attachment: Bug 2041881 - [devtools] Override .browserContainer background from felt-v1 PBM in RDM

The .browserContainer background is assigned to a linear-gradient in PBM. This commit updates the RDM css to also set the background instead of the background-color to ensure we override the default value properly.

Original Revision: https://phabricator.services.mozilla.com/D302729

Comment 11

[Phabricator Automation]

firefox-beta Uplift Approval Request

• User impact if declined/Reason for urgency: Incorrect background for Responsive Design Mode in private browsing windows. Regressing patch was uplifted, uplifting this as well.
• Code covered by automated testing?: no
• Fix verified in Nightly?: yes
• Needs manual QE testing?: no
• Steps to reproduce for manual QE testing: N/A
• Risk associated with taking this patch: low
• Explanation of risk level: Minor DevTools only CSS update.
• String changes made/needed?: N/A
• Is Android affected?: no

Comment 12

[Pulsebot]

https://github.com/mozilla-firefox/firefox/commit/95c5b369c1b2
https://hg.mozilla.org/releases/mozilla-beta/rev/8ff593bbdec0