refactor(ui): updating test cases

aws-amplify · Sep 20, 2023 · e87ce43 · e87ce43
1 parent a15cfe6
commit e87ce43
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 12 deletions.
diff --git a/packages/react/__tests__/__snapshots__/exports.ts.snap b/packages/react/__tests__/__snapshots__/exports.ts.snap
@@ -10331,6 +10331,9 @@ Object {
       "fontWeight": Object {
         "type": "string",
       },
+      "form": Object {
+        "type": "string",
+      },
       "gap": Object {
         "type": "string",
       },
@@ -10364,9 +10367,6 @@ Object {
       "justifyContent": Object {
         "type": "string",
       },
-      "label": Object {
-        "type": "string",
-      },
       "labelHidden": Object {
         "type": "boolean",
       },
@@ -10376,6 +10376,12 @@ Object {
       "left": Object {
         "type": "string",
       },
+      "legend": Object {
+        "type": "string",
+      },
+      "legendHidden": Object {
+        "type": "boolean",
+      },
       "letterSpacing": Object {
         "type": "string",
       },

diff --git a/packages/react/src/primitives/Fieldset/Fieldset.tsx b/packages/react/src/primitives/Fieldset/Fieldset.tsx
@@ -52,7 +52,6 @@ const FieldsetPrimitive: Primitive<FieldsetProps, 'fieldset'> = (
   const legendClasses = classNames(
     ComponentClassName.FieldsetLegend,
     classNameModifier(ComponentClassName.FieldsetLegend, size),
-    className,
     {
       [ComponentClassName.VisuallyHidden]: legendHidden,
     }

diff --git a/packages/react/src/primitives/RadioGroupField/__tests__/RadioGroupField.test.tsx b/packages/react/src/primitives/RadioGroupField/__tests__/RadioGroupField.test.tsx
@@ -82,18 +82,23 @@ describe('RadioFieldGroup', () => {
       expect(labelElement[0].nodeName).toBe('LEGEND');
     });
 
-    it('should render expected label classname', async () => {
-      render(RadioFieldGroup({ ...basicProps }));
+    it('should have `amplify-fieldset__legend` classname', async () => {
+      render(RadioFieldGroup({ ...basicProps, labelHidden: true }));
 
       const labelElement = await screen.findAllByText(basicProps.legend);
-      expect(labelElement[1]).toHaveClass(ComponentClassName.Label);
+
+      expect(labelElement[1]).toHaveClass('amplify-fieldset__legend');
     });
 
     it('should have `amplify-visually-hidden` class when labelHidden is true', async () => {
       render(RadioFieldGroup({ ...basicProps, labelHidden: true }));
 
       const labelElement = await screen.findAllByText(basicProps.legend);
-      expect(labelElement[1]).toHaveClass('amplify-visually-hidden');
+      // expect(labelElement[1]).toHaveClass('amplify-visually-hidden');
+      // expect(
+      //   labelElement[1].classList.contains('amplify-visually-hidden')
+      // ).toBe(true);
+      expect(labelElement[1].classList).toContain('amplify-visually-hidden');
     });
   });
 
@@ -178,12 +183,25 @@ describe('RadioFieldGroup', () => {
       render(RadioFieldGroup({ ...basicProps, size: 'large' }));
 
       const radioField = await screen.findByTestId(basicProps.testId);
-      expect(radioField).toHaveAttribute('data-size', 'large');
+      // expect(radioField).toHaveAttribute('size', 'large');
+      // expect(radioField).toHaveClass(
+      //   `${ComponentClassName['Fieldset']}--large`
+      // );
+      expect(radioField).toContain(`${ComponentClassName['Fieldset']}--large`);
 
       const radioButtons = await screen.findAllByTestId('radio-button');
-      expect(radioButtons[0]).toHaveAttribute('data-size', 'large');
-      expect(radioButtons[1]).toHaveAttribute('data-size', 'large');
-      expect(radioButtons[2]).toHaveAttribute('data-size', 'large');
+      expect(radioButtons[0]).toHaveAttribute('size', 'large');
+      expect(radioButtons[1]).toHaveAttribute('size', 'large');
+      expect(radioButtons[2]).toHaveAttribute('size', 'large');
+      // expect(radioButtons[0]).toContain(
+      //   `${ComponentClassName['Field']}--large`
+      // );
+      // expect(radioButtons[1]).toContain(
+      //   `${ComponentClassName['Field']}--large`
+      // );
+      // expect(radioButtons[2]).toContain(
+      //   `${ComponentClassName['Field']}--large`
+      // );
     });
 
     it('should render size classes for RadioGroupField', async () => {