[a11y] Minimized toolbar - mw-interlanguage-selector is not keyboard-focusable
Closed, ResolvedPublic2 Estimated Story PointsBUG REPORT
Actions

Assigned To

Authored By

	Etonkovidova
	Aug 3 2026, 7:29 PM

Project Tags

Referenced Files

	F97541676: language-chip-focus.png
	Aug 7 2026, 9:25 PM

	F97541303: language-chip-hover.gif
	Aug 7 2026, 9:25 PM

	F97058679: Screenshot 2026-08-03 at 3.11.55 PM.png
	Aug 3 2026, 7:29 PM

Subscribers

Description

Steps:

on mobile enwiki beta (use ?minimalMinerva=1) go to any article
start clicking Tab to go trhough elements on a page
the language selector is not keyboard-focusable

Screenshot 2026-08-03 at 3.11.55 PM.png (674×281 px, 41 KB)

<div role="button" href="#p-lang" data-mw="interface" data-event-name="menu.languages" title="Language" class="cdx-info-chip cdx-info-chip--progressive language-selector mw-interlanguage-selector">
            
                <span class="minerva-icon minerva-icon-size-small minerva-icon--language"></span>

                <span class="cdx-info-chip__text">1 language</span>
            
        </div>

Expected behavior:

Visible focus, hover, and active affordances
Language chip is an anchor tag with button role (<a role="button">)
Comments chip is a plain anchor tag (<a>)
Both chips are wrapped inside a list container (<ul>/<li>)
Language chip is keyboard accessible/focusable via key tabs
Enter key activates the language chip/fake button and opens the language selector overlay
Screen reader announces language chip as a button

Details

Related Changes in Gerrit:

	Subject	Author	Repo	Branch	Lines +/-
	Minimal Minerva: page chip's active/hover styles	LWatson	mediawiki/skins/MinervaNeue	master	+9 -2
	Minimal Minerva: make language chip keyboard accessible	LWatson	mediawiki/skins/MinervaNeue	master	+48 -14

Customize query in gerrit

Related Objects
Search...

		Status	Subtype	Assigned	Task
		Resolved		KSarabia-WMF	T428692 Minerva simplified toolbelt bug bash
		Resolved	BUG REPORT	lwatson	T433882 [a11y] Minimized toolbar - mw-interlanguage-selector is not keyboard-focusable

Event Timeline

Etonkovidova created this task.Aug 3 2026, 7:29 PM

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptAug 3 2026, 7:29 PM

Etonkovidova mentioned this in T428690: QA simplified Minerva toolbelt on local/beta/test wiki.Aug 3 2026, 7:33 PM

• mfossati triaged this task as High priority.Aug 4 2026, 9:25 AM

• mfossati added a parent task: T428692: Minerva simplified toolbelt bug bash.

• mfossati added a project: Reader Growth Team (Sprint 3 (Jul 29 - Aug 11) Q1 FY26-27).

lwatson claimed this task.Aug 4 2026, 12:00 PM

Change #1321226 had a related patch set uploaded (by LWatson; author: LWatson):

[mediawiki/skins/MinervaNeue@master] Minimal Minerva: make language chip keyboard accessible

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

gerritbot added a project: Patch-For-Review.Aug 5 2026, 3:10 AM

Test wiki created on Patch demo by LWatson-WMF using patch(es) linked to this task:
https://071f18d3a6.catalyst.wmcloud.org/wiki/Main Page

lwatson moved this task from Committed to Doing on the Reader Growth Team (Sprint 3 (Jul 29 - Aug 11) Q1 FY26-27) board.Aug 5 2026, 3:18 AM

Test wiki created on Patch demo by LWatson-WMF using patch(es) linked to this task:
https://1fc44a46e6.catalyst.wmcloud.org/wiki/Main Page

Test wiki on Patch demo by LWatson-WMF using patch(es) linked to this task was deleted:

~~https://071f18d3a6.catalyst.wmcloud.org/wiki/Main Page~~

