Merge pull request #2495 from anuradha9712/fix-radio-component-props

fix(radio): update props order to accept data-test properly in radio component
innovaccer · Jan 16, 2025 · bbca56b · bbca56b
2 parents 3363b77 + 34f5b3c
commit bbca56b
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/core/components/atoms/radio/Radio.tsx b/core/components/atoms/radio/Radio.tsx
@@ -104,7 +104,6 @@ export const Radio = React.forwardRef<HTMLInputElement, RadioProps>((props, forw
       <div className={RadioOuterWrapper} data-test="DesignSystem-Radio-OuterWrapper">
         <input
           tabIndex={0}
-          {...rest}
           type="radio"
           disabled={disabled}
           checked={checked}
@@ -116,6 +115,7 @@ export const Radio = React.forwardRef<HTMLInputElement, RadioProps>((props, forw
           className={styles['Radio-input']}
           id={id}
           data-test="DesignSystem-Radio-Input"
+          {...rest}
         />
         <span data-test="DesignSystem-Radio-wrapper" className={RadioWrapper} />
       </div>

diff --git a/core/components/atoms/radio/__tests__/Radio.test.tsx b/core/components/atoms/radio/__tests__/Radio.test.tsx
@@ -179,4 +179,14 @@ describe('Radio component', () => {
     fireEvent.change(input, { target: { checked: true } });
     expect(input).toBeChecked();
   });
+
+  it('checks for data-test attribute', () => {
+    const testDataValue = 'DesignSystem-Radio-TestValue';
+    const { getByTestId } = render(
+      <Radio data-test={testDataValue} label={label} name={StringValue} value={StringValue} />
+    );
+
+    const radioElement = getByTestId('DesignSystem-Radio-TestValue');
+    expect(radioElement.getAttribute('data-test')).toBe(testDataValue);
+  });
 });