diff --git a/packages/devextreme/js/__internal/ui/chat/message_box/chat_text_area.ts b/packages/devextreme/js/__internal/ui/chat/message_box/chat_text_area.ts index 48f492ed30a8..699b23d6ac97 100644 --- a/packages/devextreme/js/__internal/ui/chat/message_box/chat_text_area.ts +++ b/packages/devextreme/js/__internal/ui/chat/message_box/chat_text_area.ts @@ -78,9 +78,8 @@ export const CHAT_TEXT_AREA_TOOLBAR = 'dx-chat-textarea-toolbar'; const MAX_ATTACHMENTS_COUNT = 10; const INFORMER_DELAY = 10000; -const ERRORS = { - // @ts-expect-error format params should be extended - fileLimit: messageLocalization.format('dxChat-fileLimitReachedWarning', MAX_ATTACHMENTS_COUNT), +const ERROR_MESSAGE_NAME = { + fileLimit: 'dxChat-fileLimitReachedWarning', }; export const STT_INITIAL_STATE: ButtonState = { @@ -532,7 +531,11 @@ class ChatTextArea extends TextArea { }; _fileUploaderFileLimitReached(): void { - this._showInformer(ERRORS.fileLimit); + this._showInformer(messageLocalization.format( + ERROR_MESSAGE_NAME.fileLimit, + // @ts-expect-error format params should be extended + MAX_ATTACHMENTS_COUNT, + )); this._updateInputHeight(); } diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/chatTextArea.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/chatTextArea.tests.js index 943bd28c0b36..a9e078412105 100644 --- a/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/chatTextArea.tests.js +++ b/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/chatTextArea.tests.js @@ -2,6 +2,7 @@ import $ from 'jquery'; import keyboardMock from '../../../helpers/keyboardMock.js'; import { isRenderer } from 'core/utils/type'; import config from 'core/config'; +import messageLocalization from 'common/core/localization/message'; import ChatTextArea, { CHAT_TEXT_AREA_ATTACH_BUTTON, @@ -845,6 +846,50 @@ QUnit.module('ChatTextArea', moduleConfig, () => { assert.strictEqual(this.sendButton.option('disabled'), true, 'send button is disabled after file removal'); }); + + QUnit.module('Localization', { + beforeEach: function() { + this.defaultMessage = messageLocalization.format('dxChat-fileLimitReachedWarning'); + this.customMessage = 'Custom file limit message'; + }, + afterEach: function() { + messageLocalization.load({ en: { 'dxChat-fileLimitReachedWarning': this.defaultMessage } }); + } + }, () => { + QUnit.test('informer should show custom localization message loaded before component initialization', function(assert) { + messageLocalization.load({ en: { 'dxChat-fileLimitReachedWarning': this.customMessage } }); + + this.reinit({ + fileUploaderOptions: { + uploadFile: () => {}, + } + }); + + const fileUploader = this.getFileUploader(); + fileUploader.option('onFileLimitReached')(); + + const $informerText = this.$element.find(`.${INFORMER_TEXT_CLASS}`); + + assert.strictEqual($informerText.text(), this.customMessage, 'custom localization message is shown'); + }); + + QUnit.test('informer should show custom localization message loaded after component initialization', function(assert) { + this.reinit({ + fileUploaderOptions: { + uploadFile: () => {}, + } + }); + + messageLocalization.load({ en: { 'dxChat-fileLimitReachedWarning': this.customMessage } }); + + const fileUploader = this.getFileUploader(); + fileUploader.option('onFileLimitReached')(); + + const $informerText = this.$element.find(`.${INFORMER_TEXT_CLASS}`); + + assert.strictEqual($informerText.text(), this.customMessage, 'custom localization message is shown after runtime load'); + }); + }); }); QUnit.module('Integration with text option', () => {