Merge pull request #4669 from DSpace/backport-4664-to-dspace-7_x

[Port dspace-7_x] Inspect event key characters, not keyCodes on tag keyUp for dynamic tag input
This commit is contained in:
Art Lowel
2025-09-04 17:38:01 +02:00
committed by GitHub
2 changed files with 10 additions and 8 deletions

View File

@@ -22,10 +22,10 @@ import {
mockDynamicFormValidationService mockDynamicFormValidationService
} from '../../../../../testing/dynamic-form-mock-services'; } from '../../../../../testing/dynamic-form-mock-services';
function createKeyUpEvent(key: number) { function createKeyUpEvent(key: string) {
/* eslint-disable no-empty,@typescript-eslint/no-empty-function */ /* eslint-disable no-empty,@typescript-eslint/no-empty-function */
const event = { const event = {
keyCode: key, preventDefault: () => { key: key, preventDefault: () => {
}, stopPropagation: () => { }, stopPropagation: () => {
} }
}; };
@@ -256,8 +256,8 @@ describe('DsDynamicTagComponent test suite', () => {
expect(tagComp.chips.getChipsItems()).toEqual(chips.getChipsItems()); expect(tagComp.chips.getChipsItems()).toEqual(chips.getChipsItems());
}); });
it('should add an item on ENTER or key press is \',\' or \';\'', fakeAsync(() => { it('should add an item on ENTER or key press is \',\'', fakeAsync(() => {
let event = createKeyUpEvent(13); let event = createKeyUpEvent('Enter');
tagComp.currentValue = 'test value'; tagComp.currentValue = 'test value';
tagFixture.detectChanges(); tagFixture.detectChanges();
@@ -268,7 +268,7 @@ describe('DsDynamicTagComponent test suite', () => {
expect(tagComp.model.value).toEqual(['test value']); expect(tagComp.model.value).toEqual(['test value']);
expect(tagComp.currentValue).toBeNull(); expect(tagComp.currentValue).toBeNull();
event = createKeyUpEvent(188); event = createKeyUpEvent(',');
tagComp.currentValue = 'test value'; tagComp.currentValue = 'test value';
tagFixture.detectChanges(); tagFixture.detectChanges();

View File

@@ -180,13 +180,15 @@ export class DsDynamicTagComponent extends DsDynamicVocabularyComponent implemen
} }
/** /**
* Add a new tag with typed text when typing 'Enter' or ',' or ';' * Add a new tag with typed text when typing 'Enter' or ','
* Tests the key rather than keyCode as keyCodes can vary
* based on keyboard layout (and do not consider Shift mod)
* @param event the keyUp event * @param event the keyUp event
*/ */
onKeyUp(event) { onKeyUp(event) {
if (event.keyCode === 13 || event.keyCode === 188) { if (event.key === 'Enter' || event.key === ',') {
event.preventDefault(); event.preventDefault();
// Key: 'Enter' or ',' or ';' // Key: 'Enter' or ','
this.addTagsToChips(); this.addTagsToChips();
event.stopPropagation(); event.stopPropagation();
} }