fix: for date picker, remove invalid aria role and add aria-description

Author: davidnixon

src/components/CvDatePicker/CvDatePicker.vue

@@ -40,7 +40,8 @@
             ref="date"
             type="text"
             data-date-picker-input
-            role="datepicker"
+            data-testid="datepicker"
+            :aria-description="placeholder"
             :data-invalid="isInvalid || null"
             :disabled="disabled || null"
             :data-date-picker-input-from="`${getKind === 'range'}`"
@@ -85,7 +86,8 @@
             ref="todate"
             type="text"
             data-date-picker-input
-            role="todatepicker"
+            data-testid="todatepicker"
+            :aria-description="placeholder"
             :data-date-picker-input-to="`${kind === 'range'}`"
             :data-invalid="isInvalid || null"
             :disabled="disabled || null"

src/components/CvDatePicker/__tests__/CvDatePicker.spec.js

@@ -17,7 +17,7 @@ describe('CvDatePicker', () => {
       },
     });
 
-    const datepicker = await result.findByRole('datepicker');
+    const datepicker = await result.findByTestId('datepicker');
 
     const user = userEvent.setup();
 
@@ -56,7 +56,7 @@ describe('CvDatePicker', () => {
       },
     });
 
-    const datepicker = await result.findByRole('datepicker');
+    const datepicker = await result.findByTestId('datepicker');
 
     const user = userEvent.setup();
 
@@ -118,8 +118,8 @@ describe('CvDatePicker', () => {
       },
     });
 
-    const datepicker = await result.findByRole('datepicker');
-    const todatepicker = await result.findByRole('todatepicker');
+    const datepicker = await result.findByTestId('datepicker');
+    const todatepicker = await result.findByTestId('todatepicker');
 
     const user = userEvent.setup();