fix(Form): use the visible label as the accessible name of the submit and reset buttons

src/components/Form/Form.test.tsx

@@ -258,8 +258,6 @@ describe('Form', () => {
       return screen.getByLabelText<HTMLInputElement>('Name');
     };
 
-    // The button is identified by its aria-label, so the query does not depend on the resolved
-    // translation for the visible text.
     const getResetButton = () => screen.getByRole('button', { name: 'Reset' });
 
     afterEach(() => {
@@ -399,4 +397,36 @@ describe('Form', () => {
       expect(onSubmit).toHaveBeenCalledWith({ symptoms: new Set(['none']) });
     });
   });
+
+  describe('button accessible names', () => {
+    const renderForm = (props?: { resetBtn?: boolean; submitBtnLabel?: string }) => {
+      render(
+        <Form
+          content={{ name: { kind: 'string', label: 'Name', variant: 'input' } }}
+          data-testid={testid}
+          validationSchema={z.object({ name: z.string() })}
+          onSubmit={onSubmit}
+          {...props}
+        />
+      );
+    };
+
+    it('should name the submit button after its default visible label', () => {
+      renderForm();
+      expect(screen.getByRole('button', { name: 'Submit' })).toHaveAttribute('type', 'submit');
+    });
+
+    it('should name the submit button after a custom submitBtnLabel', () => {
+      renderForm({ submitBtnLabel: 'Save' });
+      expect(screen.getByRole('button', { name: 'Save' })).toHaveAttribute('type', 'submit');
+      expect(screen.queryByRole('button', { name: 'Submit' })).not.toBeInTheDocument();
+    });
+
+    it('should not override the visible text of either button with an aria-label', () => {
+      renderForm({ resetBtn: true });
+      for (const button of screen.getAllByRole('button')) {
+        expect(button).not.toHaveAttribute('aria-label');
+      }
+    });
+  });
 });

src/components/Form/Form.tsx

@@ -251,9 +251,7 @@ const Form = <TSchema extends ZodTypeLike<FormDataType>, TData extends TSchema['
       {fieldsFooter}
       <div className="flex w-full gap-3">
         {additionalButtons?.left}
-        {/** Note - aria-label is used for testing in downstream packages */}
         <Button
-          aria-label="Submit"
           className={cn('flex w-full items-center justify-center gap-2', customStyles?.submitBtn)}
           disabled={readOnly || isSuspended}
           type="submit"
@@ -277,7 +275,6 @@ const Form = <TSchema extends ZodTypeLike<FormDataType>, TData extends TSchema['
         </Button>
         {resetBtn && (
           <Button
-            aria-label="Reset"
             className={cn('block w-full', customStyles?.resetBtn)}
             disabled={readOnly}
             type="button"