Bright white flashes on opening new tabs and page reload when using Dark Mode or Firefox Dark theme

RESOLVED FIXED in Firefox 68

Status

()

defect
P3
normal
RESOLVED FIXED
9 months ago
8 days ago

People

(Reporter: m_khvoinitsky, Assigned: ke5trel)

Tracking

(Depends on 1 bug)

Trunk
Firefox 68
Points:
---
Dependency tree / graph

Firefox Tracking Flags

(firefox68 fixed)

Details

Attachments

(4 attachments, 1 obsolete attachment)

Posted video bright-flash.webm
User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:61.0) Gecko/20100101 Firefox/61.0
Build ID: 20180808222917

Steps to reproduce:

1. Enable Firefox' Dark theme.
2. Open any website with native dark theme or install any add-on that makes web dark and open any website


Actual results:

Bright flash will appear between dark home page and dark website


Expected results:

Bright flash should not appear between dark home page and dark website
Posted patch dark-theme-fix.patch (obsolete) — Splinter Review
Here is a patch. However, I'm not quite sure whether var(--chrome-background-color) is the best choice for that or not. Please, take a look.
Attachment #9006208 - Flags: review?(dao+bmo)
Component: Untriaged → Tabbed Browser
Blocks: 1402312, 1379587
Comment on attachment 9006208 [details] [diff] [review]
dark-theme-fix.patch

