update OrganizsationAccess and OrganizationAccessList w mountWithContexts

This commit is contained in:
John Mitchell
2019-04-18 17:18:19 -04:00
parent a6f79c646d
commit 54499dbf69
6 changed files with 54 additions and 142 deletions

View File

@@ -1,8 +1,6 @@
import React from 'react'; import React from 'react';
import { mount } from 'enzyme';
import { MemoryRouter } from 'react-router-dom';
import { I18nProvider } from '@lingui/react';
import { mountWithContexts } from '../../../enzymeHelpers';
import OrganizationAccessList, { _OrganizationAccessList } from '../../../../src/pages/Organizations/components/OrganizationAccessList'; import OrganizationAccessList, { _OrganizationAccessList } from '../../../../src/pages/Organizations/components/OrganizationAccessList';
const mockData = [ const mockData = [
@@ -31,32 +29,20 @@ describe('<OrganizationAccessList />', () => {
}); });
test('initially renders succesfully', () => { test('initially renders succesfully', () => {
mount( mountWithContexts(
<I18nProvider> <OrganizationAccessList
<MemoryRouter> getAccessList={() => {}}
<OrganizationAccessList removeRole={() => {}}
match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '1' } }} />
location={{ search: '', pathname: '/organizations/1/access' }}
getAccessList={() => {}}
removeRole={() => {}}
/>
</MemoryRouter>
</I18nProvider>
); );
}); });
test('api response data passed to component gets set to state properly', (done) => { test('api response data passed to component gets set to state properly', (done) => {
const wrapper = mount( const wrapper = mountWithContexts(
<I18nProvider> <OrganizationAccessList
<MemoryRouter> getAccessList={() => ({ data: { count: 1, results: mockData } })}
<OrganizationAccessList removeRole={() => {}}
match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }} />
location={{ search: '', pathname: '/organizations/1/access' }}
getAccessList={() => ({ data: { count: 1, results: mockData } })}
removeRole={() => {}}
/>
</MemoryRouter>
</I18nProvider>
).find('OrganizationAccessList'); ).find('OrganizationAccessList');
setImmediate(() => { setImmediate(() => {
@@ -67,18 +53,11 @@ describe('<OrganizationAccessList />', () => {
test('onSort being passed properly to DataListToolbar component', async (done) => { test('onSort being passed properly to DataListToolbar component', async (done) => {
const onSort = jest.spyOn(_OrganizationAccessList.prototype, 'onSort'); const onSort = jest.spyOn(_OrganizationAccessList.prototype, 'onSort');
const wrapper = mount( const wrapper = mountWithContexts(
<I18nProvider> <OrganizationAccessList
<MemoryRouter> getAccessList={() => ({ data: { count: 1, results: mockData } })}
<_OrganizationAccessList removeRole={() => {}}
match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }} />
location={{ search: '', pathname: '/organizations/1/access' }}
getAccessList={() => ({ data: { count: 1, results: mockData } })}
removeRole={() => {}}
handleHttpError={() => {}}
/>
</MemoryRouter>
</I18nProvider>
).find('OrganizationAccessList'); ).find('OrganizationAccessList');
expect(onSort).not.toHaveBeenCalled(); expect(onSort).not.toHaveBeenCalled();
@@ -91,17 +70,11 @@ describe('<OrganizationAccessList />', () => {
}); });
test('getTeamRoles returns empty array if dataset is missing team_id attribute', (done) => { test('getTeamRoles returns empty array if dataset is missing team_id attribute', (done) => {
const wrapper = mount( const wrapper = mountWithContexts(
<I18nProvider> <OrganizationAccessList
<MemoryRouter> getAccessList={() => ({ data: { count: 1, results: mockData } })}
<OrganizationAccessList removeRole={() => {}}
match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }} />
location={{ search: '', pathname: '/organizations/1/access' }}
getAccessList={() => ({ data: { count: 1, results: mockData } })}
removeRole={() => {}}
/>
</MemoryRouter>
</I18nProvider>
).find('OrganizationAccessList'); ).find('OrganizationAccessList');
setImmediate(() => { setImmediate(() => {
@@ -117,18 +90,11 @@ describe('<OrganizationAccessList />', () => {
const handleWarning = jest.spyOn(_OrganizationAccessList.prototype, 'handleWarning'); const handleWarning = jest.spyOn(_OrganizationAccessList.prototype, 'handleWarning');
const confirmDelete = jest.spyOn(_OrganizationAccessList.prototype, 'confirmDelete'); const confirmDelete = jest.spyOn(_OrganizationAccessList.prototype, 'confirmDelete');
const removeRole = jest.spyOn(_OrganizationAccessList.prototype, 'removeAccessRole'); const removeRole = jest.spyOn(_OrganizationAccessList.prototype, 'removeAccessRole');
const wrapper = mount( const wrapper = mountWithContexts(
<I18nProvider> <OrganizationAccessList
<MemoryRouter> getAccessList={() => ({ data: { count: 1, results: mockData } })}
<_OrganizationAccessList removeRole={() => {}}
match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }} />
location={{ search: '', pathname: '/organizations/1/access' }}
getAccessList={() => ({ data: { count: 1, results: mockData } })}
removeRole={() => {}}
handleHttpError={() => {}}
/>
</MemoryRouter>
</I18nProvider>
).find('OrganizationAccessList'); ).find('OrganizationAccessList');
expect(handleWarning).not.toHaveBeenCalled(); expect(handleWarning).not.toHaveBeenCalled();
expect(confirmDelete).not.toHaveBeenCalled(); expect(confirmDelete).not.toHaveBeenCalled();
@@ -147,17 +113,11 @@ describe('<OrganizationAccessList />', () => {
}); });
test('state is set appropriately when a user tries deleting a role', (done) => { test('state is set appropriately when a user tries deleting a role', (done) => {
const wrapper = mount( const wrapper = mountWithContexts(
<I18nProvider> <OrganizationAccessList
<MemoryRouter> getAccessList={() => ({ data: { count: 1, results: mockData } })}
<_OrganizationAccessList removeRole={() => {}}
match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }} />
location={{ search: '', pathname: '/organizations/1/access' }}
getAccessList={() => ({ data: { count: 1, results: mockData } })}
removeRole={() => {}}
/>
</MemoryRouter>
</I18nProvider>
).find('OrganizationAccessList'); ).find('OrganizationAccessList');
setImmediate(() => { setImmediate(() => {

View File

@@ -1,20 +1,9 @@
import React from 'react'; import React from 'react';
import { mount } from 'enzyme'; import { mountWithContexts } from '../../../../enzymeHelpers';
import { MemoryRouter } from 'react-router-dom';
import { I18nProvider } from '@lingui/react';
import Organization from '../../../../../src/pages/Organizations/screens/Organization/Organization'; import Organization from '../../../../../src/pages/Organizations/screens/Organization/Organization';
describe('<OrganizationView />', () => { describe('<OrganizationView />', () => {
test('initially renders succesfully', () => { test('initially renders succesfully', () => {
mount( mountWithContexts(<Organization />);
<I18nProvider>
<MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
<Organization
match={{ path: '/organizations/:id', url: '/organizations/1' }}
location={{ search: '', pathname: '/organizations/1' }}
/>
</MemoryRouter>
</I18nProvider>
);
}); });
}); });

View File

@@ -1,51 +1,26 @@
import React from 'react'; import React from 'react';
import { mount } from 'enzyme'; import { mountWithContexts } from '../../../../enzymeHelpers';
import { MemoryRouter } from 'react-router-dom';
import OrganizationAccess from '../../../../../src/pages/Organizations/screens/Organization/OrganizationAccess'; import OrganizationAccess from '../../../../../src/pages/Organizations/screens/Organization/OrganizationAccess';
const mockAPIAccessList = {
foo: 'bar',
};
const mockGetOrganizationAccessList = () => Promise.resolve(mockAPIAccessList);
const mockResponse = {
status: 'success',
};
const mockRemoveRole = () => Promise.resolve(mockResponse);
describe('<OrganizationAccess />', () => { describe('<OrganizationAccess />', () => {
test('initially renders succesfully', () => { test('initially renders succesfully', () => {
mount( mountWithContexts(<OrganizationAccess />);
<MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
<OrganizationAccess
match={{ path: '/organizations/:id/access', url: '/organizations/1/access', params: { id: 1 } }}
location={{ search: '', pathname: '/organizations/1/access' }}
params={{}}
api={{
getOrganizationAccessList: jest.fn(),
}}
/>
</MemoryRouter>
);
}); });
test('passed methods as props are called appropriately', async () => { test('passed methods as props are called appropriately', async () => {
const wrapper = mount( const mockAPIAccessList = {
<MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}> foo: 'bar',
<OrganizationAccess };
match={{ path: '/organizations/:id/access', url: '/organizations/1/access', params: { id: 1 } }} const mockResponse = {
location={{ search: '', pathname: '/organizations/1/access' }} status: 'success',
params={{}} };
api={{ const wrapper = mountWithContexts(<OrganizationAccess />, { context: { network: {
getOrganizationAccessList: mockGetOrganizationAccessList, api: {
disassociate: mockRemoveRole getOrganizationAccessList: () => Promise.resolve(mockAPIAccessList),
}} disassociate: () => Promise.resolve(mockResponse)
/> },
</MemoryRouter> handleHttpError: () => {}
).find('OrganizationAccess'); } } }).find('OrganizationAccess');
const accessList = await wrapper.instance().getOrgAccessList(); const accessList = await wrapper.instance().getOrgAccessList();
expect(accessList).toEqual(mockAPIAccessList); expect(accessList).toEqual(mockAPIAccessList);
const resp = await wrapper.instance().removeRole(2, 3, 'users'); const resp = await wrapper.instance().removeRole(2, 3, 'users');

View File

@@ -10,7 +10,8 @@ import { I18n, i18nMark } from '@lingui/react';
import { t, Trans } from '@lingui/macro'; import { t, Trans } from '@lingui/macro';
import { import {
Link Link,
withRouter
} from 'react-router-dom'; } from 'react-router-dom';
import { withNetwork } from '../../../contexts/Network'; import { withNetwork } from '../../../contexts/Network';
@@ -160,8 +161,8 @@ class OrganizationAccessList extends React.Component {
} }
getQueryParams (overrides = {}) { getQueryParams (overrides = {}) {
const { location } = this.props; const { history } = this.props;
const { search } = location; const { search } = history.location;
const searchParams = parseQueryString(search.substring(1)); const searchParams = parseQueryString(search.substring(1));
@@ -422,4 +423,4 @@ OrganizationAccessList.propTypes = {
}; };
export { OrganizationAccessList as _OrganizationAccessList }; export { OrganizationAccessList as _OrganizationAccessList };
export default withNetwork(OrganizationAccessList); export default withRouter(withNetwork(OrganizationAccessList));

View File

@@ -148,11 +148,7 @@ class Organization extends Component {
<Route <Route
path="/organizations/:id/access" path="/organizations/:id/access"
render={() => ( render={() => (
<OrganizationAccess <OrganizationAccess />
match={match}
location={location}
history={history}
/>
)} )}
/> />
<Route <Route

View File

@@ -23,19 +23,10 @@ class OrganizationAccess extends React.Component {
} }
render () { render () {
const {
location,
match,
history,
} = this.props;
return ( return (
<OrganizationAccessList <OrganizationAccessList
getAccessList={this.getOrgAccessList} getAccessList={this.getOrgAccessList}
removeRole={this.removeRole} removeRole={this.removeRole}
match={match}
location={location}
history={history}
/> />
); );
} }