From: jdlrobson <jdlrobson@gmail.com>
Date: Mon, 12 Nov 2018 23:43:05 +0000 (-0800)
Subject: Accessibility: Improve contributions navigation for screen reader users
X-Git-Tag: 1.34.0-rc.0~3503^2
X-Git-Url: http://git.cyclocoop.org/?a=commitdiff_plain;h=394690e53eca5a167e1f65efae47811fa799a858;p=lhc%2Fweb%2Fwiklou.git

Accessibility: Improve contributions navigation for screen reader users

`.mw-changeslist-link-list` is not a list element any more per user
feedback and renamed `mw-changeslist-links`

Changing the class name has no implications on caching as this
only impacts Special:Contributions

Bug: T205581
Change-Id: Id2faaaa847c9a9ad57da5942ca9cf92462089d3a
---

diff --git a/includes/specials/pagers/ContribsPager.php b/includes/specials/pagers/ContribsPager.php
index 18da235fde..b42af9b5eb 100644
--- a/includes/specials/pagers/ContribsPager.php
+++ b/includes/specials/pagers/ContribsPager.php
@@ -568,10 +568,17 @@ class ContribsPager extends RangeChronologicalPager {
 				$del .= ' ';
 			}
 
-			$diffHistLinks = Html::rawElement( 'ul',
-				[ 'class' => 'mw-changeslist-link-list' ],
-				Html::rawElement( 'li', [], $difftext ) .
-				Html::rawElement( 'li', [], $histlink )
+			// While it might be tempting to use a list here
+			// this would result in clutter and slows down navigating the content
+			// in assistive technology.
+			// See https://phabricator.wikimedia.org/T205581#4734812
+			$diffHistLinks = Html::rawElement( 'span',
+				[ 'class' => 'mw-changeslist-links' ],
+				// The spans are needed to ensure the dividing '|' elements are not
+				// themselves styled as links.
+				Html::rawElement( 'span', [], $difftext ) .
+				' ' . // Space needed for separating two words.
+				Html::rawElement( 'span', [], $histlink )
 			);
 
 			# Tags, if any.
diff --git a/resources/src/mediawiki.special.changeslist.less b/resources/src/mediawiki.special.changeslist.less
index 34b0836c85..3785ff817c 100644
--- a/resources/src/mediawiki.special.changeslist.less
+++ b/resources/src/mediawiki.special.changeslist.less
@@ -67,12 +67,8 @@
 	content: '. .';
 }
 
-.mw-changeslist-link-list {
+.mw-changeslist-links {
 	display: inline-block;
-	/* In @media print, list elements have margins and/or paddings defined.
-	We don't want to see margins/paddings on these elements under any circumstances. */
-	margin: 0;
-	padding: 0;
 
 	&:before {
 		content: '@{msg-parentheses-start}';
@@ -81,11 +77,7 @@
 		content: '@{msg-parentheses-end}';
 	}
 
-	> li {
-		display: inline;
-
-		&:not( :first-child ):before {
-			content: '@{msg-pipe-separator}';
-		}
+	> span:not( :first-child ):before {
+		content: '@{msg-pipe-separator}';
 	}
 }