Structured Tasks: structured tasks onboarding elements not readable in Dark Mode
Closed, ResolvedPublicBUG REPORT
Actions

Assigned To

Authored By

	KStoller-WMF
	Jul 26 2024, 8:54 PM

Description

Background

The Web team is releasing dark mode more widely. To prepare for this, some Growth maintained features need improvements.

User story

As a new editor who uses dark mode, I want the ability to use dark mode when viewing Structured Task onboarding

Known issues

(Add a link) Images background overlaps CSS background, only one background color below the image should shown
(Add a link) Highlighted text is unreadable
(All tasks) Stepper 1 of 3 has contrast issues

Steps to reproduce

Navigate to Special:Homepage
Check one of structured tasks ( the ones with a robot in the small text below)
Wait for VE to load and the onboarding dialog to show
Navigate through the dialog steps

Structured Task (AddLink) onboarding
Structured Task (AddImage and AddSectionImage)

Acceptance Criteria:

Given I'm Completing a Structured Task,
When I'm viewing the onboarding in dark mode,
Then all elements are readable and pass WCAG AA contrast requirements

Details

Subject	Repo	Branch	Lines +/-
fix: dark-mode: Make highlights in onboarding dialogues readable	mediawiki/extensions/GrowthExperiments	master	+19 -0
Suggested edits: update background color to use Codex token	mediawiki/extensions/GrowthExperiments	master	+39 -2
SuggestedEdits: fix contrast issues in AddLink onboarding example	mediawiki/extensions/GrowthExperiments	master	+9 -0
SuggestedEdits: use background-less images in AddLink onboarding	mediawiki/extensions/GrowthExperiments	master	+390 -388

Customize query in gerrit

Related Objects
Search...

Status	Subtype	Assigned	Task
Resolved		ovasileva	T341631 [EPIC] Q1 Main hypothesis: Typographical and palette customizations
Resolved		ovasileva	T341632 [EPIC] Palette customizations and dark mode
Open		None	T366760 [EPIC] Dark mode for Growth team maintained features
Resolved		Etonkovidova	T367058 QA Growth-related OOUI updates (mobile + desktop)
Resolved		Cyndymediawiksim	T369588 Dark Mode: Suggested Edits & Structured Tasks
Resolved	BUG REPORT	Sgs	T371146 Structured Tasks: structured tasks onboarding elements not readable in Dark Mode
Resolved		JFernandez-WMF	T371901 Provide Add a link on-boarding assets without embedded background colors

Event Timeline

KStoller-WMF created this task.Jul 26 2024, 8:54 PM

KStoller-WMF mentioned this in T369588: Dark Mode: Suggested Edits & Structured Tasks.

KStoller-WMF moved this task from Inbox to Up Next on the Growth-Team board.

Jdlrobson moved this task from Backlog to Web (MediaWiki) on the dark-mode board.Jul 26 2024, 10:54 PM

KStoller-WMF attached a referenced file: F55632673: Screen Shot 2024-06-22 at 4.30.14 PM.png. (Show Details)Jul 31 2024, 2:20 PM

KStoller-WMF attached a referenced file: F55632449: Screen Shot 2024-06-22 at 4.27.09 PM.png. (Show Details)

KStoller-WMF triaged this task as Medium priority.Jul 31 2024, 2:25 PM

KStoller-WMF renamed this task from GuidedTour: some elements not readable in Dark Mode to Structured Tasks: some onboarding elements not readable in Dark Mode .Jul 31 2024, 9:47 PM

KStoller-WMF updated the task description. (Show Details)

Sgs renamed this task from Structured Tasks: some onboarding elements not readable in Dark Mode to Structured Tasks: structured tasks onboarding elements not readable in Dark Mode .Aug 6 2024, 11:58 AM

Change #1060133 had a related patch set uploaded (by Sergio Gimeno; author: Sergio Gimeno):

[mediawiki/extensions/GrowthExperiments@master] [WIP] Suggested edits: update background color to use Codex token

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

gerritbot added a project: Patch-For-Review.Aug 6 2024, 3:38 PM

KStoller-WMF moved this task from Up Next to FY2024-25 Q1 Sprint 3 on the Growth-Team board.Aug 6 2024, 5:00 PM

KStoller-WMF edited projects, added Growth-Team (FY2024-25 Q1 Sprint 3); removed Growth-Team.

KStoller-WMF updated the task description. (Show Details)Aug 6 2024, 5:27 PM

KStoller-WMF mentioned this in Growth-Team (FY2024-25 Q1 Sprint 3).

Sgs claimed this task.Aug 6 2024, 5:32 PM

Sgs moved this task from Incoming to Doing on the Growth-Team (FY2024-25 Q1 Sprint 3) board.Aug 7 2024, 10:10 AM

Change #1060418 had a related patch set uploaded (by Sergio Gimeno; author: Sergio Gimeno):

[mediawiki/extensions/GrowthExperiments@master] SuggestedEdits: fix contrast issues in AddLink onboarding example

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

Currently blocked on T371901: Provide Add a link on-boarding assets without embedded background colors.

