Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix(table): reset aria-label in table column #39738

Merged
merged 2 commits into from Dec 22, 2022
Merged

fix(table): reset aria-label in table column #39738

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
3be66ea
feat: reset aria-label in table column
kiner-tang Dec 22, 2022
a52336a
feat: reset aria-label in table column
kiner-tang Dec 22, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
14 changes: 7 additions & 7 deletions components/config-provider/__tests__/__snapshots__/components.test.tsx.snap
View file
Open in desktop
Expand Up @@ -26610,7 +26610,7 @@ exports[`ConfigProvider components Table configProvider 1`] = `
>
<tr>
<th
aria-label="this column's title is Name,this column is sortable"
aria-label="Name"
class="config-table-cell config-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -26916,7 +26916,7 @@ exports[`ConfigProvider components Table configProvider componentDisabled 1`] =
>
<tr>
<th
aria-label="this column's title is Name,this column is sortable"
aria-label="Name"
class="config-table-cell config-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -27224,7 +27224,7 @@ exports[`ConfigProvider components Table configProvider componentSize large 1`]
>
<tr>
<th
aria-label="this column's title is Name,this column is sortable"
aria-label="Name"
class="config-table-cell config-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -27530,7 +27530,7 @@ exports[`ConfigProvider components Table configProvider componentSize middle 1`]
>
<tr>
<th
aria-label="this column's title is Name,this column is sortable"
aria-label="Name"
class="config-table-cell config-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -27836,7 +27836,7 @@ exports[`ConfigProvider components Table configProvider virtual and dropdownMatc
>
<tr>
<th
aria-label="this column's title is Name,this column is sortable"
aria-label="Name"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -28142,7 +28142,7 @@ exports[`ConfigProvider components Table normal 1`] = `
>
<tr>
<th
aria-label="this column's title is Name,this column is sortable"
aria-label="Name"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -28448,7 +28448,7 @@ exports[`ConfigProvider components Table prefixCls 1`] = `
>
<tr>
<th
aria-label="this column's title is Name,this column is sortable"
aria-label="Name"
class="prefix-Table-cell prefix-Table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down
4 changes: 1 addition & 3 deletions components/table/__tests__/Table.sorter.test.tsx
View file
Open in desktop
Expand Up @@ -105,9 +105,7 @@ describe('Table.sorter', () => {

fireEvent.click(container.querySelector('.ant-table-column-sorters')!);
expect(getNameColumn()?.getAttribute('aria-sort')).toEqual(null);
expect(getNameColumn()?.getAttribute('aria-label')).toEqual(
"this column's title is Name,this column is sortable",
);
expect(getNameColumn()?.getAttribute('aria-label')).toEqual('Name');
});

