diff --git a/packages/material-ui-lab/src/TreeItem/TreeItem.js b/packages/material-ui-lab/src/TreeItem/TreeItem.js
index 1b3c568b7cff2f..461f51551362da 100644
--- a/packages/material-ui-lab/src/TreeItem/TreeItem.js
+++ b/packages/material-ui-lab/src/TreeItem/TreeItem.js
@@ -365,6 +365,14 @@ const TreeItem = React.forwardRef(function TreeItem(props, ref) {
}
}, [focused]);
+ let ariaSelected;
+ if (multiSelect) {
+ ariaSelected = selected;
+ } else if (selected) {
+ // single-selection trees unset aria-selected
+ ariaSelected = true;
+ }
+
return (
', () => {
});
describe('aria-selected', () => {
- it('should have the attribute `aria-selected=false` if not selected', () => {
- const { getByTestId } = render(
-
-
- ,
- );
+ describe('single-select', () => {
+ it('should not have the attribute `aria-selected` if not selected', () => {
+ const { getByTestId } = render(
+
+
+ ,
+ );
- expect(getByTestId('test')).to.have.attribute('aria-selected', 'false');
- });
+ expect(getByTestId('test')).to.not.have.attribute('aria-selected');
+ });
- it('should have the attribute `aria-selected=true` if selected', () => {
- const { getByTestId } = render(
-
-
- ,
- );
+ it('should have the attribute `aria-selected=true` if selected', () => {
+ const { getByTestId } = render(
+
+
+ ,
+ );
- expect(getByTestId('test')).to.have.attribute('aria-selected', 'true');
+ expect(getByTestId('test')).to.have.attribute('aria-selected', 'true');
+ });
});
- it('should not have the attribute `aria-selected` if disableSelection is true', () => {
- const { getByTestId } = render(
-
-
- ,
- );
+ describe('multi-select', () => {
+ it('should have the attribute `aria-selected=false` if not selected', () => {
+ const { getByTestId } = render(
+
+
+ ,
+ );
+
+ expect(getByTestId('test')).to.have.attribute('aria-selected', 'false');
+ });
+ it('should have the attribute `aria-selected=true` if selected', () => {
+ const { getByTestId } = render(
+
+
+ ,
+ );
+
+ expect(getByTestId('test')).to.have.attribute('aria-selected', 'true');
+ });
+
+ it('should have the attribute `aria-selected` if disableSelection is true', () => {
+ const { getByTestId } = render(
+
+
+ ,
+ );
- expect(getByTestId('test')).to.not.have.attribute('aria-selected');
+ expect(getByTestId('test')).to.have.attribute('aria-selected', 'false');
+ });
});
});
@@ -695,7 +718,7 @@ describe('', () => {
);
getByTestId('one').focus();
- expect(getByTestId('one')).to.have.attribute('aria-selected', 'false');
+ expect(getByTestId('one')).to.not.have.attribute('aria-selected');
fireEvent.keyDown(document.activeElement, { key: ' ' });
expect(getByTestId('one')).to.have.attribute('aria-selected', 'true');
});
@@ -709,7 +732,7 @@ describe('', () => {
,
);
- expect(getByTestId('one')).to.have.attribute('aria-selected', 'false');
+ expect(getByTestId('one')).to.not.have.attribute('aria-selected');
fireEvent.click(getByText('one'));
expect(getByTestId('one')).to.have.attribute('aria-selected', 'true');
});
diff --git a/packages/material-ui-lab/src/TreeView/TreeView.test.js b/packages/material-ui-lab/src/TreeView/TreeView.test.js
index 2e785dfb28bc32..a679b09641b9e9 100644
--- a/packages/material-ui-lab/src/TreeView/TreeView.test.js
+++ b/packages/material-ui-lab/src/TreeView/TreeView.test.js
@@ -106,13 +106,13 @@ describe('', () => {
const { getByTestId, getByText } = render();
- expect(getByTestId('one')).to.have.attribute('aria-selected', 'false');
- expect(getByTestId('two')).to.have.attribute('aria-selected', 'false');
+ expect(getByTestId('one')).to.not.have.attribute('aria-selected');
+ expect(getByTestId('two')).to.not.have.attribute('aria-selected');
fireEvent.click(getByText('one'));
expect(getByTestId('one')).to.have.attribute('aria-selected', 'true');
- expect(getByTestId('two')).to.have.attribute('aria-selected', 'false');
+ expect(getByTestId('two')).to.not.have.attribute('aria-selected');
fireEvent.click(getByText('two'));
- expect(getByTestId('one')).to.have.attribute('aria-selected', 'false');
+ expect(getByTestId('one')).to.not.have.attribute('aria-selected');
expect(getByTestId('two')).to.have.attribute('aria-selected', 'true');
});