diff --git a/.changeset/tender-dodos-walk.md b/.changeset/tender-dodos-walk.md
new file mode 100644
index 00000000000..3ba0bcc752b
--- /dev/null
+++ b/.changeset/tender-dodos-walk.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+fix(Treevieew):do not add aria-describedby attribute when empty leading/trailing visual
diff --git a/packages/react/src/TreeView/TreeView.test.tsx b/packages/react/src/TreeView/TreeView.test.tsx
index 056b6714acb..7f54aecad2e 100644
--- a/packages/react/src/TreeView/TreeView.test.tsx
+++ b/packages/react/src/TreeView/TreeView.test.tsx
@@ -189,6 +189,19 @@ describe('Markup', () => {
expect(noDescription).toHaveAccessibleDescription(' ')
})
+ it('should not have aria-describedby when no leading or trailing visual', () => {
+ const {getByLabelText} = renderWithTheme(
+
+ Item 1
+ Item 2
+ ,
+ )
+
+ const noDescription = getByLabelText(/Item 1/)
+ expect(noDescription).not.toHaveAccessibleDescription()
+ expect(noDescription).not.toHaveAttribute('aria-describedby')
+ })
+
it('should include `aria-expanded` when a SubTree contains content', async () => {
const user = userEvent.setup({
advanceTimers: jest.advanceTimersByTime,
diff --git a/packages/react/src/TreeView/TreeView.tsx b/packages/react/src/TreeView/TreeView.tsx
index b891aa97a74..e9f266f3493 100644
--- a/packages/react/src/TreeView/TreeView.tsx
+++ b/packages/react/src/TreeView/TreeView.tsx
@@ -458,6 +458,11 @@ const Item = React.forwardRef(
[onSelect, setIsExpandedWithCache, toggle],
)
+ const ariaDescribedByIds = [
+ slots.leadingVisual ? leadingVisualId : null,
+ slots.trailingVisual ? trailingVisualId : null,
+ ].filter(Boolean)
+
return (
(
role="treeitem"
aria-label={ariaLabel}
aria-labelledby={ariaLabel ? undefined : ariaLabelledby || labelId}
- aria-describedby={`${leadingVisualId} ${trailingVisualId}`}
+ aria-describedby={ariaDescribedByIds.length ? ariaDescribedByIds.join(' ') : undefined}
aria-level={level}
aria-expanded={isSubTreeEmpty ? undefined : isExpanded}
aria-current={isCurrentItem ? 'true' : undefined}