it('sort records', () => {
Expand Down
2 changes: 1 addition & 1 deletion components/table/__tests__/__snapshots__/Table.sorter.test.tsx.snap
View file
Open in desktop
Expand Up @@ -6,7 +6,7 @@ exports[`Table.sorter renders sorter icon correctly 1`] = `
>
<tr>
<th
aria-label="this column's title is Name,this column is sortable"
aria-label="Name"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down
10 changes: 5 additions & 5 deletions components/table/__tests__/__snapshots__/Table.test.tsx.snap
View file
Open in desktop
Expand Up @@ -237,7 +237,7 @@ exports[`Table should render title 1`] = `
>
<tr>
<th
aria-label="this column is sortable"
aria-label=""
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -306,7 +306,7 @@ exports[`Table should render title 1`] = `
</div>
</th>
<th
aria-label="this column is sortable"
aria-label=""
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -370,7 +370,7 @@ exports[`Table should render title 1`] = `
</div>
</th>
<th
aria-label="this column is sortable"
aria-label=""
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -439,7 +439,7 @@ exports[`Table should render title 1`] = `
</div>
</th>
<th
aria-label="this column's title is color,this column is sortable"
aria-label="color"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -501,7 +501,7 @@ exports[`Table should render title 1`] = `
</div>
</th>
<th
aria-label="this column's title is sex,this column is sortable"
aria-label="sex"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down
28 changes: 14 additions & 14 deletions components/table/__tests__/__snapshots__/demo-extend.test.ts.snap
View file
Open in desktop
Expand Up @@ -1559,7 +1559,7 @@ exports[`renders ./components/table/demo/custom-filter-panel.tsx extend context
</div>
</th>
<th
aria-label="this column's title is Address,this column is sortable"
aria-label="Address"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -3203,7 +3203,7 @@ Array [
Name
</th>
<th
aria-label="this column's title is Age,this column is sortable"
aria-label="Age"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -3516,7 +3516,7 @@ Array [
</div>
</th>
<th
aria-label="this column's title is Action,this column is sortable"
aria-label="Action"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -7496,7 +7496,7 @@ exports[`renders ./components/table/demo/filter-in-tree.tsx extend context corre
</div>
</th>
<th
aria-label="this column's title is Age,this column is sortable"
aria-label="Age"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -8319,7 +8319,7 @@ exports[`renders ./components/table/demo/filter-search.tsx extend context correc
</div>
</th>
<th
aria-label="this column's title is Age,this column is sortable"
aria-label="Age"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -12166,7 +12166,7 @@ exports[`renders ./components/table/demo/grouping-columns.tsx extend context cor
</tr>
<tr>
<th
aria-label="this column's title is Age,this column is sortable"
aria-label="Age"
class="ant-table-cell ant-table-column-has-sorters"
rowspan="3"
scope="col"
Expand Down Expand Up @@ -13261,7 +13261,7 @@ exports[`renders ./components/table/demo/head.tsx extend context correctly 1`] =
>
<tr>
<th
aria-label="this column's title is Name,this column is sortable"
aria-label="Name"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -14623,7 +14623,7 @@ exports[`renders ./components/table/demo/multiple-sorter.tsx extend context corr
Name
</th>
<th
aria-label="this column's title is Chinese Score,this column is sortable"
aria-label="Chinese Score"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -14709,7 +14709,7 @@ exports[`renders ./components/table/demo/multiple-sorter.tsx extend context corr
</div>
</th>
<th
aria-label="this column's title is Math Score,this column is sortable"
aria-label="Math Score"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -14795,7 +14795,7 @@ exports[`renders ./components/table/demo/multiple-sorter.tsx extend context corr
</div>
</th>
<th
aria-label="this column's title is English Score,this column is sortable"
aria-label="English Score"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -20341,7 +20341,7 @@ Array [
>
<tr>
<th
aria-label="this column's title is Name,this column is sortable"
aria-label="Name"
class="ant-table-cell ant-table-cell-ellipsis ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -20649,7 +20649,7 @@ Array [
</div>
</th>
<th
aria-label="this column's title is Age,this column is sortable"
aria-label="Age"
class="ant-table-cell ant-table-cell-ellipsis ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -20736,7 +20736,7 @@ Array [
</div>
</th>
<th
aria-label="this column's title is Address,this column is sortable"
aria-label="Address"
class="ant-table-cell ant-table-cell-ellipsis ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -21280,7 +21280,7 @@ exports[`renders ./components/table/demo/resizable-column.tsx extend context cor
/>
</th>
<th
aria-label="this column's title is Amount,this column is sortable"
aria-label="Amount"
class="ant-table-cell ant-table-column-has-sorters react-resizable"
scope="col"
tabindex="0"
Expand Down
28 changes: 14 additions & 14 deletions components/table/__tests__/__snapshots__/demo.test.ts.snap
View file
Open in desktop
Expand Up @@ -1151,7 +1151,7 @@ exports[`renders ./components/table/demo/custom-filter-panel.tsx correctly 1`] =
</div>
</th>
<th
aria-label="this column's title is Address,this column is sortable"
aria-label="Address"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -2673,7 +2673,7 @@ Array [
Name
</th>
<th
aria-label="this column's title is Age,this column is sortable"
aria-label="Age"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -2774,7 +2774,7 @@ Array [
</div>
</th>
<th
aria-label="this column's title is Action,this column is sortable"
aria-label="Action"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -5772,7 +5772,7 @@ exports[`renders ./components/table/demo/filter-in-tree.tsx correctly 1`] = `
</div>
</th>
<th
aria-label="this column's title is Age,this column is sortable"
aria-label="Age"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -6121,7 +6121,7 @@ exports[`renders ./components/table/demo/filter-search.tsx correctly 1`] = `
</div>
</th>
<th
aria-label="this column's title is Age,this column is sortable"
aria-label="Age"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -9322,7 +9322,7 @@ exports[`renders ./components/table/demo/grouping-columns.tsx correctly 1`] = `
</tr>
<tr>
<th
aria-label="this column's title is Age,this column is sortable"
aria-label="Age"
class="ant-table-cell ant-table-column-has-sorters"
rowspan="3"
scope="col"
Expand Down Expand Up @@ -10289,7 +10289,7 @@ exports[`renders ./components/table/demo/head.tsx correctly 1`] = `
>
<tr>
<th
aria-label="this column's title is Name,this column is sortable"
aria-label="Name"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -11030,7 +11030,7 @@ exports[`renders ./components/table/demo/multiple-sorter.tsx correctly 1`] = `
Name
</th>
<th
aria-label="this column's title is Chinese Score,this column is sortable"
aria-label="Chinese Score"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -11092,7 +11092,7 @@ exports[`renders ./components/table/demo/multiple-sorter.tsx correctly 1`] = `
</div>
</th>
<th
aria-label="this column's title is Math Score,this column is sortable"
aria-label="Math Score"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -11154,7 +11154,7 @@ exports[`renders ./components/table/demo/multiple-sorter.tsx correctly 1`] = `
</div>
</th>
<th
aria-label="this column's title is English Score,this column is sortable"
aria-label="English Score"
class="ant-table-cell ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -15411,7 +15411,7 @@ Array [
>
<tr>
<th
aria-label="this column's title is Name,this column is sortable"
aria-label="Name"
class="ant-table-cell ant-table-cell-ellipsis ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -15507,7 +15507,7 @@ Array [
</div>
</th>
<th
aria-label="this column's title is Age,this column is sortable"
aria-label="Age"
class="ant-table-cell ant-table-cell-ellipsis ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -15570,7 +15570,7 @@ Array [
</div>
</th>
<th
aria-label="this column's title is Address,this column is sortable"
aria-label="Address"
class="ant-table-cell ant-table-cell-ellipsis ant-table-column-has-sorters"
scope="col"
tabindex="0"
Expand Down Expand Up @@ -15902,7 +15902,7 @@ exports[`renders ./components/table/demo/resizable-column.tsx correctly 1`] = `
/>
</th>
<th
aria-label="this column's title is Amount,this column is sortable"
aria-label="Amount"
class="ant-table-cell ant-table-column-has-sorters react-resizable"
scope="col"
tabindex="0"
Expand Down
4 changes: 1 addition & 3 deletions components/table/hooks/useSorter.tsx
View file
Open in desktop
Expand Up @@ -212,9 +212,7 @@ function injectSorter<RecordType>(
if (sorterOrder) {
cell['aria-sort'] = sorterOrder === 'ascend' ? 'ascending' : 'descending';
} else {
cell['aria-label'] = `${
displayTitle ? `this column's title is ${displayTitle},` : ''
}this column is sortable`;
cell['aria-label'] = displayTitle || '';
}
cell.className = classNames(cell.className, `${prefixCls}-column-has-sorters`);
cell.tabIndex = 0;
Expand Down