diff --git a/src/Explorer/Controls/TreeComponent/TreeNodeComponent.test.tsx b/src/Explorer/Controls/TreeComponent/TreeNodeComponent.test.tsx
index 2b12de615..3ee538262 100644
--- a/src/Explorer/Controls/TreeComponent/TreeNodeComponent.test.tsx
+++ b/src/Explorer/Controls/TreeComponent/TreeNodeComponent.test.tsx
@@ -110,6 +110,42 @@ describe("TreeNodeComponent", () => {
expect(component).toMatchSnapshot();
});
+ it("sets aria-selected=true on a selected selectable node", () => {
+ const node = generateTestNode("root", {
+ isSelected: () => true,
+ });
+ const component = shallow();
+ expect(component.find(TreeItem).first().props()["aria-selected"]).toBe(true);
+ });
+
+ it("sets aria-selected=false on an unselected selectable node", () => {
+ const node = generateTestNode("root", {
+ isSelected: () => false,
+ });
+ const component = shallow();
+ expect(component.find(TreeItem).first().props()["aria-selected"]).toBe(false);
+ });
+
+ it("does not set aria-selected on a non-selectable (grouping) node", () => {
+ const node = generateTestNode("root");
+ delete node.isSelected;
+ const component = shallow();
+ expect(component.find(TreeItem).first().props()["aria-selected"]).toBeUndefined();
+ });
+
+ it("sets aria-selected=false on a selected parent when a descendant is selected", () => {
+ const node = generateTestNode("root", {
+ isSelected: () => true,
+ children: [
+ generateTestNode("child1", {
+ isSelected: () => true,
+ }),
+ ],
+ });
+ const component = shallow();
+ expect(component.find(TreeItem).first().props()["aria-selected"]).toBe(false);
+ });
+
it("renders an icon if the node has one", () => {
const node = generateTestNode("root", {
iconSrc: "the-icon.svg",
diff --git a/src/Explorer/Controls/TreeComponent/TreeNodeComponent.tsx b/src/Explorer/Controls/TreeComponent/TreeNodeComponent.tsx
index 74a717b68..d4312bd14 100644
--- a/src/Explorer/Controls/TreeComponent/TreeNodeComponent.tsx
+++ b/src/Explorer/Controls/TreeComponent/TreeNodeComponent.tsx
@@ -172,6 +172,9 @@ export const TreeNodeComponent: React.FC = ({
itemType={isBranch ? "branch" : "leaf"}
onOpenChange={onOpenChange}
className={treeStyles.treeItem}
+ // Expose selection state to screen readers for selectable nodes so they announce "selected"/"not selected".
+ // Pure grouping nodes (no isSelected) omit the attribute, matching the ARIA single-select tree pattern.
+ aria-selected={node.isSelected ? shouldShowAsSelected : undefined}
>