Skip to content

Commit

Permalink
Fix failing location tests
Browse files Browse the repository at this point in the history
- By adding a new useLocation mock
+ add SideNavLink active class test

TODO: I should probably rename react_router_history.mock to just react_router.mock
  • Loading branch information
cee-chen committed Aug 11, 2020
1 parent 2cecb4f commit 172d274
Show file tree
Hide file tree
Showing 3 changed files with 33 additions and 2 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
* you may not use this file except in compliance with the Elastic License.
*/

export { mockHistory } from './react_router_history.mock';
export { mockHistory, mockLocation } from './react_router_history.mock';
export { mockKibanaContext } from './kibana_context.mock';
export { mockLicenseContext } from './license_context.mock';
export {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
*/

/**
* NOTE: This variable name MUST start with 'mock*' in order for
* NOTE: These variable names MUST start with 'mock*' in order for
* Jest to accept its use within a jest.mock()
*/
export const mockHistory = {
Expand All @@ -15,9 +15,17 @@ export const mockHistory = {
pathname: '/current-path',
},
};
export const mockLocation = {
key: 'someKey',
pathname: '/current-path',
search: '?query=something',
hash: '#hash',
state: {},
};

jest.mock('react-router-dom', () => ({
useHistory: jest.fn(() => mockHistory),
useLocation: jest.fn(() => mockLocation),
}));

/**
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,10 @@
* you may not use this file except in compliance with the Elastic License.
*/

import '../../__mocks__/react_router_history.mock';

import React from 'react';
import { useLocation } from 'react-router-dom';
import { shallow } from 'enzyme';

import { EuiLink as EuiLinkExternal } from '@elastic/eui';
Expand Down Expand Up @@ -56,6 +59,26 @@ describe('SideNavLink', () => {
expect(externalLink.prop('target')).toEqual('_blank');
});

it('sets an active class if the current path matches the nav link', () => {
(useLocation as jest.Mock).mockImplementationOnce(() => ({ pathname: '/test/' }));

const wrapper = shallow(<SideNavLink to="/test">Link</SideNavLink>);

expect(wrapper.find('.enterpriseSearchNavLinks__item--isActive')).toHaveLength(1);
});

it('sets an active class if the current path is / and the link isRoot', () => {
(useLocation as jest.Mock).mockImplementationOnce(() => ({ pathname: '/' }));

const wrapper = shallow(
<SideNavLink to="/test" isRoot>
Link
</SideNavLink>
);

expect(wrapper.find('.enterpriseSearchNavLinks__item--isActive')).toHaveLength(1);
});

it('passes down custom classes and props', () => {
const wrapper = shallow(
<SideNavLink to="/" className="testing" data-test-subj="testing">
Expand Down

0 comments on commit 172d274

Please sign in to comment.