mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2026-09-09 18:03:21 +00:00
Allows closing dropdown with Escape key (#11489)
Implements the ability to close the dropdown list by pressing the Escape key. This enhances the user experience by providing a keyboard shortcut to dismiss the dropdown, improving accessibility and efficiency.
This commit is contained in:
+2
@@ -24,6 +24,8 @@
|
|||||||
[multiple]="field.hasMultipleValues"
|
[multiple]="field.hasMultipleValues"
|
||||||
[disabled]="field.readOnly"
|
[disabled]="field.readOnly"
|
||||||
[required]="field.required"
|
[required]="field.required"
|
||||||
|
#select
|
||||||
|
(keydown.escape)="select.close()"
|
||||||
>
|
>
|
||||||
<adf-select-filter-input *ngIf="showInputFilter" (change)="filter$.next($event)" />
|
<adf-select-filter-input *ngIf="showInputFilter" (change)="filter$.next($event)" />
|
||||||
|
|
||||||
|
|||||||
+19
@@ -187,6 +187,25 @@ describe('DropdownCloudWidgetComponent', () => {
|
|||||||
expect(formCloudService.getRestWidgetData).not.toHaveBeenCalled();
|
expect(formCloudService.getRestWidgetData).not.toHaveBeenCalled();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('should close dropdown when Escape key is pressed', async () => {
|
||||||
|
const dropdown = await loader.getHarness(MatSelectHarness.with({ selector: '.adf-select' }));
|
||||||
|
await dropdown.open();
|
||||||
|
|
||||||
|
const filterInput = fixture.debugElement.query(By.css('.adf-select'));
|
||||||
|
filterInput.nativeElement.focus();
|
||||||
|
filterInput.nativeElement.dispatchEvent(
|
||||||
|
new KeyboardEvent('keydown', {
|
||||||
|
key: 'Escape',
|
||||||
|
code: 'Escape',
|
||||||
|
bubbles: true
|
||||||
|
})
|
||||||
|
);
|
||||||
|
|
||||||
|
fixture.detectChanges();
|
||||||
|
|
||||||
|
expect(await dropdown.isOpen()).toBeFalse();
|
||||||
|
});
|
||||||
|
|
||||||
describe('should load data from restUrl when form is NOT readonly', () => {
|
describe('should load data from restUrl when form is NOT readonly', () => {
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
spyOn(formCloudService, 'getRestWidgetData').and.returnValue(of([]));
|
spyOn(formCloudService, 'getRestWidgetData').and.returnValue(of([]));
|
||||||
|
|||||||
Reference in New Issue
Block a user