archive/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-08-15 13:38:29 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: includes aria-label in table header when column is sorted (#52772)

Browse source 
* Fixes aria label in table header

* Fixes demo snapshot

* More snapshot updates

* Updates tests
This commit is contained in:
Mike Ellis 2025-02-12 22:12:30 -05:00 • committed by GitHub
parent 5ca55f81cb
commit 09efe6946e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 6 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

4
components/table/__tests__/Table.sorter.test.tsx
View file

@ -149,11 +149,11 @@ describe('Table.sorter', () => {
expect(renderedNames(container)).toEqual(['Tom', 'Lucy', 'Jack', 'Jerry']);
expect(getNameColumn()?.getAttribute('aria-sort')).toEqual('descending');
expect(getNameColumn()?.getAttribute('aria-label')).toEqual(null);
expect(getNameColumn()?.getAttribute('aria-label')).toEqual('Name');
fireEvent.click(container.querySelector('.ant-table-column-sorters')!);
expect(getNameColumn()?.getAttribute('aria-sort')).toEqual('ascending');
expect(getNameColumn()?.getAttribute('aria-label')).toEqual(null);
expect(getNameColumn()?.getAttribute('aria-label')).toEqual('Name');
fireEvent.click(container.querySelector('.ant-table-column-sorters')!);
expect(getNameColumn()?.getAttribute('aria-sort')).toEqual(null);

1
components/table/__tests__/__snapshots__/Table.sorter.test.tsx.snap
View file

@ -125,6 +125,7 @@ exports[`Table.sorter should support defaultOrder in Column 1`] = `
>
<tr>
<th
aria-label="Age"
aria-sort="ascending"
class="ant-table-cell ant-table-column-sort ant-table-column-has-sorters"
scope="col"

1
components/table/__tests__/__snapshots__/demo-extend.test.ts.snap
View file

@ -15151,6 +15151,7 @@ exports[`renders components/table/demo/head.tsx extend context correctly 1`] = `
</div>
</th>
<th
aria-label="Age"
aria-sort="descending"
class="ant-table-cell ant-table-column-sort ant-table-column-has-sorters"
scope="col"

1
components/table/__tests__/__snapshots__/demo.test.ts.snap
View file

@ -15379,6 +15379,7 @@ exports[`renders components/table/demo/head.tsx correctly 1`] = `
</div>
</th>
<th
aria-label="Age"
aria-sort="descending"
class="ant-table-cell ant-table-column-sort ant-table-column-has-sorters"
scope="col"

3
components/table/hooks/useSorter.tsx
View file

@ -246,9 +246,8 @@ const injectSorter = <RecordType extends AnyObject = AnyObject>(
// Inform the screen-reader so it can tell the visually impaired user which column is sorted
if (sortOrder) {
cell['aria-sort'] = sortOrder === 'ascend' ? 'ascending' : 'descending';
} else {
cell['aria-label'] = displayTitle || '';
}
cell['aria-label'] = displayTitle || '';
cell.className = classNames(cell.className, `${prefixCls}-column-has-sorters`);
cell.tabIndex = 0;
if (column.ellipsis) {