diff --git a/packages/devextreme/js/__internal/grids/grid_core/error_handling/m_error_handling.ts b/packages/devextreme/js/__internal/grids/grid_core/error_handling/m_error_handling.ts index b31969988abf..31f926ac9082 100644 --- a/packages/devextreme/js/__internal/grids/grid_core/error_handling/m_error_handling.ts +++ b/packages/devextreme/js/__internal/grids/grid_core/error_handling/m_error_handling.ts @@ -2,6 +2,7 @@ import $ from '@js/core/renderer'; import { each } from '@js/core/utils/iterator'; import { name as clickEventName } from '@js/events/click'; import eventsEngine from '@js/events/core/events_engine'; +import messageLocalization from '@js/localization/message'; import modules from '../m_modules'; @@ -25,7 +26,9 @@ const ErrorHandlingController = modules.ViewController.inherit({ const $errorMessage = this._renderErrorMessage(error); if ($tableElements) { - $errorRow = $('').addClass(ERROR_ROW_CLASS); + $errorRow = $('') + .attr('role', 'row') + .addClass(ERROR_ROW_CLASS); $closeButton = $('
').addClass(ERROR_CLOSEBUTTON_CLASS).addClass(that.addWidgetPrefix(ACTION_CLASS)); eventsEngine.on($closeButton, clickEventName, that.createAction((args) => { @@ -46,7 +49,7 @@ const ErrorHandlingController = modules.ViewController.inherit({ // @ts-expect-errors .attr({ colSpan: that.getController('columns').getVisibleColumns().length, - role: 'presentation', + role: 'gridcell', }) .prepend($closeButton) .append($errorMessage) @@ -60,7 +63,11 @@ const ErrorHandlingController = modules.ViewController.inherit({ _renderErrorMessage(error) { const message = error.url ? error.message.replace(error.url, '') : error.message || error; - const $message = $('
').addClass(ERROR_MESSAGE_CLASS).text(message); + const $message = $('
') + .attr('role', 'alert') + .attr('aria-roledescription', messageLocalization.format('dxDataGrid-ariaError')) + .addClass(ERROR_MESSAGE_CLASS) + .text(message); if (error.url) { $('').attr('href', error.url).text(error.url).appendTo($message); diff --git a/packages/devextreme/js/__internal/grids/grid_core/validating/m_validating.ts b/packages/devextreme/js/__internal/grids/grid_core/validating/m_validating.ts index 99adc0a14265..b77fba3964d7 100644 --- a/packages/devextreme/js/__internal/grids/grid_core/validating/m_validating.ts +++ b/packages/devextreme/js/__internal/grids/grid_core/validating/m_validating.ts @@ -23,15 +23,18 @@ import Validator from '@js/ui/validator'; import { focused } from '@js/ui/widget/selectors'; import errors from '@js/ui/widget/ui.errors'; +import { EDITORS_INPUT_SELECTOR } from '../editing/const'; import modules from '../m_modules'; import gridCoreUtils from '../m_utils'; const INVALIDATE_CLASS = 'invalid'; const REVERT_TOOLTIP_CLASS = 'revert-tooltip'; const INVALID_MESSAGE_CLASS = 'dx-invalid-message'; +const INVALID_MESSAGE_ID = 'dxInvalidMessage'; const WIDGET_INVALID_MESSAGE_CLASS = 'invalid-message'; const INVALID_MESSAGE_ALWAYS_CLASS = 'dx-invalid-message-always'; const REVERT_BUTTON_CLASS = 'dx-revert-button'; +const REVERT_BUTTON_ID = 'dxRevertButton'; const VALIDATOR_CLASS = 'validator'; const PENDING_INDICATOR_CLASS = 'dx-pending-indicator'; const VALIDATION_PENDING_CLASS = 'dx-validation-pending'; @@ -1093,6 +1096,10 @@ export const validatingModule = { const buttonOptions = { icon: 'revert', hint: this.option('editing.texts.validationCancelChanges'), + elementAttr: { + id: REVERT_BUTTON_ID, + 'aria-label': messageLocalization.format('dxDataGrid-ariaRevertButton'), + }, onClick: () => { this._editingController.cancelEditData(); }, @@ -1193,7 +1200,10 @@ export const validatingModule = { animation: false, propagateOutsideClick: true, hideOnOutsideClick: false, - wrapperAttr: { class: `${INVALID_MESSAGE_CLASS} ${INVALID_MESSAGE_ALWAYS_CLASS} ${invalidMessageClass}` }, + wrapperAttr: { + id: INVALID_MESSAGE_ID, + class: `${INVALID_MESSAGE_CLASS} ${INVALID_MESSAGE_ALWAYS_CLASS} ${invalidMessageClass}`, + }, position: { collision: 'flip', boundary: this._rowsView.element(), @@ -1305,10 +1315,12 @@ export const validatingModule = { const change = rowOptions ? this.getController('editing').getChangeByKey(rowOptions.key) : null; const column = $cell && this.getController('columns').getVisibleColumns()[$cell.index()]; const isCellModified = (change?.data?.[column?.name] !== undefined) && !this._editingController.isSaving(); + const validationDescriptionValues: string[] = []; if (this._editingController.getEditMode() === EDIT_MODE_CELL) { if ((validationResult?.status === VALIDATION_STATUS.invalid) || isCellModified) { this._showRevertButton($focus); + validationDescriptionValues.push(REVERT_BUTTON_ID); } else { this._revertTooltip && this._revertTooltip.$element().remove(); } @@ -1326,12 +1338,37 @@ export const validatingModule = { if (errorMessages.length) { this._showValidationMessage($focus, errorMessages, column.alignment || 'left'); + validationDescriptionValues.push(INVALID_MESSAGE_ID); } } + this._updateAriaValidationAttributes($focus, validationDescriptionValues); !isHideBorder && this._rowsView.element() && this._rowsView.updateFreeSpaceRowHeight(); }, + _updateAriaValidationAttributes($focus, inputDescriptionValues) { + if (inputDescriptionValues.length === 0) { return; } + + const editMode = this._editingController.getEditMode(); + const shouldSetValidationAriaAttributes = [ + EDIT_MODE_CELL, + EDIT_MODE_BATCH, + EDIT_MODE_ROW].includes(editMode); + + if (shouldSetValidationAriaAttributes) { + const $focusElement = this._getCurrentFocusElement($focus); + $focusElement.attr('aria-labelledby', inputDescriptionValues.join(' ')); + $focusElement.attr('aria-invalid', true); + } + }, + + _getCurrentFocusElement($focus) { + if (this._editingController.isEditing()) { + return $focus.find(EDITORS_INPUT_SELECTOR).first(); + } + return $focus; + }, + focus($element, isHideBorder) { if (!arguments.length) return this.callBase(); diff --git a/packages/devextreme/js/localization/messages/ar.json b/packages/devextreme/js/localization/messages/ar.json index b9cd6702e3ac..945c40de21f1 100644 --- a/packages/devextreme/js/localization/messages/ar.json +++ b/packages/devextreme/js/localization/messages/ar.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "عمود", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "القيمة", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "تصفية الخلية", "dxDataGrid-ariaCollapse": "طي", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/ca.json b/packages/devextreme/js/localization/messages/ca.json index 42e393e6ef28..4540fba4db58 100644 --- a/packages/devextreme/js/localization/messages/ca.json +++ b/packages/devextreme/js/localization/messages/ca.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Columna", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Valorar", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Filtrar la cel·la", "dxDataGrid-ariaCollapse": "Col·lapsar", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/cs.json b/packages/devextreme/js/localization/messages/cs.json index 6025c4a3cfb1..40c59e2ea0c6 100644 --- a/packages/devextreme/js/localization/messages/cs.json +++ b/packages/devextreme/js/localization/messages/cs.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Sloupec", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Hodnota", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Filtrovat buňku", "dxDataGrid-ariaCollapse": "Sbalit", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/de.json b/packages/devextreme/js/localization/messages/de.json index 805c56831aad..f4a527601a4a 100644 --- a/packages/devextreme/js/localization/messages/de.json +++ b/packages/devextreme/js/localization/messages/de.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Spalte", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Wert", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Filterzelle", "dxDataGrid-ariaCollapse": "Zusammenklappen", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/el.json b/packages/devextreme/js/localization/messages/el.json index 0885b0a1fb59..e8d10722e0b7 100644 --- a/packages/devextreme/js/localization/messages/el.json +++ b/packages/devextreme/js/localization/messages/el.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Στήλη", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Τιμή", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Φιλτράρισμα κελιού", "dxDataGrid-ariaCollapse": "Συρρίκνωση", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/en.json b/packages/devextreme/js/localization/messages/en.json index 62fd0a74fd29..c6761406522b 100644 --- a/packages/devextreme/js/localization/messages/en.json +++ b/packages/devextreme/js/localization/messages/en.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Column", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Value", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Filter cell", "dxDataGrid-ariaCollapse": "Collapse", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/es.json b/packages/devextreme/js/localization/messages/es.json index a98d7e675623..3d415df1a196 100644 --- a/packages/devextreme/js/localization/messages/es.json +++ b/packages/devextreme/js/localization/messages/es.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Columna", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Valor", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Celda de filtro", "dxDataGrid-ariaCollapse": "Colapsar", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/fa.json b/packages/devextreme/js/localization/messages/fa.json index 8c33fc4562f0..dd80657ea18d 100644 --- a/packages/devextreme/js/localization/messages/fa.json +++ b/packages/devextreme/js/localization/messages/fa.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "ستون", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "مقدار", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "فیلتر سلول", "dxDataGrid-ariaCollapse": "عدم نمایش", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/fi.json b/packages/devextreme/js/localization/messages/fi.json index c9ffda904974..742721e72c6f 100644 --- a/packages/devextreme/js/localization/messages/fi.json +++ b/packages/devextreme/js/localization/messages/fi.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Sarake", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Arvo", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Suodatinsolu", "dxDataGrid-ariaCollapse": "Tiivistä", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/fr.json b/packages/devextreme/js/localization/messages/fr.json index da38507ad890..91e7e1704108 100644 --- a/packages/devextreme/js/localization/messages/fr.json +++ b/packages/devextreme/js/localization/messages/fr.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Colonne", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Valeur", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Filtre de cellule", "dxDataGrid-ariaCollapse": "Réduire", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/hu.json b/packages/devextreme/js/localization/messages/hu.json index 9469b8f5694f..3584f4892bcf 100644 --- a/packages/devextreme/js/localization/messages/hu.json +++ b/packages/devextreme/js/localization/messages/hu.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Oszlop", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Érték", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Szűrő cella", "dxDataGrid-ariaCollapse": "Összecsukás", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/it.json b/packages/devextreme/js/localization/messages/it.json index 314f23c79437..b0b03590e307 100644 --- a/packages/devextreme/js/localization/messages/it.json +++ b/packages/devextreme/js/localization/messages/it.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Colonna", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Valore", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Filtra cella", "dxDataGrid-ariaCollapse": "Comprimi", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/ja.json b/packages/devextreme/js/localization/messages/ja.json index 0e638bc22ea8..1719d874f82d 100644 --- a/packages/devextreme/js/localization/messages/ja.json +++ b/packages/devextreme/js/localization/messages/ja.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "列", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "値", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "フィルター セル", "dxDataGrid-ariaCollapse": "折りたたむ", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/lt.json b/packages/devextreme/js/localization/messages/lt.json index 258f6a7cffec..f4e72af24990 100644 --- a/packages/devextreme/js/localization/messages/lt.json +++ b/packages/devextreme/js/localization/messages/lt.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Stulpelis", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Reikšmė", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Filtro laukas", "dxDataGrid-ariaCollapse": "Suskleisti", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/lv.json b/packages/devextreme/js/localization/messages/lv.json index d6aa99631c71..c2cba660d6fd 100644 --- a/packages/devextreme/js/localization/messages/lv.json +++ b/packages/devextreme/js/localization/messages/lv.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Kolonna", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Vērtība", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Filtrēt šūnu", "dxDataGrid-ariaCollapse": "Savērst", "dxDataGrid-ariaModifiedCell": "Modified", @@ -295,7 +297,7 @@ "dxCalendar-captionYearLabel": "Year selection", "dxCalendar-captionDecadeLabel": "Decade selection", "dxCalendar-captionCenturyLabel": "Century selection", - + "dxColorView-ariaRed": "Sarkans", "dxColorView-ariaGreen": "Zaļš", "dxColorView-ariaBlue": "Zils", diff --git a/packages/devextreme/js/localization/messages/nb.json b/packages/devextreme/js/localization/messages/nb.json index 9ddc798cfb04..86fd87d68090 100644 --- a/packages/devextreme/js/localization/messages/nb.json +++ b/packages/devextreme/js/localization/messages/nb.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Kolonne", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Verdi", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Filtrér celle", "dxDataGrid-ariaCollapse": "Skjul", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/nl.json b/packages/devextreme/js/localization/messages/nl.json index c2f88a0f0de9..d488ffd3f819 100644 --- a/packages/devextreme/js/localization/messages/nl.json +++ b/packages/devextreme/js/localization/messages/nl.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Kolom", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Waarde", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Filter cel", "dxDataGrid-ariaCollapse": "Inklappen", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/pt.json b/packages/devextreme/js/localization/messages/pt.json index b956b674d355..5bf2da370201 100644 --- a/packages/devextreme/js/localization/messages/pt.json +++ b/packages/devextreme/js/localization/messages/pt.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Coluna", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Valor", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Filtro de célula", "dxDataGrid-ariaCollapse": "Contrair", "dxDataGrid-ariaModifiedCell": "Modified", @@ -295,7 +297,7 @@ "dxCalendar-captionYearLabel": "Year selection", "dxCalendar-captionDecadeLabel": "Decade selection", "dxCalendar-captionCenturyLabel": "Century selection", - + "dxColorView-ariaRed": "Vermelho", "dxColorView-ariaGreen": "Verde", "dxColorView-ariaBlue": "Azul", diff --git a/packages/devextreme/js/localization/messages/ro.json b/packages/devextreme/js/localization/messages/ro.json index d7c970877061..8a9e791e948e 100644 --- a/packages/devextreme/js/localization/messages/ro.json +++ b/packages/devextreme/js/localization/messages/ro.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Coloană", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Valoare", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Celulă de filtrare", "dxDataGrid-ariaCollapse": "Restrângere", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/ru.json b/packages/devextreme/js/localization/messages/ru.json index d0651e307da8..1c9b43bc855f 100644 --- a/packages/devextreme/js/localization/messages/ru.json +++ b/packages/devextreme/js/localization/messages/ru.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Столбец", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Значение", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Фильтр", "dxDataGrid-ariaCollapse": "Свернуть", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/sl.json b/packages/devextreme/js/localization/messages/sl.json index f985347a09eb..827c07d089e6 100644 --- a/packages/devextreme/js/localization/messages/sl.json +++ b/packages/devextreme/js/localization/messages/sl.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Stolpec", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Vrednost", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Filtriraj po celici", "dxDataGrid-ariaCollapse": "Skrči", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/sv.json b/packages/devextreme/js/localization/messages/sv.json index 3c2aa5705217..67f54adc4b0d 100644 --- a/packages/devextreme/js/localization/messages/sv.json +++ b/packages/devextreme/js/localization/messages/sv.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Kolumn", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Värde", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Filtrera cell", "dxDataGrid-ariaCollapse": "Kollapsa", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/tr.json b/packages/devextreme/js/localization/messages/tr.json index 1ecd6202403c..0b65cf6384b3 100644 --- a/packages/devextreme/js/localization/messages/tr.json +++ b/packages/devextreme/js/localization/messages/tr.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Sütun", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Veri", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Filtre hücresi", "dxDataGrid-ariaCollapse": "Daralt", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/vi.json b/packages/devextreme/js/localization/messages/vi.json index d83e7d5f5e59..e3cd9f59bbdd 100644 --- a/packages/devextreme/js/localization/messages/vi.json +++ b/packages/devextreme/js/localization/messages/vi.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "Cột", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "Giá trị", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "Lọc ô", "dxDataGrid-ariaCollapse": "Thu lại", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/zh-tw.json b/packages/devextreme/js/localization/messages/zh-tw.json index 88abc6bb5d1e..f27ab174ed71 100644 --- a/packages/devextreme/js/localization/messages/zh-tw.json +++ b/packages/devextreme/js/localization/messages/zh-tw.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "欄", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "值", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "過濾單元", "dxDataGrid-ariaCollapse": "摺疊", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/js/localization/messages/zh.json b/packages/devextreme/js/localization/messages/zh.json index 399f062ce9e5..22864685ef8f 100644 --- a/packages/devextreme/js/localization/messages/zh.json +++ b/packages/devextreme/js/localization/messages/zh.json @@ -170,6 +170,8 @@ "dxDataGrid-ariaColumn": "列", "dxDataGrid-ariaColumnHeader": "Column header", "dxDataGrid-ariaValue": "值", + "dxDataGrid-ariaError": "Error", + "dxDataGrid-ariaRevertButton": "Press Escape to discard the changes", "dxDataGrid-ariaFilterCell": "过滤单元", "dxDataGrid-ariaCollapse": "折叠", "dxDataGrid-ariaModifiedCell": "Modified", diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/dataGrid.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/dataGrid.tests.js index 54782eb59c24..880f32c218ea 100644 --- a/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/dataGrid.tests.js +++ b/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/dataGrid.tests.js @@ -845,7 +845,12 @@ QUnit.module('Initialization', baseModuleConfig, () => { const $errorRow = $($(dataGrid.$element()).find('.dx-error-row')); assert.equal($errorRow.length, 1, 'error row is shown'); assert.equal($errorRow.children().attr('colspan'), '2', 'error row colspan'); - assert.equal($errorRow.find('.dx-error-message').text(), 'Test Error', 'error row text'); + + const $errorMessage = $errorRow.find('.dx-error-message'); + assert.equal($errorMessage.text(), 'Test Error', 'error row text'); + + assert.equal($errorMessage.attr('role'), 'alert', 'error message role'); + assert.equal($errorMessage.attr('aria-roledescription'), 'Error', 'error message role description'); }); QUnit.test('Raise error if key field is missed', function(assert) { diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/editing.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/editing.tests.js index 78ac8f06b602..4096f36e2acf 100644 --- a/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/editing.tests.js +++ b/packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/editing.tests.js @@ -12779,6 +12779,10 @@ QUnit.module('Editing with validation', { assert.equal($('.dx-revert-button').parent(this.gridContainer).length, 1, 'revert button is rendered in DataGrid container'); // fixes an accessibility issue (aria-required-children) assert.equal($('.dx-overlay-wrapper.dx-datagrid-revert-tooltip').parent('.dx-datagrid-rowsview').length, 1, 'revert tooltip is rendered in rows view container'); + // fixes an accessibility validation issues + assert.equal($('.dx-revert-button').attr('aria-label'), 'Press Escape to discard the changes', 'revert button label'); + const $input = $(this.getCellElement(0, 1)).find('.dx-texteditor-input'); + assert.equal($input.attr('aria-labelledby'), 'dxRevertButton dxInvalidMessage', 'input has aria validation attributes'); }); // T297742