Administration: Make subpage hierarchy in post list tables accessible.

In post list tables, subpages within hierarchical post types were visibly marked using an em dash to represent their nesting position. This information was not communicated in any way to screen reader users. Add `aria-describedby` with associated descriptive text to linked post titles, and screen reader text for non-editable post title contexts.

Developed in WordPress#12394

Props juliemoynat, audrasjb, ekaterina92, ishikaatxecurify, aion11, sabernhardt, maxerns, joedolson.
Fixes #64932.

git-svn-id: https://develop.svn.wordpress.org/trunk@62814 602fd350-edb4-49c9-b593-d223f7449a82

Author: joedolson

src/wp-admin/includes/class-wp-posts-list-table.php

@@ -1174,7 +1174,38 @@ public function column_title( $post ) {
 			echo '<div class="locked-info"><span class="locked-avatar">' . $locked_avatar . '</span> <span class="locked-text">' . $locked_text . "</span></div>\n";
 		}
 
-		$pad = str_repeat( '&#8212; ', $this->current_level );
+		$pad               = str_repeat(
+			'<span aria-hidden="true">&#8212;</span> ',
+			$this->current_level
+		);
+		$described_by_attr = '';
+		$hierarchy_linked  = '';
+		$hierarchy_nolink  = '';
+
+		if ( $post->post_parent ) {
+			$parent = get_post( $post->post_parent );
+
+			if ( $parent ) {
+				/** This filter is documented in wp-includes/post-template.php */
+				$parent_title = apply_filters( 'the_title', $parent->post_title, $parent->ID );
+
+				$hierarchy_id      = 'post-hierarchy-' . $post->ID;
+				$described_by_attr = sprintf( ' aria-describedby="%s"', esc_attr( $hierarchy_id ) );
+				$hierarchy_linked  = sprintf(
+					'<span id="%1$s" class="hidden">%2$s</span>',
+					esc_attr( $hierarchy_id ),
+					/* translators: %s: Parent post title. */
+					esc_html( sprintf( __( 'Child of %s' ), wp_strip_all_tags( $parent_title ) ) )
+				);
+				$hierarchy_nolink  = sprintf(
+					'<span id="%1$s" class="screen-reader-text"> (%2$s)</span>',
+					esc_attr( $hierarchy_id ),
+					/* translators: %s: Parent post title. */
+					esc_html( sprintf( __( 'Child of %s' ), wp_strip_all_tags( $parent_title ) ) )
+				);
+			}
+		}
+
 		echo '<strong>';
 
 		$title = _draft_or_post_title();
@@ -1187,16 +1218,19 @@ public function column_title( $post ) {
 
 		if ( $can_edit_post && 'trash' !== $post->post_status ) {
 			printf(
-				'<a class="row-title" href="%s">%s%s</a>',
-				get_edit_post_link( $post->ID ),
+				'%1$s<a class="row-title" href="%2$s"%3$s>%4$s</a>%5$s',
 				$pad,
-				$title
+				get_edit_post_link( $post->ID ),
+				$described_by_attr,
+				$title,
+				$hierarchy_linked
 			);
 		} else {
 			printf(
-				'<span>%s%s</span>',
+				'%1$s<span>%2$s%3$s</span>',
 				$pad,
-				$title
+				$title,
+				$hierarchy_nolink
 			);
 		}
 		_post_states( $post );

tests/phpunit/tests/admin/wpPostsListTable.php

@@ -196,6 +196,61 @@ public function test_grandchildren_hierarchical_pages_second_page() {
 		);
 	}
 
+	/**
+	 * @ticket 64932
+	 *
+	 * @covers WP_Posts_List_Table::display_rows
+	 * @covers WP_Posts_List_Table::set_hierarchical_display
+	 * @covers WP_Posts_List_Table::column_title
+	 */
+	public function test_child_page_row_title_has_hierarchy_description() {
+		wp_set_current_user( self::factory()->user->create( array( 'role' => 'administrator' ) ) );
+
+		$output = $this->get_hierarchical_page_list_output(
+			array(
+				self::$top[1],
+				self::$children[1][1],
+			)
+		);
+
+		$expected = sprintf(
+			'<span aria-hidden="true">&#8212;</span> ' .
+			'<a class="row-title" href="%1$s" aria-describedby="post-hierarchy-%2$d">Child 1</a>' .
+			'<span id="post-hierarchy-%2$d" class="hidden">Child of Top Level Page 1</span>',
+			get_edit_post_link( self::$children[1][1]->ID ),
+			self::$children[1][1]->ID
+		);
+
+		$this->assertStringContainsString( $expected, $output );
+	}
+
+	/**
+	 * @ticket 64932
+	 *
+	 * @covers WP_Posts_List_Table::display_rows
+	 * @covers WP_Posts_List_Table::set_hierarchical_display
+	 * @covers WP_Posts_List_Table::column_title
+	 */
+	public function test_top_level_page_row_title_does_not_have_hierarchy_description() {
+		wp_set_current_user( self::factory()->user->create( array( 'role' => 'administrator' ) ) );
+
+		$output = $this->get_hierarchical_page_list_output(
+			array(
+				self::$top[1],
+			)
+		);
+
+		$this->assertStringContainsString(
+			sprintf(
+				'<a class="row-title" href="%s">Top Level Page 1</a>',
+				get_edit_post_link( self::$top[1]->ID )
+			),
+			$output
+		);
+		$this->assertStringNotContainsString( 'aria-describedby="post-hierarchy-', $output );
+		$this->assertStringNotContainsString( 'class="hidden">Child of ', $output );
+	}
+
 	/**
 	 * Helper function to test the output of a page which uses `WP_Posts_List_Table`.
 	 *
@@ -245,6 +300,27 @@ protected function _test_list_hierarchical_page( array $args, array $expected_id
 		}
 	}
 
+	/**
+	 * Gets the output for a hierarchical page list table.
+	 *
+	 * @param WP_Post[] $posts Posts to display.
+	 * @return string List table rows output.
+	 */
+	protected function get_hierarchical_page_list_output( array $posts ) {
+		$_REQUEST['paged']   = 1;
+		$GLOBALS['per_page'] = 20;
+
+		ob_start();
+		$this->table->set_hierarchical_display( true );
+		$this->table->display_rows( $posts );
+		$output = ob_get_clean();
+
+		unset( $_REQUEST['paged'] );
+		unset( $GLOBALS['per_page'] );
+
+		return $output;
+	}
+
 	/**
 	 * @ticket 37407
 	 *