diff --git a/src/app/shared/truncatable/truncatable-part/truncatable-part.component.html b/src/app/shared/truncatable/truncatable-part/truncatable-part.component.html index 32a2a213493..55ebe2d9575 100644 --- a/src/app/shared/truncatable/truncatable-part/truncatable-part.component.html +++ b/src/app/shared/truncatable/truncatable-part/truncatable-part.component.html @@ -2,12 +2,16 @@
- - diff --git a/src/app/shared/truncatable/truncatable-part/truncatable-part.component.spec.ts b/src/app/shared/truncatable/truncatable-part/truncatable-part.component.spec.ts index 7e528650d96..7b3ac2242bf 100644 --- a/src/app/shared/truncatable/truncatable-part/truncatable-part.component.spec.ts +++ b/src/app/shared/truncatable/truncatable-part/truncatable-part.component.spec.ts @@ -87,6 +87,11 @@ describe('TruncatablePartComponent', () => { const a = fixture.debugElement.query(By.css('.collapseButton')); expect(a).toBeNull(); }); + + it('expandButton aria-expanded should be false', () => { + const btn = fixture.debugElement.query(By.css('.expandButton')); + expect(btn.nativeElement.getAttribute('aria-expanded')).toEqual('false'); + }); }); describe('When the item is expanded', () => { @@ -115,6 +120,14 @@ describe('TruncatablePartComponent', () => { const a = fixture.debugElement.query(By.css('.collapseButton')); expect(a).not.toBeNull(); }); + + it('collapseButton aria-expanded should be true', () => { + (comp as any).setLines(); + (comp as any).expandable = true; + fixture.detectChanges(); + const btn = fixture.debugElement.query(By.css('.collapseButton')); + expect(btn.nativeElement.getAttribute('aria-expanded')).toEqual('true'); + }); }); }); diff --git a/src/app/shared/truncatable/truncatable-part/truncatable-part.component.ts b/src/app/shared/truncatable/truncatable-part/truncatable-part.component.ts index 54220d7f100..0c49a56405e 100644 --- a/src/app/shared/truncatable/truncatable-part/truncatable-part.component.ts +++ b/src/app/shared/truncatable/truncatable-part/truncatable-part.component.ts @@ -150,6 +150,13 @@ export class TruncatablePartComponent implements AfterViewChecked, OnInit, OnDes } } + /** + * Indicates if the content is expanded, button state is 'Collapse' + */ + public get isExpanded() { + return this.expand && this.expandable; + } + /** * Unsubscribe from the subscription */