Page MenuHomePhabricator

Deploy dark mode to anonymous users for certain projects (February 2025)
Closed, ResolvedPublic2 Estimated Story Points

Description

Background

The eventual goal is to have dark mode enabled for all projects. In February we will enable any wikis where a project has fewer errors in the night mode theme than the light mode theme.

User story

As a user of a project where the content has been adjusted for dark mode, I want dark mode to be available for logged out users.

Requirement

Deploy dark mode to logged-out users for the specified Wikimedia projects in February 2025. Ensure the default theme is light, the Dark Mode toggle is available, and it functions correctly to switch between light and dark themes.

  • uk.wikipedia.org
  • yo.wikipedia.org
  • za.wikipedia.org
  • zea.wikipedia.org
  • shi.wikipedia.org
  • sh.wikipedia.org
  • te.wikipedia.org
  • vep.wikipedia.org
  • tn.wikipedia.org
  • to.wikipedia.org
  • tpi.wikipedia.org
  • bat-smg.wikipedia.org
  • sm.wikipedia.org
  • sv.wikipedia.org
  • sw.wikipedia.org
  • ta.wikipedia.org
  • tay.wikipedia.org
  • tg.wikipedia.org
  • tk.wikipedia.org
  • qu.wikipedia.org
  • nv.wikipedia.org
  • os.wikipedia.org
  • pap.wikipedia.org
  • pih.wikipedia.org
  • lmo.wikipedia.org
  • lt.wikipedia.org
  • ml.wikipedia.org
  • mn.wikipedia.org
  • mnw.wikipedia.org
  • mr.wikipedia.org
  • ms.wikipedia.org
  • my.wikipedia.org
  • hsb.wikipedia.org
  • id.wikipedia.org
  • ilo.wikipedia.org
  • jv.wikipedia.org
  • km.wikipedia.org
  • gv.wikipedia.org
  • hi.wikipedia.org
  • cy.wikipedia.org
  • diq.wikipedia.org
  • gd.wikipedia.org
  • gl.wikipedia.org
  • azb.wikipedia.org
  • bcl.wikipedia.org
  • bh.wikipedia.org
  • bi.wikipedia.org
  • bxr.wikipedia.org
  • arc.wikipedia.org
  • ami.wikipedia.org
  • si.wikipedia.org
  • so.wikipedia.org
  • sl.wikipedia.org
  • tt.wikipedia.org
  • tum.wikipedia.org
  • sr.wikipedia.org
  • zh-yue.wikipedia.org
  • am.wikipedia.org
  • an.wikipedia.org
  • av.wikipedia.org
  • bg.wikipedia.org
  • gn.wikipedia.org
  • ie.wikipedia.org
  • lb.wikipedia.org
  • lfn.wikipedia.org
  • new.wikipedia.org
  • pcd.wikipedia.org
  • pms.wikipedia.org
  • ro.wikipedia.org
  • sa.wikipedia.org
  • scn.wikipedia.org
  • vo.wikipedia.org
  • kk.wikipedia.org
  • xmf.wikipedia.org
  • zu.wikipedia.org
  • ia.wikipedia.org
  • io.wikipedia.org

BDD

Feature: Deploy dark mode for logged-out users on specified Wikimedia projects

  Scenario: Verify default theme and dark mode toggle availability
    Given a logged-out user visits a specified Wikimedia project
    When the page loads
    Then the initial theme should be light
    And the dark mode toggle should be available

  Scenario: Verify dark mode toggle switches to dark theme
    Given the initial theme is light
    When the user clicks the dark mode toggle
    Then the theme should change to dark

  Scenario: Verify toggling back to light theme
    Given the theme is set to dark
    When the user clicks the dark mode toggle again
    Then the theme should change back to light

Test Steps

