diff --git a/contentcuration/contentcuration/frontend/shared/views/LanguageDropdown.vue b/contentcuration/contentcuration/frontend/shared/views/LanguageDropdown.vue index ddf39fdfee..2ab041dfa6 100644 --- a/contentcuration/contentcuration/frontend/shared/views/LanguageDropdown.vue +++ b/contentcuration/contentcuration/frontend/shared/views/LanguageDropdown.vue @@ -113,6 +113,13 @@ }, methods: { languageText(item) { + // VAutocomplete eagerly evaluates getText(internalValue) as a fallback arg to + // getValue, even when that fallback isn't needed. In multiple mode, internalValue + // is an Array, so languageText receives the array directly. Return early to avoid + // calling .split() on undefined. + if (Array.isArray(item)) { + return ''; + } const firstNativeName = item.native_name.split(',')[0].trim(); return this.$tr('languageItemText', { language: firstNativeName, code: item.id }); }, diff --git a/contentcuration/contentcuration/frontend/shared/views/__tests__/languageDropdown.spec.js b/contentcuration/contentcuration/frontend/shared/views/__tests__/languageDropdown.spec.js index 8bdcd165fd..13244d39b2 100644 --- a/contentcuration/contentcuration/frontend/shared/views/__tests__/languageDropdown.spec.js +++ b/contentcuration/contentcuration/frontend/shared/views/__tests__/languageDropdown.spec.js @@ -81,4 +81,15 @@ describe('languageDropdown', () => { const item = { native_name: '', id: 'de' }; expect(wrapper.vm.languageText(item)).toBe(' (de)'); }); + + it('returns empty string when called with an array (multiple mode VAutocomplete internal call)', () => { + const wrapper = shallowMount(LanguageDropdown, { + mocks: { + $tr: (key, params) => `${params.language} (${params.code})`, + }, + }); + // VAutocomplete eagerly evaluates getText(internalValue) as a fallback to getValue. + // In multiple mode, internalValue is an Array, so languageText receives the array. + expect(wrapper.vm.languageText(['en', 'fr'])).toBe(''); + }); });