Verified the fix locally and on patchdemo (https://1fc44a46e6.catalyst.wmcloud.org/w/index.php?title=Polar_bear&minMinToolbar=1).

Expected behavior:

Language chip is an anchor tag with button role (<a role="button">)
Comments chip is a plain anchor tag (<a>)
Both chips are wrapped inside a list container (<ul>/<li>)
Language chip is keyboard accessible/focusable via key tabs
Enter key activates the language chip/fake button and opens the language selector overlay
Screen reader announces language chip as a button

lwatson changed the subtype of this task from "Task" to "Bug Report".Aug 7 2026, 12:15 AM

In T433882#12189690, @lwatson wrote:

Expected behavior:

Language chip is an anchor tag with button role (<a role="button">)

✅

Comments chip is a plain anchor tag (<a>)

✅

Both chips are wrapped inside a list container (<ul>/<li>)

✅

Language chip is keyboard accessible/focusable via key tabs

✅, although there's no visible focus/hover affordance, see https://gerrit.wikimedia.org/r/c/mediawiki/skins/MinervaNeue/+/1321226/comment/0b33a32e_26a3644d/

Enter key activates the language chip/fake button and opens the language selector overlay

✅

Screen reader announces language chip as a button

✅ verified with latest TalkBack on Android 13.

Test wiki on Patch demo by LWatson-WMF using patch(es) linked to this task was deleted:

~~https://1fc44a46e6.catalyst.wmcloud.org/wiki/Main Page~~

Test wiki created on Patch demo by LWatson-WMF using patch(es) linked to this task:
https://e7303a21a1.catalyst.wmcloud.org/wiki/Main Page

Updated the patch with hover styles similar to those of Codex progressive buttons (https://doc.wikimedia.org/codex/latest/components/demos/button.html).
Live demo via patchdemo: https://e7303a21a1.catalyst.wmcloud.org/wiki/Cat?minMinToolbar=1&useformat=mobile

Hover:

Focus:

Change #1321226 merged by jenkins-bot:

[mediawiki/skins/MinervaNeue@master] Minimal Minerva: make language chip keyboard accessible

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

Maintenance_bot removed a project: Patch-For-Review.Aug 11 2026, 10:31 AM

ReleaseTaggerBot added a project: MW-1.47-notes (1.47.0-wmf.16; 2026-08-18).Aug 11 2026, 11:00 AM

• mfossati moved this task from Code Review to QA on the Reader Growth Team (Sprint 3 (Jul 29 - Aug 11) Q1 FY26-27) board.Aug 11 2026, 11:07 AM

lwatson updated the task description. (Show Details)Aug 11 2026, 6:19 PM

Moving to sign off since Marco and I verified the expected behavior as per the list in the task description.
Note: Elena is out of the office

I had a look at the patch demo. A couple tweaks here. The focus/hover/active states should follow the same rules as a progressive-normal button in Codex. So an outline appears when it's in focus, which is correct based on the screenshots above and the colours shift slightly in the hover and active states, which seem to be missing.

Change #1324743 had a related patch set uploaded (by LWatson; author: LWatson):

[mediawiki/skins/MinervaNeue@master] Minimal Minerva: page chip's active/hover styles

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

gerritbot added a project: Patch-For-Review.Wed, Aug 12, 2:48 PM

latest patch (1324743) addresses feedback about interactive states. The chip's background color, text color, and icon color change when the chip (anchor element) is active/hover. The styles mirror Codex progressive buttons.

lwatson set the point value for this task to 2.Wed, Aug 12, 3:01 PM

Change #1324743 merged by jenkins-bot:

[mediawiki/skins/MinervaNeue@master] Minimal Minerva: page chip's active/hover styles

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

Maintenance_bot removed a project: Patch-For-Review.Wed, Aug 12, 3:32 PM

Test wiki on Patch demo by LWatson-WMF using patch(es) linked to this task was deleted:

~~https://e7303a21a1.catalyst.wmcloud.org/wiki/Main Page~~

lwatson closed this task as Resolved.Wed, Aug 12, 4:49 PM

lwatson updated the task description. (Show Details)Wed, Aug 12, 7:45 PM

KSarabia-WMF mentioned this in T434653: [MinMin] Launch experiment.Mon, Aug 17, 5:22 PM

[a11y] Minimized toolbar - mw-interlanguage-selector is not keyboard-focusableClosed, ResolvedPublic2 Estimated Story PointsBUG REPORTActions

Description

Details

Related ObjectsSearch...

Event Timeline

[a11y] Minimized toolbar - mw-interlanguage-selector is not keyboard-focusable
Closed, ResolvedPublic2 Estimated Story PointsBUG REPORT
Actions

Related Objects
Search...