diff --git a/packages/devextreme/js/__internal/ui/drop_down_editor/m_drop_down_editor.ts b/packages/devextreme/js/__internal/ui/drop_down_editor/m_drop_down_editor.ts index 74fc1b9fc0e3..cddf7e821edc 100644 --- a/packages/devextreme/js/__internal/ui/drop_down_editor/m_drop_down_editor.ts +++ b/packages/devextreme/js/__internal/ui/drop_down_editor/m_drop_down_editor.ts @@ -13,6 +13,7 @@ import type { DefaultOptionsRule } from '@js/core/options/utils'; import type { dxElementWrapper } from '@js/core/renderer'; import $ from '@js/core/renderer'; import { FunctionTemplate } from '@js/core/templates/function_template'; +import browser from '@js/core/utils/browser'; import { // @ts-expect-error splitPair, @@ -425,8 +426,19 @@ class DropDownEditor< } this._integrateInput(); - // @ts-expect-error ts-error - isFocused && eventsEngine.trigger($input, 'focus'); + + if (!isFocused) { + return; + } + + // T1259996 + if (browser.mozilla) { + const inputElement = $input.get(0) as HTMLInputElement; + inputElement.focus({ preventScroll: true }); + } else { + // @ts-expect-error + eventsEngine.trigger($input, 'focus'); + } }, }); } diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets.editors/tagBox.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets.editors/tagBox.tests.js index 9325844df617..ea09d219b903 100644 --- a/packages/devextreme/testing/tests/DevExpress.ui.widgets.editors/tagBox.tests.js +++ b/packages/devextreme/testing/tests/DevExpress.ui.widgets.editors/tagBox.tests.js @@ -20,6 +20,7 @@ import TagBox from 'ui/tag_box'; import { normalizeKeyName } from 'common/core/events/utils/index'; import { getWidth, getHeight } from 'core/utils/size'; import Guid from 'core/guid'; +import browser from 'core/utils/browser'; import { TextEditorLabel } from '__internal/ui/text_box/m_text_editor.label'; @@ -5425,11 +5426,38 @@ QUnit.module('the \'fieldTemplate\' option', moduleSetup, () => { fieldTemplate: () => $('
').dxTextBox() }).dxTagBox('instance'); - $tagBox.find(`.${TAGBOX_TAG_REMOVE_BUTTON_CLASS }`).trigger('dxclick'); + $tagBox.find(`.${TAGBOX_TAG_REMOVE_BUTTON_CLASS}`).trigger('dxclick'); assert.strictEqual(tagBox.option('value').length, 0); assert.strictEqual(tagBoxWithFieldTemplate.option('value').length, 1); }); + + QUnit.test('calls focus() with preventScroll: true when deleting a tag in Firefox (T1259996)', function(assert) { + if(!browser.mozilla) { + assert.ok(true, 'Only for Firefox'); + return; + } + + const items = Array.from({ length: 200 }, (_, i) => i + 1); + + const focusSpy = sinon.spy(HTMLElement.prototype, 'focus'); + + const $tagBox = $('#tagBox').dxTagBox({ + items, + value: items, + fieldTemplate: () => $('
').dxTextBox() + }); + + const $inputWrapper = $tagBox.find(`.${DROP_DOWN_EDITOR_INPUT_WRAPPER}`); + + $inputWrapper.trigger('dxclick'); + $tagBox.find(`.${TAGBOX_TAG_REMOVE_BUTTON_CLASS }`).trigger('dxclick'); + + assert.ok(focusSpy.calledTwice, 'focus() was called twice after click & deleting'); + assert.deepEqual(focusSpy.args[1][0], { preventScroll: true }, 'focus() was called with preventScroll: true'); + + focusSpy.restore(); + }); }); QUnit.module('the "customItemCreateEvent" option', { @@ -8330,7 +8358,7 @@ QUnit.module('accessibility', () => { }); QUnit.test('input should not have aria-labelledby attr if label is not specified', function(assert) { - const $tagBox = $('#tagBox').dxTagBox({ }); + const $tagBox = $('#tagBox').dxTagBox({}); const $input = $tagBox.find(`.${TEXTEDITOR_INPUT_CLASS}`); assert.strictEqual($input.attr('aria-labelledby'), undefined, 'aria-labelledby was set correctly');