diff --git a/src/table/internal.tsx b/src/table/internal.tsx index 549561c6e7..a8d07aebd7 100644 --- a/src/table/internal.tsx +++ b/src/table/internal.tsx @@ -330,8 +330,12 @@ const InternalTable = React.forwardRef( resizableColumns && styles['table-layout-fixed'], contentDensity === 'compact' && getVisualContextClassname('compact-table') )} - aria-labelledby={isLabelledByHeader ? headingId : undefined} - {...getTableRoleProps({ tableRole, totalItemsCount, ariaLabel: ariaLabels?.tableLabel })} + {...getTableRoleProps({ + tableRole, + totalItemsCount, + ariaLabel: ariaLabels?.tableLabel, + ariaLabelledBy: isLabelledByHeader && headerIdRef.current ? headerIdRef.current : undefined, + })} > { const nativeProps: React.TableHTMLAttributes = {}; @@ -28,6 +29,7 @@ export function getTableRoleProps(options: { nativeProps.role = options.tableRole; nativeProps['aria-label'] = options.ariaLabel; + nativeProps['aria-labelledby'] = options.ariaLabelledBy; // Incrementing the total count by one to account for the header row. nativeProps['aria-rowcount'] = options.totalItemsCount ? options.totalItemsCount + 1 : -1;