Special:QrCode and Special:UrlShortener has night mode issues
Closed, ResolvedPublic

Description

Background

Special:QrCode has color contrast issues in night theme.,

User story

As a user I want all my pages in dark mode.

Acceptance criteria

Communication criteria - does this need an announcement or discussion?

N/A

Rollback plan

N/A

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

Related Objects

Event Timeline

"Get short url" widget is also not going to dark mode: https://test.wikipedia.org/wiki/Ruine_Th%C3%BCrndl?vectornightmode=1 (click on "Get shortened URL")

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

[operations/mediawiki-config@master] Enable user pages and select special pages in dark mode (1.43.0-wmf.11)

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

Looks like the updates to OOUI took care of night mode for these pages so I'll enable them tomorrow.

Change #1049972 merged by jenkins-bot:

[operations/mediawiki-config@master] Enable user pages and select special pages in dark mode (1.43.0-wmf.11)

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

Mentioned in SAL (#wikimedia-operations) [2024-06-26T20:42:24Z] <jdrewniak@deploy1002> Started scap: Backport for [[gerrit:1049972|Enable user pages and select special pages in dark mode (1.43.0-wmf.11) (T366364 T366375 T367375 T367581 T367582 T367583)]]

Mentioned in SAL (#wikimedia-operations) [2024-06-26T20:44:55Z] <jdrewniak@deploy1002> jdlrobson, jdrewniak: Backport for [[gerrit:1049972|Enable user pages and select special pages in dark mode (1.43.0-wmf.11) (T366364 T366375 T367375 T367581 T367582 T367583)]] synced to the testservers (https://wikitech.wikimedia.org/wiki/Mwdebug)

Mentioned in SAL (#wikimedia-operations) [2024-06-26T20:50:34Z] <jdrewniak@deploy1002> Finished scap: Backport for [[gerrit:1049972|Enable user pages and select special pages in dark mode (1.43.0-wmf.11) (T366364 T366375 T367375 T367581 T367582 T367583)]] (duration: 08m 09s)

Test Result - Prod

Status: ✅ PASS
Environment: Beta
OS: macOS Sonoma 14.5
Browser: Chrome 126
Device: MBA
Emulated Device: NA

Test Artifact(s):

Screenshot 2024-07-03 at 12.57.49 PM.png (1×1 px, 113 KB)

Test Steps
  1. Go to

https://test.wikipedia.org/wiki/Special:QrCode?vectornightmode=1
https://test.wikipedia.org/wiki/Special:UrlShortener?vectornightmode=1

  1. Run color contrast checker on
  2. Components related to Special:QrCode and Special:UrlShortener are passing, except the placeholder text in the input field.*

Notes

  1. There are other elements that do not pass on the page, but they do not appear to be related to this page’s components.
  2. The placeholder text does not pass accessibility standards. However, since the label is present, users can understand the purpose of the input field without relying solely on the placeholder text.
  3. The submit button (white text on a blue background) does not pass accessibility standards, but this issue is addressed in another ticket. (Please confirm before closing).
    Screenshot 2024-07-03 at 12.57.04 PM.png (682×678 px, 90 KB)