This results in the opposite problem on light websites (which is most websites), e.g. when opening a link in a new tab without going through about:newtab.
Attachment #9006208 - Flags: review?(dao+bmo) → review-
Yes, but now the same is happening in Private Browsing (due to bug 1379587 fix) — under some circumstances page reload of light website flashes dark purple. I guess that people who use Dark Firefox tend to use dark websites or add-ons for that. Also, dark blink on bright screen doesn't hurt eyes while bright flash on dark screen does.
(In reply to Khvoinitsky Mikhail [:m_khvoinitsky] from comment #4)
> Yes, but now the same is happening in Private Browsing (due to bug 1379587
> fix) — under some circumstances page reload of light website flashes dark
> purple.

The reload case sounds line an independent Gecko bug. E.g. when not using the dark theme and reloading a dark page, we'd like to keep the page background without showing white in between. In my experience this already works most of the time, but there might be edge cases where it doesn't.

> I guess that people who use Dark Firefox tend to use dark websites
> or add-ons for that.

That's an interesting guess but it doesn't seem to be backed by data.

> Also, dark blink on bright screen doesn't hurt eyes
> while bright flash on dark screen does.

It's still an annoying interruption though.
(In reply to Dão Gottwald [::dao] from comment #5)
> (In reply to Khvoinitsky Mikhail [:m_khvoinitsky] from comment #4)
> > Yes, but now the same is happening in Private Browsing (due to bug 1379587
> > fix) — under some circumstances page reload of light website flashes dark
> > purple.
> 
> The reload case sounds line an independent Gecko bug. E.g. when not using
> the dark theme and reloading a dark page, we'd like to keep the page
> background without showing white in between. In my experience this already
> works most of the time, but there might be edge cases where it doesn't.

Indeed, reload isn't a problem usually. It mostly loading a page in a new tab.

> > I guess that people who use Dark Firefox tend to use dark websites
> > or add-ons for that.
> That's an interesting guess but it doesn't seem to be backed by data.

Unfortunately, yes.

> > Also, dark blink on bright screen doesn't hurt eyes
> > while bright flash on dark screen does.
> 
> It's still an annoying interruption though.

But less severe.

I'm a developer of one of the add-ons that makes web dark. FYI, related bug: https://github.com/m-khvoinitsky/dark-background-light-text-extension/issues/131
Ideally, Firefox built-in dark theme should affect everything what is not available for add-ons.

As I already said, the same is already done now for Private Browsing, why that was not a problem?

Finally, do you have a better suggestion?

Comment 7

9 months ago
(In reply to Khvoinitsky Mikhail [:m_khvoinitsky] from comment #6)
> Finally, do you have a better suggestion?

My suggestion would be to allow add-ons to customize the default content area background: see bug 1459504. 

I can mentor you through this bug if you're interested.
(In reply to Tim Nguyen :ntim from comment #7)
> (In reply to Khvoinitsky Mikhail [:m_khvoinitsky] from comment #6)
> > Finally, do you have a better suggestion?
> 
> My suggestion would be to allow add-ons to customize the default content
> area background: see bug 1459504. 
> 
> I can mentor you through this bug if you're interested.

That would just shift this patch's problem from being built in to extensions. Making this part of the theming API is basically a footgun. I morphed bug 1459504 to avoid that.
Depends on: 1459504
Priority: -- → P5

Comment 9

9 months ago
i just wanted to confirm, that I've seen the same behavior. the bug can be forced by rapidly opening new tabs with firefox home as default for new tabs and the dark theme active.
Status: UNCONFIRMED → NEW
Ever confirmed: true
I think this bug deserves to be re-triaged to a higher priority than P5 now that Firefox's Default theme turns dark when macOS 10.14's Dark Mode is enabled (bug 1466335). The white flashes look really janky. macOS Dark Mode is not enabled by default, but it seems like a popular macOS feature.

STR:
1. Enable macOS 10.14's Dark Mode in System Preferences > General.
2. Launch Firefox in a new user profile.

RESULT:
The browser window will flash white for about half a second before the dark about:newtab page is loaded.

STR continued:
3. Cmd+R to reload the about:newtab page.

RESULT:
The browser window will flash white briefly before the dark about:newtab page is loaded.

STR continued:
4. Click on one of the links on the about:newtab page

RESULT:
The browser window will flash white briefly after the dark about:newtab page is unloaded and before the clicked link is loaded.
Blocks: 1466335
Priority: P5 → --
Summary: Bright flashes on opening new tabs and page reload when using Dark Firefox theme with dark websites and/or add-ons that make web dark → Bright white flashes on opening new tabs and page reload when using macOS Dark Mode or Firefox Dark theme

Updated

5 months ago
Duplicate of this bug: 1513593
No longer blocks: 1402312, 1466335
See Also: → 1402312, 1466335
Depends on: 1494034
Comment hidden (advocacy)
Duplicate of this bug: 1408122
Priority: -- → P3
Duplicate of this bug: 1535806
Summary: Bright white flashes on opening new tabs and page reload when using macOS Dark Mode or Firefox Dark theme → Bright white flashes on opening new tabs and page reload when using Dark Mode or Firefox Dark theme
Assignee

Updated

a month ago
Attachment #9006208 - Attachment is obsolete: true
Assignee

Comment 16

a month ago

Now that Bug 1519548 has arrived we should style #tabbrowser-tabpanels to respect the in-content dark color scheme which will avoid the following white flashes:

  • Opening links in new tabs and windows (long white flash).
  • Opening Preferences, Addons, Troubleshooting Information, Task Manager etc.
  • Restoring discarded tabs.
  • Maximizing/resizing window (white flash on right/bottom sides of window).
  • Closing sidebar (white flash on right side of window).
  • privacy.resistFingerprinting.letterboxing (white frame around content).
  • Opening and closing DevTools.
  • Leaving Customize mode and returning to content tab.
Assignee: nobody → ke5trel
Depends on: 1519548
Assignee

Updated

a month ago
Keywords: checkin-needed

Comment 18

a month ago

Pushed by dgottwald@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/2d1d88a793a3
Style the background of #tabbrowser-tabpanels for dark in-content color scheme to avoid white flashes. r=dao

Keywords: checkin-needed

Comment 19

a month ago
bugherder
Status: NEW → RESOLVED
Last Resolved: a month ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 68

Comment 20

a month ago

(In reply to Andreea Pavel [:apavel] from comment #19)

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

My firefox is up to date (i.e updated) and there are no changes in this situation what so ever, then why it has been marked as "Resolution: FIXED"?

Flags: needinfo?(dao+bmo)

In which version branch are you? If you're using the Nightly(v68) version, you can expect to see this fixed by the next Nightly build (tomorrow).
Otherwise, it will take some more time(this is why it is set to status-firefox68 -> fixed). It is fixed in the version tree of 68.

Flags: needinfo?(dao+bmo)

Comment 22

a month ago

Hi. I am using today's Nightly 68.0a1 (2019-04-17) (64-Bit) and the bright flashes are still appearing in Dark (Theme) Mode when I open a New Tab.

I am using macOS 10.14.4 on a MacBook Air NonRetina.

Is browser.in-content.dark-mode set to true for you in about:config?

Comment 24

a month ago

(In reply to Jens Hausdorf :jens1o [ni? me] from comment #23)

Is browser.in-content.dark-mode set to true for you in about:config?

I toggled it to true now, relaunched Nightly, but I see the same result: It is still flashing bright :(

Comment 25

a month ago
Posted video screencast.mov

+screencast

Assignee

Comment 26

a month ago

(In reply to Mehmet from comment #24)

I toggled it to true now, relaunched Nightly, but I see the same result: It is still flashing bright :(

You also need to be using a dark OS theme or have ui.systemUsesDarkTheme = 1. Note that there will still be white flashes when restoring unloaded about tabs (Bug 1408122) and rapidly creating new tabs like in the video (Bug 1510567).

Comment 27

a month ago

(In reply to Kestrel from comment #26)

(In reply to Mehmet from comment #24)

I toggled it to true now, relaunched Nightly, but I see the same result: It is still flashing bright :(

You also need to be using a dark OS theme or have ui.systemUsesDarkTheme = 1. Note that there will still be white flashes when restoring unloaded about tabs (Bug 1408122) and rapidly creating new tabs like in the video (Bug 1510567).

Ah, okay. Thanks, that is working for me now when I also switch in addition to System Dark Mode. (And thanks, for the report numbers regarding the open issues.)

Question: Will the bright flashes also be fixed for System Light Mode when using the Dark Theme? It is at least mentioned in the title of this bug report "...or Firefox Dark theme". Is there a another bug number for it? Thanks in advance.

Comment 28

a month ago

(In reply to Kestrel from comment #26)

You also need to be using a dark OS theme or have ui.systemUsesDarkTheme = 1. Note that there will still be white flashes when restoring unloaded about tabs (Bug 1408122) and rapidly creating new tabs like in the video (Bug 1510567).

So this bug is not fixed, i have the same problem on linux, gtk theme being white.

What did your changes "Style the background of #tabbrowser-tabpanels for dark in-content color scheme to avoid white flashes"
do? Even if it did something, isn't this a partial fix?

Assignee

Comment 29

a month ago

Create ui.systemUsesDarkTheme = 1 in about:config and it works with light OS theme.

This bug fixes the majority of commonly encountered white flashes, the other two bugs are relative edge cases. The approach used is the same as in the original patch submitted by the bug creator in Comment 1.

Comment 30

a month ago

(In reply to Kestrel from comment #29)

Create ui.systemUsesDarkTheme = 1 in about:config and it works with light OS theme.

Yes, that works for me. Thanks.

Comment hidden (me-too)

Comment 32

19 days ago

Forgot to mention that I am trying this in Fedora 30 using OS adwaita-dark dark theme.

(In reply to hueydai from comment #31)

This is still happening for me: I am using Firefox darkmode + Dark Reader plugin to render all pages dark. Screen flashes white when I click on links, when I reload pages, and when I open tabs too quickly.

It's jarring enough that I have not fully switched from chrome to firefox.

Are you using Firefox 68? Are you using the preferences tweaks mentioned above?

Comment hidden (me-too)
You need to log in before you can comment on or make changes to this bug.