diff --git a/src/app/shared/search/search-filters/search-filter/search-filter.component.html b/src/app/shared/search/search-filters/search-filter/search-filter.component.html
index e1083fc7abd..8b23f001603 100644
--- a/src/app/shared/search/search-filters/search-filter/search-filter.component.html
+++ b/src/app/shared/search/search-filters/search-filter/search-filter.component.html
@@ -1,6 +1,6 @@
@if (active$ | async) {
+ [id]="regionId" [attr.aria-labelledby]="toggleId" [ngClass]="{ 'focus': focusBox }">
}
-
+
diff --git a/src/app/shared/search/search-filters/search-filters.component.spec.ts b/src/app/shared/search/search-filters/search-filters.component.spec.ts
index b0d268db996..656dcaef61f 100644
--- a/src/app/shared/search/search-filters/search-filters.component.spec.ts
+++ b/src/app/shared/search/search-filters/search-filters.component.spec.ts
@@ -7,6 +7,7 @@ import {
TestBed,
waitForAsync,
} from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterModule } from '@angular/router';
import { APP_CONFIG } from '@dspace/config/app-config.interface';
@@ -68,4 +69,12 @@ describe('SearchFiltersComponent', () => {
});
});
+ describe('accessibility', () => {
+ it('should render a section landmark with an accessible aria-label', () => {
+ const sectionElement = fixture.debugElement.query(By.css('section'));
+ expect(sectionElement).toBeTruthy();
+ expect(sectionElement.attributes['aria-label']).toBeTruthy();
+ });
+ });
+
});