✅ add more tests to select

improves coverage

Author: KRRISH96

lib/select/index.js

@@ -168,6 +168,7 @@ class Select extends Component {
         className={cx(theme.option, { [`${theme['option-hover']}`]: (focus === index) })}
         onClick={() => this.handleSelect(option)}
         key={option.label}
+        data-react-active-item={focus === index ? 'active' : undefined}
       >
         <span>{option.label}</span>
       </span>

lib/select/tests/accessibility.test.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mount, shallow } from 'enzyme';
 import { expect } from 'chai';
 import Select from '..';
 
@@ -20,7 +20,7 @@ describe('Select Accessibility tests', () => {
   };
 
   beforeEach(() => {
-    wrappedComponent = mount(<Select options={data} />);
+    wrappedComponent = mount(shallow(<Select options={data} />).get(0));
   });
 
   afterEach(() => {
@@ -62,4 +62,27 @@ describe('Select Accessibility tests', () => {
     });
     expect(simulatedValue()).to.equal(expectedValueAfterSelection);
   });
+
+  it('Successfully navigates to last item through keypress', () => {
+    const expectedValueAfterKeyDown = 'item 3';
+    focusOnInput();
+    wrappedComponent.find('#select').simulate('keydown', {
+      keyCode: 38,
+      key: 'ArrowUp',
+    });
+    expect(wrappedComponent.find('#select-dropdown span[data-react-active-item="active"]').text()).equals(expectedValueAfterKeyDown);
+  });
+
+  const simulateEvent = (component, event) => wrappedComponent.find(component).simulate(event);
+
+  it('Should toggle blockBlurEvent state properly on mouseenter and mouse leave', () => {
+    const expectedValueBefore = true;
+    const expectedValueAfter = false;
+    const actualValue = () => wrappedComponent.state().blockOnBlur;
+    focusOnInput();
+    simulateEvent('div#select-dropdown', 'mouseenter');
+    expect(actualValue()).to.equal(expectedValueBefore);
+    simulateEvent('div#select-dropdown', 'mouseleave');
+    expect(actualValue()).to.equal(expectedValueAfter);
+  });
 });