(superset) 01/02: fix(a11y): associate Description label with TagModal input

[el...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

eschutho pushed a commit to branch fix/a11y-tagmodal-description-label
in repository https://gitbox.apache.org/repos/asf/superset.git

commit 221d44dac4fe9ddf972219c1fa58d503712b867d
Author: Elizabeth Thompson <es...@gmail.com>
AuthorDate: Tue Jul 14 10:15:07 2026 +0000

    fix(a11y): associate Description label with TagModal input
    
    WCAG 2.1 SC 4.1.2 — Level A.
    
    The Tag name field already wires FormLabel/Input via htmlFor+id, but
    the Description field below it was missing both, leaving the visible
    label programmatically unassociated with its input.
---
 superset-frontend/src/features/tags/TagModal.test.tsx | 5 +++++
 superset-frontend/src/features/tags/TagModal.tsx      | 3 ++-
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/superset-frontend/src/features/tags/TagModal.test.tsx b/superset-frontend/src/features/tags/TagModal.test.tsx
index 0fce2de2e83..c9235e001e9 100644
--- a/superset-frontend/src/features/tags/TagModal.test.tsx
+++ b/superset-frontend/src/features/tags/TagModal.test.tsx
@@ -45,6 +45,11 @@ test('renders correctly in create mode', () => {
   expect(getByText('Create Tag')).toBeInTheDocument();
 });
 
+test('description input has an accessible name', async () => {
+  render(<TagModal {...mockedProps} />);
+  expect(await screen.findByLabelText('Description')).toBeInTheDocument();
+});
+
 test('renders correctly in edit mode', () => {
   fetchMock.get(fetchEditFetchObjects, [[]]);
   const editTag: Tag = {
diff --git a/superset-frontend/src/features/tags/TagModal.tsx b/superset-frontend/src/features/tags/TagModal.tsx
index aea360617de..bdb1bfca8f6 100644
--- a/superset-frontend/src/features/tags/TagModal.tsx
+++ b/superset-frontend/src/features/tags/TagModal.tsx
@@ -312,8 +312,9 @@ const TagModal: FC<TagModalProps> = ({
         </Flex>
 
         <Flex vertical gap={theme.sizeUnit}>
-          <FormLabel>{t('Description')}</FormLabel>
+          <FormLabel htmlFor="tag-description">{t('Description')}</FormLabel>
           <Input
+            id="tag-description"
             className="tag-input"
             onChange={handleDescriptionChange}
             placeholder={t('Add description of your tag')}