EXUI-1688: Accessibility with details/summary element (#3714)

* Resolve accessibility issue with detail/summary component * resolve broken test * yarn audit * Yarn audit --------- Co-authored-by: OgunyemiO <[email protected]> Co-authored-by: RiteshHMCTS <[email protected]>
hmcts · Jul 18, 2024 · f8a56b3 · f8a56b3
1 parent b675c99
commit f8a56b3
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 3 deletions.
diff --git a/src/cases/containers/case-list/case-list.component.html b/src/cases/containers/case-list/case-list.component.html
@@ -55,8 +55,8 @@
           >
           </ccd-search-result>
           <div id="info-msg-unselected-case" *ngIf="hasResults() && (isCaseShareVisible$ | async)" class="form-group">
-            <details class="govuk-details" data-module="govuk-details">
-              <summary class="govuk-details__summary">
+            <details #detailsElement class="govuk-details" data-module="govuk-details">
+              <summary class="govuk-details__summary" role="button" [attr.aria-expanded]="detailsElement.open">
                 <span id="sp-msg-unselected-case-header" class="govuk-details__summary-text">
                   {{'Why are some cases unselectable?' | rpxTranslate}}
                 </span>

diff --git a/test_codecept/e2e/features/pageObjects/caseFileViewPage.js b/test_codecept/e2e/features/pageObjects/caseFileViewPage.js
@@ -39,7 +39,7 @@ class CaseFileViewPage{
     async getFileDisplayedInMediaViewer(){
         const ele = element(by.xpath(`//title`));
         return await ele.getText()
-    }
+}
 
 }