search

element-hq / element-web

A glossy Matrix collaboration client for the web.
https://element.io
GNU Affero General Public License v3.0
11.15k stars 1.99k forks source link

Have to click twice to switch from light to dark mode when my browser theme is dark #26004

Open gabrc52 opened 1 year ago

gabrc52 commented 1 year ago

Steps to reproduce

  1. Set "default_theme": "light" in config.json
  2. Set your device or browser's theme to dark (instructions are platform-dependent)
  3. Log in with a brand new account
  4. Click on your profile picture
  5. Click on the change theme icon

Edit: This doesn't require a brand new account, just a brand new session.

Outcome

What did you expect?

Theme changes from light to dark

What happened instead?

Theme stays light, and the tooltip says "switch to light mode" when I am already in light mode. I have to click it another time to switch to dark theme and only then does it act as a "toggle theme" button.

See screen recording in next comment.

Operating system

Windows and Linux

Browser information

Firefox 116.0

URL for webapp

matrix.mit.edu (not public)

Application version

Element version: 1.11.39 Olm version: 3.2.14

Can reproduce on develop branch too

Homeserver

matrix-synapse-py3 1.90.0+jammy1

Will you send logs?

Yes

gabrc52 commented 1 year ago

Screen recording of the issue:

Screencast from 2023-08-18 22-52-43.webm

gabrc52 commented 1 year ago

comment posted on wrong issue accidentally, sorry

t3chguy commented 1 year ago

@gabrc52 did you mean to post that on https://github.com/vector-im/element-web/issues/26002 instead?

gabrc52 commented 1 year ago

Yes, thank you.

weeman1337 commented 1 year ago

@gabrc52 Unfortunately I cannot reproduce your issue. Please update your issue with more information. If we don’t hear back from you in a week, we will close the issue as we need to be able to reproduce it before we can fix it.

I've tried to reproduce with a new account and an existing one with the config setting "default_theme": "light". I did event copy your entire config.json to my environment and it still works. Do you just click on your avatar and then on the theme switcher, or do you do other things first?

gabrc52 commented 1 year ago

Yes, I just click on my avatar and then on the theme switcher. I've noted that this bug only happens when the system or browser theme is dark (i.e. when window.matchMedia('(prefers-color-scheme: dark)').matches is true).

weeman1337 commented 1 year ago

Yes, I just click on my avatar and then on the theme switcher. I've noted that this bug only happens when the system or browser theme is dark (i.e. when window.matchMedia('(prefers-color-scheme: dark)').matches is true).

Thank you, I was able to reproduce it with the extra information.