mirror of
https://github.com/ansible/awx.git
synced 2026-05-23 08:37:48 -02:30
migrate App.jsx to mountwithContext
This commit is contained in:
@@ -1,50 +1,36 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { MemoryRouter } from 'react-router-dom';
|
|
||||||
import { I18nProvider } from '@lingui/react';
|
|
||||||
|
|
||||||
import { mount } from 'enzyme';
|
import { mountWithContexts } from './enzymeHelpers';
|
||||||
|
|
||||||
import { asyncFlush } from '../jest.setup';
|
import { asyncFlush } from '../jest.setup';
|
||||||
|
|
||||||
import { ConfigProvider } from '../src/contexts/Config';
|
import App from '../src/App';
|
||||||
import { NetworkProvider } from '../src/contexts/Network';
|
|
||||||
|
|
||||||
import App, { _App } from '../src/App';
|
|
||||||
|
|
||||||
const networkProviderValue = { api: {}, handleHttpError: () => {} };
|
|
||||||
|
|
||||||
describe('<App />', () => {
|
describe('<App />', () => {
|
||||||
test('expected content is rendered', () => {
|
test('expected content is rendered', () => {
|
||||||
const appWrapper = mount(
|
const appWrapper = mountWithContexts(
|
||||||
<MemoryRouter>
|
<App
|
||||||
<I18nProvider>
|
routeGroups={[
|
||||||
<NetworkProvider value={networkProviderValue}>
|
{
|
||||||
<ConfigProvider>
|
groupTitle: 'Group One',
|
||||||
<App
|
groupId: 'group_one',
|
||||||
routeGroups={[
|
routes: [
|
||||||
{
|
{ title: 'Foo', path: '/foo' },
|
||||||
groupTitle: 'Group One',
|
{ title: 'Bar', path: '/bar' },
|
||||||
groupId: 'group_one',
|
],
|
||||||
routes: [
|
},
|
||||||
{ title: 'Foo', path: '/foo' },
|
{
|
||||||
{ title: 'Bar', path: '/bar' },
|
groupTitle: 'Group Two',
|
||||||
],
|
groupId: 'group_two',
|
||||||
},
|
routes: [
|
||||||
{
|
{ title: 'Fiz', path: '/fiz' },
|
||||||
groupTitle: 'Group Two',
|
]
|
||||||
groupId: 'group_two',
|
}
|
||||||
routes: [
|
]}
|
||||||
{ title: 'Fiz', path: '/fiz' },
|
render={({ routeGroups }) => (
|
||||||
]
|
routeGroups.map(({ groupId }) => (<div key={groupId} id={groupId} />))
|
||||||
}
|
)}
|
||||||
]}
|
/>
|
||||||
render={({ routeGroups }) => (
|
|
||||||
routeGroups.map(({ groupId }) => (<div key={groupId} id={groupId} />))
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
</ConfigProvider>
|
|
||||||
</NetworkProvider>
|
|
||||||
</I18nProvider>
|
|
||||||
</MemoryRouter>
|
|
||||||
);
|
);
|
||||||
|
|
||||||
// page components
|
// page components
|
||||||
@@ -69,17 +55,7 @@ describe('<App />', () => {
|
|||||||
|
|
||||||
const config = { ansible_version, version };
|
const config = { ansible_version, version };
|
||||||
|
|
||||||
const wrapper = mount(
|
const wrapper = mountWithContexts(<App />, { context: { config } });
|
||||||
<MemoryRouter>
|
|
||||||
<I18nProvider>
|
|
||||||
<NetworkProvider value={networkProviderValue}>
|
|
||||||
<ConfigProvider value={config}>
|
|
||||||
<App />
|
|
||||||
</ConfigProvider>
|
|
||||||
</NetworkProvider>
|
|
||||||
</I18nProvider>
|
|
||||||
</MemoryRouter>
|
|
||||||
);
|
|
||||||
|
|
||||||
// open about modal
|
// open about modal
|
||||||
const aboutDropdown = 'Dropdown QuestionCircleIcon';
|
const aboutDropdown = 'Dropdown QuestionCircleIcon';
|
||||||
@@ -106,19 +82,8 @@ describe('<App />', () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
test('onNavToggle sets state.isNavOpen to opposite', () => {
|
test('onNavToggle sets state.isNavOpen to opposite', () => {
|
||||||
const appWrapper = mount(
|
const appWrapper = mountWithContexts(<App />).find('App');
|
||||||
<MemoryRouter>
|
|
||||||
<I18nProvider>
|
|
||||||
<NetworkProvider value={networkProviderValue}>
|
|
||||||
<ConfigProvider>
|
|
||||||
<App />
|
|
||||||
</ConfigProvider>
|
|
||||||
</NetworkProvider>
|
|
||||||
</I18nProvider>
|
|
||||||
</MemoryRouter>
|
|
||||||
).find('App');
|
|
||||||
const { onNavToggle } = appWrapper.instance();
|
const { onNavToggle } = appWrapper.instance();
|
||||||
|
|
||||||
[true, false, true, false, true].forEach(expected => {
|
[true, false, true, false, true].forEach(expected => {
|
||||||
expect(appWrapper.state().isNavOpen).toBe(expected);
|
expect(appWrapper.state().isNavOpen).toBe(expected);
|
||||||
onNavToggle();
|
onNavToggle();
|
||||||
@@ -128,17 +93,9 @@ describe('<App />', () => {
|
|||||||
test('onLogout makes expected call to api client', async (done) => {
|
test('onLogout makes expected call to api client', async (done) => {
|
||||||
const logout = jest.fn(() => Promise.resolve());
|
const logout = jest.fn(() => Promise.resolve());
|
||||||
|
|
||||||
const appWrapper = mount(
|
const appWrapper = mountWithContexts(<App />, {
|
||||||
<MemoryRouter>
|
context: { network: { api: { logout }, handleHttpError: () => {} } }
|
||||||
<I18nProvider>
|
}).find('App');
|
||||||
<NetworkProvider value={networkProviderValue}>
|
|
||||||
<ConfigProvider>
|
|
||||||
<_App api={{ logout }} handleHttpError={() => {}} />
|
|
||||||
</ConfigProvider>
|
|
||||||
</NetworkProvider>
|
|
||||||
</I18nProvider>
|
|
||||||
</MemoryRouter>
|
|
||||||
).find('App');
|
|
||||||
|
|
||||||
appWrapper.instance().onLogout();
|
appWrapper.instance().onLogout();
|
||||||
await asyncFlush();
|
await asyncFlush();
|
||||||
|
|||||||
@@ -45,6 +45,12 @@ const defaultContexts = {
|
|||||||
push: () => {},
|
push: () => {},
|
||||||
replace: () => {},
|
replace: () => {},
|
||||||
createHref: () => {},
|
createHref: () => {},
|
||||||
|
location: {
|
||||||
|
hash: '',
|
||||||
|
pathname: '',
|
||||||
|
search: '',
|
||||||
|
state: '',
|
||||||
|
}
|
||||||
},
|
},
|
||||||
route: {
|
route: {
|
||||||
location: {
|
location: {
|
||||||
@@ -58,7 +64,7 @@ const defaultContexts = {
|
|||||||
isExact: false,
|
isExact: false,
|
||||||
path: '',
|
path: '',
|
||||||
url: '',
|
url: '',
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
toJSON: () => '/router/',
|
toJSON: () => '/router/',
|
||||||
},
|
},
|
||||||
|
|||||||
Reference in New Issue
Block a user