Commit dfeef77a24 for handsontable.com
commit dfeef77a24601fc558ade92ff16163968cf736c8
Author: Jan Siegel <jansiegel@users.noreply.github.com>
Date: Mon Oct 14 14:28:13 2024 +0200
Remove `aria-hidden` from the TextEditor and PasswordEditor's `TEXTAREA` elements. (#11218)
* Remove `aria-hidden` from the TextEditor and PasswordEditor's `TEXTAREA` elements.
* Add the changelog entry
* Remove the test case responsible for checking the `aria-hidden` attribute in the editor's `TEXTAREA` element.
* Modify a visual-tests case.
diff --git a/.changelogs/11218.json b/.changelogs/11218.json
new file mode 100644
index 0000000000..c760a28c72
--- /dev/null
+++ b/.changelogs/11218.json
@@ -0,0 +1,8 @@
+{
+ "issuesOrigin": "private",
+ "title": "Removed `aria-hidden` from the TextEditor and PasswordEditor's `TEXTAREA` elements. ",
+ "type": "removed",
+ "issueOrPR": 11218,
+ "breaking": false,
+ "framework": "none"
+}
diff --git a/handsontable/src/editors/passwordEditor/passwordEditor.js b/handsontable/src/editors/passwordEditor/passwordEditor.js
index 02b178906e..c855450013 100644
--- a/handsontable/src/editors/passwordEditor/passwordEditor.js
+++ b/handsontable/src/editors/passwordEditor/passwordEditor.js
@@ -1,8 +1,5 @@
import { TextEditor } from '../textEditor';
-import { empty, setAttribute } from '../../helpers/dom/element';
-import {
- A11Y_HIDDEN,
-} from '../../helpers/a11y';
+import { empty } from '../../helpers/dom/element';
export const EDITOR_TYPE = 'password';
@@ -26,12 +23,6 @@ export class PasswordEditor extends TextEditor {
this.textareaStyle.width = 0;
this.textareaStyle.height = 0;
- if (this.hot.getSettings().ariaTags) {
- setAttribute(this.TEXTAREA, [
- A11Y_HIDDEN(),
- ]);
- }
-
empty(this.TEXTAREA_PARENT);
this.TEXTAREA_PARENT.appendChild(this.TEXTAREA);
}
diff --git a/handsontable/src/editors/textEditor/__tests__/a11y/attributes.spec.js b/handsontable/src/editors/textEditor/__tests__/a11y/attributes.spec.js
deleted file mode 100644
index 338a66ba36..0000000000
--- a/handsontable/src/editors/textEditor/__tests__/a11y/attributes.spec.js
+++ /dev/null
@@ -1,22 +0,0 @@
-describe('a11y DOM attributes (ARIA tags)', () => {
- const id = 'testContainer';
-
- beforeEach(function() {
- this.$container = $(`<div id="${id}"></div>`).appendTo('body');
- });
-
- afterEach(function() {
- if (this.$container) {
- destroy();
- this.$container.remove();
- }
- });
-
- it('should add an `aria-hidden` attribute to the editor\'s TEXTAREA element', () => {
- handsontable({});
-
- selectCell(0, 0);
-
- expect(getActiveEditor().TEXTAREA.getAttribute('aria-hidden')).toEqual('true');
- });
-});
diff --git a/handsontable/src/editors/textEditor/textEditor.js b/handsontable/src/editors/textEditor/textEditor.js
index 2ab136ad5e..9f9147a48e 100644
--- a/handsontable/src/editors/textEditor/textEditor.js
+++ b/handsontable/src/editors/textEditor/textEditor.js
@@ -15,8 +15,7 @@ import { createInputElementResizer } from '../../utils/autoResize';
import { isDefined } from '../../helpers/mixed';
import { updateCaretPosition } from './caretPositioner';
import {
- A11Y_HIDDEN,
- A11Y_TABINDEX
+ A11Y_TABINDEX,
} from '../../helpers/a11y';
const EDITOR_VISIBLE_CLASS_NAME = 'ht_editor_visible';
@@ -214,12 +213,6 @@ export class TextEditor extends BaseEditor {
A11Y_TABINDEX(-1),
]);
- if (this.hot.getSettings().ariaTags) {
- setAttribute(this.TEXTAREA, [
- A11Y_HIDDEN(),
- ]);
- }
-
addClass(this.TEXTAREA, 'handsontableInput');
this.textareaStyle = this.TEXTAREA.style;
diff --git a/visual-tests/tests/cross-browser/comment.spec.ts b/visual-tests/tests/cross-browser/comment.spec.ts
index 9015615248..a47ac398b1 100644
--- a/visual-tests/tests/cross-browser/comment.spec.ts
+++ b/visual-tests/tests/cross-browser/comment.spec.ts
@@ -11,7 +11,7 @@ testCrossBrowser(__filename, async({ tablePage }) => {
(await selectCell(1, 1)).click({ button: 'right' });
await tablePage.getByText('Add comment').click();
- await tablePage.getByRole('textbox').fill('This is a comment');
+ await tablePage.locator('.htComments').getByRole('textbox').fill('This is a comment');
const testFileName = path.basename(__filename, '.spec.ts');
await tablePage.screenshot({