@Sgs Does this provide what you need? T371901#10048693

Sgs moved this task from Blocked / Needs Work to Doing on the Growth-Team (FY2024-25 Q1 Sprint 3) board.Aug 8 2024, 10:54 AM

Change #1060866 had a related patch set uploaded (by Sergio Gimeno; author: Sergio Gimeno):

[mediawiki/extensions/GrowthExperiments@master] SuggestedEdits: use background-less images in AddLink onboarding

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

Sgs closed subtask T371901: Provide Add a link on-boarding assets without embedded background colors as Resolved.Aug 8 2024, 3:11 PM

Sgs moved this task from Doing to Code Review on the Growth-Team (FY2024-25 Q1 Sprint 3) board.

Sgs updated the task description. (Show Details)Aug 12 2024, 11:18 AM

In T371146#10049940, @KStoller-WMF wrote:

@Sgs Does this provide what you need? T371901#10048693

Indeed. The task is in code review now.

Change #1060866 merged by jenkins-bot:

[mediawiki/extensions/GrowthExperiments@master] SuggestedEdits: use background-less images in AddLink onboarding

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

KStoller-WMF mentioned this in Growth-Team (FY2024-25 Q1 Sprint 4).Aug 19 2024, 10:25 PM

Michael moved this task from FY2024-25 Q1 Sprint 3 to FY2024-25 Q1 Sprint 4 on the Growth-Team board.Aug 20 2024, 11:18 AM

Michael edited projects, added Growth-Team (FY2024-25 Q1 Sprint 4); removed Growth-Team (FY2024-25 Q1 Sprint 3).

Michael moved this task from Incoming to Code Review on the Growth-Team (FY2024-25 Q1 Sprint 4) board.

Change #1067925 had a related patch set uploaded (by Michael Große; author: Michael Große):

[mediawiki/extensions/GrowthExperiments@master] fix: dark-mode: Make highlights in onboarding dialogues readable

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

Change #1060418 abandoned by Sergio Gimeno:

[mediawiki/extensions/GrowthExperiments@master] SuggestedEdits: fix contrast issues in AddLink onboarding example

Reason:

Drop in favor of Ic34f415f3efc79579690316e1146034ff5fd3521

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

Change #1060133 merged by jenkins-bot:

[mediawiki/extensions/GrowthExperiments@master] Suggested edits: update background color to use Codex token

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

ReleaseTaggerBot added a project: MW-1.43-notes (1.43.0-wmf.21; 2024-09-03).Sep 2 2024, 5:00 PM

Change #1067925 merged by jenkins-bot:

[mediawiki/extensions/GrowthExperiments@master] fix: dark-mode: Make highlights in onboarding dialogues readable

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

ReleaseTaggerBot edited projects, added MW-1.43-notes (1.43.0-wmf.22; 2024-09-10); removed MW-1.43-notes (1.43.0-wmf.21; 2024-09-03).Sep 3 2024, 11:00 AM

Maintenance_bot removed a project: Patch-For-Review.Sep 3 2024, 11:31 AM

Sgs moved this task from Code Review to QA on the Growth-Team (FY2024-25 Q1 Sprint 4) board.Sep 4 2024, 12:00 PM

Urbanecm_WMF edited projects, added Growth-Team (FY2024-25 Q1 Sprint 5); removed Growth-Team (FY2024-25 Q1 Sprint 4).Sep 5 2024, 9:35 AM

Urbanecm_WMF moved this task from Incoming to QA on the Growth-Team (FY2024-25 Q1 Sprint 5) board.

KStoller-WMF edited projects, added Growth-Team (FY2024-25 Q1 Sprint 6); removed Growth-Team (FY2024-25 Q1 Sprint 5).Sep 16 2024, 10:44 PM

Sgs moved this task from Incoming to QA on the Growth-Team (FY2024-25 Q1 Sprint 6) board.Sep 17 2024, 3:02 PM

Checked in 'cswiki mf.23` - the Structured Task (AddLink, (AddImage and AddSectionImage) onboarding is displayed correctly in the dark mode and passes the accessibility test.

Screen Shot 2024-09-23 at 3.39.47 PM.png (1×998 px, 130 KB)

Screen Shot 2024-09-23 at 3.40.50 PM.png (1×1 px, 142 KB)

	F57532882: Screen Shot 2024-09-23 at 3.40.50 PM.png
	Sep 23 2024, 10:46 PM

	F57532880: Screen Shot 2024-09-23 at 3.39.47 PM.png
	Sep 23 2024, 10:46 PM

	F57269118: Screenshot 2024-08-12 at 13.10.59.png
	Aug 12 2024, 11:18 AM

	F55632673: Screen Shot 2024-06-22 at 4.30.14 PM.png
	Jul 26 2024, 8:54 PM

	F55632449: Screen Shot 2024-06-22 at 4.27.09 PM.png
	Jul 26 2024, 8:54 PM

Structured Tasks: structured tasks onboarding elements not readable in Dark Mode Closed, ResolvedPublicBUG REPORTActions