Adding aria-sort to table view headers (#56860)

Ensures sorting semantics are not just communicated visually
WordPress · Dec 7, 2023 · 5067361 · 5067361 · github-actions · Dec 7, 2023
1 parent e63ef38
commit 5067361
Showing 1 changed file with 8 additions and 0 deletions.
diff --git a/packages/dataviews/src/view-table.js b/packages/dataviews/src/view-table.js
@@ -545,6 +545,9 @@ function ViewTable( {
 		// TODO:Add spinner or progress bar..
 		return <h3>{ __( 'Loading' ) }</h3>;
 	}
+
+	const sortValues = { asc: 'ascending', desc: 'descending' };
+
 	return (
 		<div className="dataviews-table-view-wrapper">
 			{ hasRows && (
@@ -568,6 +571,11 @@ function ViewTable( {
 													.maxWidth || undefined,
 										} }
 										data-field-id={ header.id }
+										aria-sort={
+											sortValues[
+												header.column.getIsSorted()
+											]
+										}
 									>
 										<HeaderMenu
 											dataView={ dataView }