Changeset 62838 for trunk/src/wp-admin/includes/class-wp-list-table.php

Timestamp:

07/23/2026 08:59:29 PM (2 months ago)

Author:

joedolson

Message:

Administration: Use post title column as table header in post lists.

The select column has been the th with row scope for post list tables since at least 2010. This results in a row name for screen readers that is based on the checkbox input and its label, which can be an empty value when that input is not available.

Move the th to the post title column, change the select column to td, and add aria-label to the th to provide a simplified row name to supporting screen readers.

Styles are additive, to retain support for custom list table implementations.

Developed in ​https://github.com/WordPress/wordpress-develop/pull/9761

Props afercia, abcd95, ozgursar, nikunj8866, joedolson.
Fixes #32892.

File:

• trunk/src/wp-admin/includes/class-wp-list-table.php (modified) (3 diffs)

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

@@ -1769 +1769 @@
 
         /**
+         * Returns a clean, human-readable label for the primary column's row header.
+         *
+         * Used as the `aria-label` attribute value on the `<th scope="row">` element,
+         * giving screen readers a concise cell name instead of computing it from
+         * the full cell content (which may include row action links, excerpts, etc.).
+         *
+         * Subclasses should override this method to return the item's primary
+         * identifier (e.g. post title, plugin name, username). Return an empty string
+         * to omit the attribute.
+         *
+         * @since 6.9.0
+         *
+         * @param object|array $item The current item.
+         * @return string The aria-label value, or an empty string.
+         */
+        protected function get_primary_column_aria_label( $item ) {
+                return '';
+        }
+
+        /**
          * Generates the columns for a single row of the table.
          *
@@ -1797 +1817 @@
 
                         if ( 'cb' === $column_name ) {
-                                echo '<th scope="row" class="check-column">';
+                                echo '<td class="check-column">';
                                 echo $this->column_cb( $item );
-                                echo '</th>';
+                                echo '</td>';
                         } elseif ( method_exists( $this, '_column_' . $column_name ) ) {
                                 echo call_user_func(
@@ -1808 +1828 @@
                                         $primary
                                 );
-                        } elseif ( method_exists( $this, 'column_' . $column_name ) ) {
-                                echo "<td $attributes>";
-                                echo call_user_func( array( $this, 'column_' . $column_name ), $item );
+                        } else {
+                                $is_primary = ( $primary === $column_name );
+                                $tag        = $is_primary ? 'th' : 'td';
+                                $scope      = $is_primary ? ' scope="row"' : '';
+
+                                $aria_label = '';
+                                if ( $is_primary ) {
+                                        $label = $this->get_primary_column_aria_label( $item );
+                                        if ( '' !== $label ) {
+                                                $aria_label = ' aria-label="' . esc_attr( $label ) . '"';
+                                        }
+                                }
+
+                                echo "<$tag $attributes$scope$aria_label>";
+
+                                if ( method_exists( $this, 'column_' . $column_name ) ) {
+                                        echo call_user_func( array( $this, 'column_' . $column_name ), $item );
+                                } else {
+                                        echo $this->column_default( $item, $column_name );
+                                }
+
                                 echo $this->handle_row_actions( $item, $column_name, $primary );
-                                echo '</td>';
-                        } else {
-                                echo "<td $attributes>";
-                                echo $this->column_default( $item, $column_name );
-                                echo $this->handle_row_actions( $item, $column_name, $primary );
-                                echo '</td>';
+                                echo "</$tag>";
                         }
                 }