fix(button): add aria labels for accessibility

src/components/close-button/CloseButton.tsx

@@ -1,22 +1,29 @@
 import * as React from 'react';
 import classNames from 'classnames';
 
+import { injectIntl, IntlShape } from 'react-intl';
+
 import Button, { ButtonType } from '../button';
 import IconClose from '../../icons/general/IconClose';
 import { bdlGray65 } from '../../styles/variables';
 
+// @ts-ignore flow import
+import messages from '../../common/messages';
+
 import './CloseButton.scss';
 
 export interface CloseButtonProps {
+    intl: IntlShape;
     /** Custom class for the close button */
     className?: string;
     /** onClick handler for the close button */
     onClick?: Function;
 }
 
-const CloseButton = ({ className, onClick }: CloseButtonProps) => {
+const CloseButton = ({ intl, className, onClick }: CloseButtonProps) => {
     return (
         <Button
+            aria-label={intl.formatMessage(messages.close)}
             className={classNames('bdl-CloseButton', className)}
             data-testid="bdl-CloseButton"
             onClick={onClick}
@@ -27,4 +34,5 @@ const CloseButton = ({ className, onClick }: CloseButtonProps) => {
     );
 };
 
-export default CloseButton;
+export { CloseButton as CloseButtonBase };
+export default injectIntl(CloseButton);

src/components/close-button/__tests__/CloseButton.test.tsx

@@ -37,4 +37,12 @@ describe('components/close-button/CloseButton', () => {
             expect(handleClick).toHaveBeenCalledTimes(1);
         });
     });
+
+    describe('accesability properties', () => {
+        test('should have an accesiblity label', () => {
+            render(<CloseButton />);
+            const closeButton = screen.getByRole('button');
+            expect(closeButton).toHaveAttribute('aria-label');
+        });
+    });
 });