Merge pull request #4670 from DSpace/backport-4664-to-dspace-8_x

[Port dspace-8_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:10 +02:00
committed by GitHub
2 changed files with 10 additions and 8 deletions

View File

@@ -45,10 +45,10 @@ import { FormFieldMetadataValueObject } from '../../../models/form-field-metadat
import { DsDynamicTagComponent } from './dynamic-tag.component'; import { DsDynamicTagComponent } from './dynamic-tag.component';
import { DynamicTagModel } from './dynamic-tag.model'; import { DynamicTagModel } from './dynamic-tag.model';
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: () => {
}, },
}; };
@@ -278,8 +278,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();
@@ -290,7 +290,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

@@ -220,13 +220,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();
} }