diff --git a/lib/content-services/src/lib/i18n/en.json b/lib/content-services/src/lib/i18n/en.json index 49d07dd133..72da8f9ee3 100644 --- a/lib/content-services/src/lib/i18n/en.json +++ b/lib/content-services/src/lib/i18n/en.json @@ -342,7 +342,10 @@ } }, "ADF-TREE-VIEW": { - "MISSING-ID": "No nodeId provided!" + "MISSING-ID": "No nodeId provided!", + "ACCESSIBILITY": { + "ARIA_LABEL": "Toggle {{ name }}" + } }, "LIBRARY": { "DIALOG": { diff --git a/lib/content-services/src/lib/tree-view/components/tree-view.component.html b/lib/content-services/src/lib/tree-view/components/tree-view.component.html index 78aaeafa44..b30518438a 100644 --- a/lib/content-services/src/lib/tree-view/components/tree-view.component.html +++ b/lib/content-services/src/lib/tree-view/components/tree-view.component.html @@ -8,13 +8,15 @@ - - {{treeNode.name}} + {{treeNode.name}} diff --git a/lib/content-services/src/lib/tree-view/components/tree-view.component.scss b/lib/content-services/src/lib/tree-view/components/tree-view.component.scss index 7dd6e60132..d9770c9db2 100644 --- a/lib/content-services/src/lib/tree-view/components/tree-view.component.scss +++ b/lib/content-services/src/lib/tree-view/components/tree-view.component.scss @@ -13,5 +13,9 @@ font-size: 12px; align-items: baseline; } + + &-tree-view-label { + cursor: pointer; + } } } diff --git a/lib/content-services/src/lib/tree-view/components/tree-view.component.spec.ts b/lib/content-services/src/lib/tree-view/components/tree-view.component.spec.ts index e5685ec7e6..890cd52d10 100644 --- a/lib/content-services/src/lib/tree-view/components/tree-view.component.spec.ts +++ b/lib/content-services/src/lib/tree-view/components/tree-view.component.spec.ts @@ -188,6 +188,16 @@ describe('TreeViewComponent', () => { }); }); })); + + it('should show the subfolders when the label is clicked', async(() => { + const rootLabel: HTMLButtonElement = element.querySelector('.adf-tree-view-label'); + rootLabel.click(); + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(element.querySelector('#fake-child-name-tree-child-node')).not.toBeNull(); + expect(element.querySelector('#fake-second-name-tree-child-node')).not.toBeNull(); + }); + })); }); describe('When no nodeId is given', () => {