Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[App Search] Update EngineRouter & EngineNav to use EngineLogic #83138

Merged
merged 6 commits into from
Nov 11, 2020
Merged

[App Search] Update EngineRouter & EngineNav to use EngineLogic #83138

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
3d9725f
Add server-side route
cee-chen Nov 4, 2020
12d7805
Add EngineRouter logic
cee-chen Nov 9, 2020
9fc3ef8
Add EngineNav logic
cee-chen Nov 9, 2020
2556da7
Split out EngineRouter and EngineNav into separate files
cee-chen Nov 11, 2020
e10cc76
[PR feedback] More explicit test cases
cee-chen Nov 11, 2020
2297900
Merge remote-tracking branch 'upstream/master' into engine-logic
cee-chen Nov 11, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 8 additions & 0 deletions ...lugins/enterprise_search/public/applications/app_search/components/engine/engine_nav.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,3 +15,11 @@
margin-top: $euiSizeXS;
}
}

.appSearchNavIcons {
// EUI override
&.euiFlexItem {
flex-grow: 0;
flex-direction: row;
}
}
164 changes: 109 additions & 55 deletions ...ns/enterprise_search/public/applications/app_search/components/engine/engine_nav.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,134 +4,188 @@
* you may not use this file except in compliance with the Elastic License.
*/

import '../../../__mocks__/react_router_history.mock';
import { setMockValues } from '../../../__mocks__/kea.mock';

import React from 'react';
import { shallow, mount } from 'enzyme';
import { Switch, useParams } from 'react-router-dom';
import { EuiBadge } from '@elastic/eui';
import { shallow } from 'enzyme';
import { EuiBadge, EuiIcon } from '@elastic/eui';

import { EngineRouter, EngineNav } from './';
import { EngineNav } from './';

describe('EngineRouter', () => {
it('renders a default engine overview', () => {
setMockValues({ myRole: {} });
const wrapper = shallow(<EngineRouter />);

expect(wrapper.find(Switch)).toHaveLength(1);
expect(wrapper.find('[data-test-subj="EngineOverviewTODO"]')).toHaveLength(1);
});

it('renders an analytics view', () => {
setMockValues({ myRole: { canViewEngineAnalytics: true } });
const wrapper = shallow(<EngineRouter />);
describe('EngineNav', () => {
const values = { myRole: {}, engineName: 'some-engine', dataLoading: false, engine: {} };

expect(wrapper.find('[data-test-subj="AnalyticsTODO"]')).toHaveLength(1);
beforeEach(() => {
setMockValues(values);
});
});

describe('EngineNav', () => {
beforeEach(() => {
(useParams as jest.Mock).mockReturnValue({ engineName: 'some-engine' });
it('does not render if async data is still loading', () => {
setMockValues({ ...values, dataLoading: true });
const wrapper = shallow(<EngineNav />);
expect(wrapper.isEmptyRender()).toBe(true);
});

it('does not render without an engine name', () => {
setMockValues({ myRole: {} });
(useParams as jest.Mock).mockReturnValue({ engineName: '' });
setMockValues({ ...values, engineName: '' });
const wrapper = shallow(<EngineNav />);
expect(wrapper.isEmptyRender()).toBe(true);
});

it('renders an engine label', () => {
setMockValues({ myRole: {} });
const wrapper = mount(<EngineNav />);
it('renders an engine label and badges', () => {
setMockValues({ ...values, isSampleEngine: false, isMetaEngine: false });
const wrapper = shallow(<EngineNav />);
const label = wrapper.find('[data-test-subj="EngineLabel"]').find('.eui-textTruncate');

expect(label.text()).toEqual('SOME-ENGINE');
expect(wrapper.find(EuiBadge)).toHaveLength(0);

const label = wrapper.find('[data-test-subj="EngineLabel"]').last();
expect(label.text()).toEqual(expect.stringContaining('SOME-ENGINE'));
setMockValues({ ...values, isSampleEngine: true });
wrapper.setProps({}); // Re-render
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I have a PR coming immediately after this one that creates a new rerender(wrapper); test helper so we don't need all these clarification comments.

expect(wrapper.find(EuiBadge).prop('children')).toEqual('SAMPLE ENGINE');

// TODO: Test sample & meta engine conditional rendering
expect(label.find(EuiBadge).text()).toEqual('SAMPLE ENGINE');
setMockValues({ ...values, isMetaEngine: true });
wrapper.setProps({}); // Re-render
expect(wrapper.find(EuiBadge).prop('children')).toEqual('META ENGINE');
});

it('renders a default engine overview link', () => {
setMockValues({ myRole: {} });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="EngineOverviewLink"]')).toHaveLength(1);
});

it('renders an analytics link', () => {
setMockValues({ myRole: { canViewEngineAnalytics: true } });
setMockValues({ ...values, myRole: { canViewEngineAnalytics: true } });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="EngineAnalyticsLink"]')).toHaveLength(1);
});

it('renders a documents link', () => {
setMockValues({ myRole: { canViewEngineDocuments: true } });
setMockValues({ ...values, myRole: { canViewEngineDocuments: true } });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="EngineDocumentsLink"]')).toHaveLength(1);
});

it('renders a schema link', () => {
setMockValues({ myRole: { canViewEngineSchema: true } });
setMockValues({ ...values, myRole: { canViewEngineSchema: true } });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="EngineSchemaLink"]')).toHaveLength(1);
});

describe('schema nav icons', () => {
const myRole = { canViewEngineSchema: true };

it('renders unconfirmed schema fields info icon', () => {
setMockValues({ ...values, myRole, hasUnconfirmedSchemaFields: true });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="EngineNavSchemaUnconfirmedFields"]')).toHaveLength(1);
});

// TODO: Schema warning icon
it('renders schema conflicts alert icon', () => {
setMockValues({ ...values, myRole, hasSchemaConflicts: true });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="EngineNavSchemaConflicts"]')).toHaveLength(1);
});
});

// TODO: Unskip when EngineLogic is migrated
it.skip('renders a crawler link', () => {
setMockValues({ myRole: { canViewEngineCrawler: true } });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="EngineCrawlerLink"]')).toHaveLength(1);
describe('crawler link', () => {
const myRole = { canViewEngineCrawler: true };

it('renders', () => {
setMockValues({ ...values, myRole });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="EngineCrawlerLink"]')).toHaveLength(1);
});

it('does not render for meta engines', () => {
setMockValues({ ...values, myRole, isMetaEngine: true });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="EngineCrawlerLink"]')).toHaveLength(0);
});

// TODO: Test that the crawler link does NOT show up for meta/sample engines
it('does not render for sample engine', () => {
setMockValues({ ...values, myRole, isSampleEngine: true });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="EngineCrawlerLink"]')).toHaveLength(0);
});
});

// TODO: Unskip when EngineLogic is migrated
it.skip('renders a meta engine source engines link', () => {
setMockValues({ myRole: { canViewMetaEngineSourceEngines: true } });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="MetaEngineEnginesLink"]')).toHaveLength(1);
describe('meta engine source engines link', () => {
const myRole = { canViewMetaEngineSourceEngines: true };

it('renders', () => {
setMockValues({ ...values, myRole, isMetaEngine: true });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="MetaEngineEnginesLink"]')).toHaveLength(1);
});

// TODO: Test that the crawler link does NOT show up for non-meta engines
it('does not render for non meta engines', () => {
setMockValues({ ...values, myRole, isMetaEngine: false });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="MetaEngineEnginesLink"]')).toHaveLength(0);
});
});

it('renders a relevance tuning link', () => {
setMockValues({ myRole: { canManageEngineRelevanceTuning: true } });
setMockValues({ ...values, myRole: { canManageEngineRelevanceTuning: true } });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="EngineRelevanceTuningLink"]')).toHaveLength(1);
});

