adds missing aria-busy property on Button Component when the button i…

…sLoading (#1475)

* solves #1474 Stringifying boolean and defaulting undefined on aria-busy value on Button Component

* adds changeset

* removes the usage of lodash isBoolean in favour of typeof

* replaces snapshot testing for aria-live and aria-busy with attribute checking

* updates changeset message and update type

.changeset/beige-moles-glow.md

@@ -0,0 +1,5 @@
+---
+'@sumup/circuit-ui': patch
+---
+
+Fixed the conditional rendering of aria attributes in loading buttons.

packages/circuit-ui/components/Button/Button.spec.tsx

@@ -206,5 +206,27 @@ describe('Button', () => {
       const actual = await axe(wrapper);
       expect(actual).toHaveNoViolations();
     });
+
+    it('should have aria-busy and aria-live for a loading button', () => {
+      const { getByRole } = renderButton(render, {
+        ...baseProps,
+        isLoading: true,
+        loadingLabel: 'Loading...',
+      });
+      const button = getByRole('button');
+
+      expect(button).toHaveAttribute('aria-live', 'polite');
+      expect(button).toHaveAttribute('aria-busy', 'true');
+    });
+
+    it('should not have aria-busy and aria-live for a regular button', () => {
+      const { getByRole } = renderButton(render, {
+        ...baseProps,
+      });
+      const button = getByRole('button');
+
+      expect(button).not.toHaveAttribute('aria-live');
+      expect(button).not.toHaveAttribute('aria-busy');
+    });
   });
 });

packages/circuit-ui/components/Button/Button.tsx

@@ -372,10 +372,11 @@ export const Button = forwardRef(
     return (
       <StyledButton
         {...props}
-        {...(loadingLabel && {
-          'aria-live': 'polite',
-          'aria-busy': isLoading,
-        })}
+        {...(loadingLabel &&
+          typeof isLoading === 'boolean' && {
+            'aria-live': 'polite',
+            'aria-busy': isLoading,
+          })}
         disabled={disabled || isLoading}
         ref={ref}
         as={props.href ? Link : 'button'}