Page MenuHomePhabricator

Site navigation refers to undefined ARIA label (Minerva)
Closed, ResolvedPublic

Description

This was flagged by a recent Lighthouse audit, and may affect Google Search due to being included by PageSpeed Insights and Search Console as of last year.

[aria-*] attributes do not have valid values
Assistive technologies, like screen readers, can't interpret ARIA attributes with invalid values.

Failing Elements
<nav class="minerva-user-navigation" aria-labelledby="minerva-user-menu-toggle"> <div><button id="searchIcon" class="mw-ui-icon mw-ui-icon-element mw-ui-icon-wikimedia-search-base20 skin-minerva-search-trigger" type="submit">Search</button></div> </nav>

I've confirmed against production page views that the navigation element indeed points to minerva-user-menu-toggle but there appears to be no id="minerva-user-menu-toggle" element in the HTML.

QA

  • Visit https://en.m.wikipedia.beta.wmflabs.org/wiki/Barack%20Obama in Google Chrome
  • Open developer tools and click audit tab
  • Under audits make sure only accessibility is checked
  • Click "run audits"
  • In the report there should be no mention of "[aria-*] attributes do not have valid values". The score should be higher than or at least equal to 93. Please report here with the score.

QA Results

ACStatusDetails
1T242281#5800937
2T242281#5800937

Event Timeline

Change 563591 had a related patch set uploaded (by Niedzielski; owner: Stephen Niedzielski):
[mediawiki/skins/MinervaNeue@master] Fix: user navigation label when AMC is disabled

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

Change 563591 merged by jenkins-bot:
[mediawiki/skins/MinervaNeue@master] Fix: user navigation label when AMC is disabled

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

Edtadros added a subscriber: Edtadros.

Test Result

Status: ✅ PASS
OS: macOS Catalina
Browser: Chrome
Device: MBP
Emulated Device: iPhoneX

Test Artifact(s):

QA

Visit https://en.m.wikipedia.beta.wmflabs.org/wiki/Barack%20Obama in Google Chrome
Open developer tools and click audit tab
Under audits make sure only accessibility is checked
Click "run audits"
✅ AC1: In the report there should be no mention of "[aria-*] attributes do not have valid values".
✅ AC2: The score should be higher than or at least equal to 93. Please report here with the score.

Screen Shot 2020-01-14 at 1.13.09 AM.png (350×492 px, 26 KB)