describe('relevance tuning nav icons', () => {
const myRole = { canManageEngineRelevanceTuning: true };

it('renders unconfirmed schema fields info icon', () => {
const engine = { unsearchedUnconfirmedFields: true };
setMockValues({ ...values, myRole, engine });
const wrapper = shallow(<EngineNav />);
expect(
wrapper.find('[data-test-subj="EngineNavRelevanceTuningUnsearchedFields"]')
).toHaveLength(1);
});

it('renders schema conflicts alert icon', () => {
const engine = { invalidBoosts: true };
setMockValues({ ...values, myRole, engine });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="EngineNavRelevanceTuningInvalidBoosts"]')).toHaveLength(
1
);
});

// TODO: Boost error icon
it('can render multiple icons', () => {
const engine = { invalidBoosts: true, unsearchedUnconfirmedFields: true };
setMockValues({ ...values, myRole, engine });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find(EuiIcon)).toHaveLength(2);
});
});

it('renders a synonyms link', () => {
setMockValues({ myRole: { canManageEngineSynonyms: true } });
setMockValues({ ...values, myRole: { canManageEngineSynonyms: true } });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="EngineSynonymsLink"]')).toHaveLength(1);
});

it('renders a curations link', () => {
setMockValues({ myRole: { canManageEngineCurations: true } });
setMockValues({ ...values, myRole: { canManageEngineCurations: true } });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="EngineCurationsLink"]')).toHaveLength(1);
});

it('renders a results settings link', () => {
setMockValues({ myRole: { canManageEngineResultSettings: true } });
setMockValues({ ...values, myRole: { canManageEngineResultSettings: true } });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="EngineResultSettingsLink"]')).toHaveLength(1);
});

it('renders a Search UI link', () => {
setMockValues({ myRole: { canManageEngineSearchUi: true } });
setMockValues({ ...values, myRole: { canManageEngineSearchUi: true } });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="EngineSearchUILink"]')).toHaveLength(1);
});

it('renders an API logs link', () => {
setMockValues({ myRole: { canViewEngineApiLogs: true } });
setMockValues({ ...values, myRole: { canViewEngineApiLogs: true } });
const wrapper = shallow(<EngineNav />);
expect(wrapper.find('[data-test-subj="EngineAPILogsLink"]')).toHaveLength(1);
});
Expand Down
Loading