Test Case 1: Verify initial theme is light and dark mode toggle is available

  1. Log out of your Wikimedia account.
  2. Visit each of the specified projects (e.g., https://uk.wikipedia.org, https://yo.wikipedia.org, etc.).
  3. Confirm that the initial theme is set to light.
  4. Verify that the Dark Mode toggle is visible and available.
  5. AC1: The initial theme is light, and the dark mode toggle is available.

Test Case 2: Verify dark mode toggle switches to dark theme

  1. Follow steps 1-4 from Test Case 1.
  2. Click the Dark Mode toggle.
  3. Confirm that the theme switches to dark mode.
  4. AC2: The dark mode toggle successfully changes the theme to dark.

Test Case 3: Verify toggling back to light theme

  1. Follow steps 1-3 from Test Case 2 to enable dark mode.
  2. Click the Dark Mode toggle again.
  3. Confirm that the theme switches back to light mode.
  4. AC3: The dark mode toggle successfully switches back to light mode.

Design

  • Add mockups and design requirements

Acceptance criteria

  • Add acceptance criteria

Communication criteria - does this need an announcement or discussion?

Yes!

  • Add communication criteria
  • Announce the deployment in the listed Wikis' village pump before the enablement.
  • Enable about 2 weeks after announcement to Wikis

Rollback plan

  • What is the rollback plan in production for this task if something goes wrong?

https://phabricator.wikimedia.org/T383451#10537691

QA Results - Prod

ACStatusDetails
1T383451#10537691
2T383451#10537691
3T383451#10537691

This task was created by Version 1.3.0 of the Web team task template using phabulous

Event Timeline

Jdlrobson changed the task status from Open to In Progress.Jan 10 2025, 11:27 PM
Jdlrobson triaged this task as High priority.
Jdlrobson set the point value for this task to 2.
Jdlrobson moved this task from Incoming to Sprint Backlog on the Web-Team board.
Jdlrobson added a subscriber: Repakr.

@Jdlrobson - once we have the list of wikis, could you share directly with me and @UOzurumba who will be helping us inform the wikis ahead of deployments?

Jdlrobson changed the task status from In Progress to Open.Jan 13 2025, 6:35 PM
Jdlrobson renamed this task from Deploy dark mode to anonymous users for certain projects (January 2025) to Deploy dark mode to anonymous users for certain projects (February 2025).Jan 13 2025, 7:33 PM
Jdlrobson updated the task description. (Show Details)
Jdlrobson changed the task status from Open to In Progress.Jan 17 2025, 4:57 PM
ovasileva lowered the priority of this task from High to Medium.Feb 3 2025, 7:00 PM

Change #1117599 had a related patch set uploaded (by Jdlrobson; author: Jdlrobson):

[operations/mediawiki-config@master] Deploy dark mode to anonymous users for certain projects (February 2025)

https://gerrit.wikimedia.org/r/1117599

Change #1117599 merged by jenkins-bot:

[operations/mediawiki-config@master] Deploy dark mode to anonymous users for certain projects (February 2025)

https://gerrit.wikimedia.org/r/1117599

Mentioned in SAL (#wikimedia-operations) [2025-02-05T23:19:30Z] <jdrewniak@deploy2002> Started scap sync-world: Backport for [[gerrit:1117599|Deploy dark mode to anonymous users for certain projects (February 2025) (T383451)]]

Mentioned in SAL (#wikimedia-operations) [2025-02-05T23:22:31Z] <jdrewniak@deploy2002> jdrewniak, jdlrobson: Backport for [[gerrit:1117599|Deploy dark mode to anonymous users for certain projects (February 2025) (T383451)]] synced to the testservers (https://wikitech.wikimedia.org/wiki/Mwdebug)

Mentioned in SAL (#wikimedia-operations) [2025-02-05T23:31:58Z] <jdrewniak@deploy2002> Finished scap sync-world: Backport for [[gerrit:1117599|Deploy dark mode to anonymous users for certain projects (February 2025) (T383451)]] (duration: 12m 27s)

Edtadros subscribed.

Status: ✅ PASS
Environment: see table below
OS: macOS
Browser: Chrome
Device: MS MBA

Test Case 1: Verify initial theme is light and dark mode toggle is available

  1. Log out of your Wikimedia account.
  2. Visit each of the specified projects (e.g., https://uk.wikipedia.org, https://yo.wikipedia.org, etc.).
  3. Confirm that the initial theme is set to light.
  4. Verify that the Dark Mode toggle is visible and available.
  5. ✅ AC1: The initial theme is light, and the dark mode toggle is available.

See table below

Test Case 2: Verify dark mode toggle switches to dark theme

  1. Follow steps 1-4 from Test Case 1.
  2. Click the Dark Mode toggle.
  3. Confirm that the theme switches to dark mode.
  4. ✅ AC2: The dark mode toggle successfully changes the theme to dark.

See table below

Test Case 3: Verify toggling back to light theme

  1. Follow steps 1-3 from Test Case 2 to enable dark mode.
  2. Click the Dark Mode toggle again.
  3. Confirm that the theme switches back to light mode.
  4. ✅ AC3: The dark mode toggle successfully switches back to light mode.

See table below

StatusURLInitial ThemeDark Mode ToggleReturn to Light ModeScreenshot
https://uk.wikipedia.orgPassPassPass
recording_uk_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://yo.wikipedia.orgPassPassPass
recording_yo_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://za.wikipedia.orgPassPassPass
recording_za_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://zea.wikipedia.orgPassPassPass
recording_zea_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://shi.wikipedia.orgPassPassPass
recording_shi_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://sh.wikipedia.orgPassPassPass
recording_sh_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://te.wikipedia.orgPassPassPass
recording_te_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://vep.wikipedia.orgPassPassPass
recording_vep_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://tn.wikipedia.orgPassPassPass
recording_tn_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://to.wikipedia.orgPassPassPass
recording_to_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://tpi.wikipedia.orgPassPassPass
recording_tpi_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://bat-smg.wikipedia.orgPassPassPass
recording_bat-smg_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://sm.wikipedia.orgPassPassPass
recording_sm_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://sv.wikipedia.orgPassPassPass
recording_sv_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://sw.wikipedia.orgPassPassPass
recording_sw_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://ta.wikipedia.orgPassPassPass
recording_ta_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://tay.wikipedia.orgPassPassPass
recording_tay_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://tg.wikipedia.orgPassPassPass
recording_tg_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://tk.wikipedia.orgPassPassPass
recording_tk_wikipedia_org_pass.mov.gif (850×1 px, 2 MB)
https://qu.wikipedia.orgPassPassPass
recording_qu_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://nv.wikipedia.orgPassPassPass
recording_nv_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://os.wikipedia.orgPassPassPass
recording_os_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://pap.wikipedia.orgPassPassPass
recording_pap_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://pih.wikipedia.orgPassPassPass
recording_pih_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://lmo.wikipedia.orgPassPassPass
recording_lmo_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://lt.wikipedia.orgPassPassPass
recording_lt_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://ml.wikipedia.orgPassPassPass
recording_ml_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://mn.wikipedia.orgPassPassPass
recording_mn_wikipedia_org_pass.mov.gif (850×1 px, 898 KB)
https://mnw.wikipedia.orgPassPassPass
recording_mnw_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://mr.wikipedia.orgPassPassPass
recording_mr_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://ms.wikipedia.orgPassPassPass
recording_ms_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://my.wikipedia.orgPassPassPass
recording_my_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://hsb.wikipedia.orgPassPassPass
recording_hsb_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://id.wikipedia.orgPassPassPass
recording_id_wikipedia_org_pass.mov.gif (850×1 px, 2 MB)
https://ilo.wikipedia.orgPassPassPass
recording_ilo_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://jv.wikipedia.orgPassPassPass
recording_jv_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://km.wikipedia.orgPassPassPass
recording_km_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://gv.wikipedia.orgPassPassPass
recording_gv_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://hi.wikipedia.orgPassPassPass
recording_hi_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://cy.wikipedia.orgPassPassPass
recording_cy_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://diq.wikipedia.orgPassPassPass
recording_diq_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://gd.wikipedia.orgPassPassPass
recording_gd_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://gl.wikipedia.orgPassPassPass
recording_gl_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://azb.wikipedia.orgPassPassPass
recording_azb_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://bcl.wikipedia.orgPassPassPass
recording_bcl_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://bh.wikipedia.orgPassPassPass
recording_bh_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://bi.wikipedia.orgPassPassPass
recording_bi_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://bxr.wikipedia.orgPassPassPass
recording_bxr_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://arc.wikipedia.orgPassPassPass
recording_arc_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://ami.wikipedia.orgPassPassPass
recording_ami_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://si.wikipedia.orgPassPassPass
recording_si_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://so.wikipedia.orgPassPassPass
recording_so_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://sl.wikipedia.orgPassPassPass
recording_sl_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://tt.wikipedia.orgPassPassPass
recording_tt_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://tum.wikipedia.orgPassPassPass
recording_tum_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://sr.wikipedia.orgPassPassPass
recording_sr_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://zh-yue.wikipedia.orgPassPassPass
recording_zh-yue_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://am.wikipedia.orgPassPassPass
recording_am_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://an.wikipedia.orgPassPassPass
recording_an_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://av.wikipedia.orgPassPassPass
recording_av_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://bg.wikipedia.orgPassPassPass
recording_bg_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://gn.wikipedia.orgPassPassPass
recording_gn_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://ie.wikipedia.orgPassPassPass
recording_ie_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://lb.wikipedia.orgPassPassPass
recording_lb_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://lfn.wikipedia.orgPassPassPass
recording_lfn_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://new.wikipedia.orgPassPassPass
recording_new_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://pcd.wikipedia.orgPassPassPass
recording_pcd_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://pms.wikipedia.orgPassPassPass
recording_pms_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://ro.wikipedia.orgPassPassPass
recording_ro_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://sa.wikipedia.orgPassPassPass
recording_sa_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://scn.wikipedia.orgPassPassPass
recording_scn_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://vo.wikipedia.orgPassPassPass
recording_vo_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://kk.wikipedia.orgPassPassPass
recording_kk_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://xmf.wikipedia.orgPassPassPass
recording_xmf_wikipedia_org_pass.mov.gif (850×1 px, 2 MB)
https://zu.wikipedia.orgPassPassPass
recording_zu_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://ia.wikipedia.orgPassPassPass
recording_ia_wikipedia_org_pass.mov.gif (850×1 px, 1 MB)
https://io.wikipedia.orgPassPassPass
recording_io_wikipedia_org_pass.mov.gif (850×1 px, 962 KB)