[ACS-9230] a11y testing: Search Page / Search Filters / Certain ARIA roles must contain particular children (#10627)

This commit is contained in:
dominikiwanekhyland 2025-02-10 14:51:16 +01:00 committed by GitHub
parent 0edbae8c59
commit 2784310556
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 8 additions and 11 deletions

View File

@ -1,10 +1,9 @@
<mat-chip-option [attr.data-automation-id]="'search-filter-chip-tabbed-' + tabbedFacet.label"
<mat-chip [attr.data-automation-id]="'search-filter-chip-tabbed-' + tabbedFacet.label"
[disableRipple]="true"
class="adf-search-filter-chip-tabbed"
[class.adf-search-toggle-chip]="displayValue || menuTrigger.menuOpen"
[disabled]="!isPopulated"
tabindex="0"
role="button"
[matMenuTriggerFor]="menu"
(menuOpened)="onMenuOpen()"
(keydown.enter)="onEnterKeydown()"
@ -22,7 +21,7 @@
<ng-template #disabledIcon>
<mat-icon>remove</mat-icon>
</ng-template>
</mat-chip-option>
</mat-chip>
<mat-menu #menu="matMenu" class="adf-search-widget-extra-width" backdropClass="adf-search-filter-chip-menu" (closed)="onClosed()">
<div #menuContainer [attr.data-automation-id]="'search-field-' + tabbedFacet.label">

View File

@ -1,10 +1,9 @@
<mat-chip-option [attr.data-automation-id]="'search-filter-chip-' + field.label"
<mat-chip [attr.data-automation-id]="'search-filter-chip-' + field.label"
[disableRipple]="true"
class="adf-search-filter-chip adf-search-filter-facet-chip"
[class.adf-search-toggle-chip]="(facetField.displayValue$ | async) || menuTrigger.menuOpen"
[disabled]="!isPopulated()"
tabindex="0"
role="button"
[matMenuTriggerFor]="menu"
(menuOpened)="onMenuOpen()"
(keydown.enter)="onEnterKeydown()"
@ -24,7 +23,7 @@
<ng-template #disabledIcon>
<mat-icon>remove</mat-icon>
</ng-template>
</mat-chip-option>
</mat-chip>
<mat-menu #menu="matMenu" backdropClass="adf-search-filter-chip-menu" (closed)="onClosed()">
<div #menuContainer [attr.data-automation-id]="'search-field-' + field.label">

View File

@ -25,7 +25,7 @@ import { MatMenuHarness } from '@angular/material/menu/testing';
import { HarnessLoader, TestKey } from '@angular/cdk/testing';
import { MatButtonHarness } from '@angular/material/button/testing';
import { MatIconHarness } from '@angular/material/icon/testing';
import { MatChipOptionHarness } from '@angular/material/chips/testing';
import { MatChipHarness } from '@angular/material/chips/testing';
describe('SearchFacetChipComponent', () => {
let loader: HarnessLoader;
@ -88,7 +88,7 @@ describe('SearchFacetChipComponent', () => {
});
it('should display remove icon and disable facet when no items are loaded', async () => {
const menu = await loader.getHarness(MatChipOptionHarness);
const menu = await loader.getHarness(MatChipHarness);
const disabled = await menu.isDisabled();
expect(disabled).toBe(true);

View File

@ -1,4 +1,4 @@
<mat-chip-listbox role="listbox" [attr.aria-label]="'SEARCH.FILTER.ARIA-LABEL.SEARCH_FILTER' | translate">
<mat-chip-set [attr.aria-label]="'SEARCH.FILTER.ARIA-LABEL.SEARCH_FILTER' | translate">
<ng-container *ngFor="let category of categories">
<adf-search-widget-chip [category]="category" />
</ng-container>
@ -16,4 +16,4 @@
</ng-container>
<ng-content></ng-content>
</mat-chip-listbox>
</mat-chip-set>

View File

@ -3,7 +3,6 @@
class="adf-search-filter-chip"
[class.adf-search-toggle-chip]="(widget.getDisplayValue() | async) || menuTrigger.menuOpen"
tabindex="0"
role="button"
[matMenuTriggerFor]="menu"
(menuOpened)="onMenuOpen()"
(keydown.enter)="onEnterKeydown()"