fix(statusalert): Expose focus function on StatusAlert component

openedx · Dec 7, 2017 · a18fd5d · a18fd5d
2 parents 805e888 + b783247
commit a18fd5d
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 0 deletions.
diff --git a/src/StatusAlert/StatusAlert.test.jsx b/src/StatusAlert/StatusAlert.test.jsx
@@ -2,6 +2,7 @@ import React from 'react';
 import { mount } from 'enzyme';
 
 import StatusAlert from './index';
+import Button from '../Button';
 
 const statusAlertOpen = (isOpen, wrapper) => {
   expect(wrapper.childAt(0).hasClass('show')).toEqual(isOpen);
@@ -114,4 +115,22 @@ describe('<StatusAlert />', () => {
       statusAlertOpen(true, wrapper);
     });
   });
+  describe('focus functions properly', () => {
+    it('focus function changes focus', () => {
+      wrapper = mount(<div>
+        <Button label="test" />
+        <StatusAlert {...defaultProps} />
+      </div>);
+
+      const buttons = wrapper.find('button');
+
+      // move focus away from default StatusAlert xButton
+      buttons.at(0).simulate('click');
+      expect(buttons.at(0).html()).toEqual(document.activeElement.outerHTML);
+
+      const statusAlert = wrapper.find('StatusAlert').instance();
+      statusAlert.focus();
+      expect(buttons.at(1).html()).toEqual(document.activeElement.outerHTML);
+    });
+  });
 });
diff --git a/src/StatusAlert/index.jsx b/src/StatusAlert/index.jsx
@@ -37,6 +37,10 @@ class StatusAlert extends React.Component {
     }
   }
 
+  focus() {
+    this.xButton.focus();
+  }
+
   close() {
     this.setState({ open: false });
     this.props.onClose();