diff --git a/src/plugins/navigation/public/mocks.ts b/src/plugins/navigation/public/mocks.tsx similarity index 57% rename from src/plugins/navigation/public/mocks.ts rename to src/plugins/navigation/public/mocks.tsx index b9977daf56223..e0d564cbbf35e 100644 --- a/src/plugins/navigation/public/mocks.ts +++ b/src/plugins/navigation/public/mocks.tsx @@ -6,13 +6,20 @@ * your election, the "Elastic License 2.0", the "GNU Affero General Public * License v3.0 only", or the "Server Side Public License, v 1". */ - +import React from 'react'; import { of } from 'rxjs'; +import { UnifiedSearchPublicPluginStart } from '@kbn/unified-search-plugin/public'; import { Plugin } from '.'; +import { createTopNav } from './top_nav_menu'; export type Setup = jest.Mocked>; export type Start = jest.Mocked>; +// mock mountPointPortal +jest.mock('@kbn/react-kibana-mount', () => ({ + MountPointPortal: jest.fn(({ children }) => children), +})); + const createSetupContract = (): jest.Mocked => { const setupContract = { registerMenuItem: jest.fn(), @@ -21,12 +28,21 @@ const createSetupContract = (): jest.Mocked => { return setupContract; }; +export const unifiedSearchMock = { + ui: { + SearchBar: () =>
, + AggregateQuerySearchBar: () =>
, + }, +} as unknown as UnifiedSearchPublicPluginStart; + const createStartContract = (): jest.Mocked => { const startContract = { ui: { - TopNavMenu: jest.fn(), - createTopNavWithCustomContext: jest.fn().mockImplementation(() => jest.fn()), - AggregateQueryTopNavMenu: jest.fn(), + TopNavMenu: jest.fn().mockImplementation(createTopNav(unifiedSearchMock, [])), + AggregateQueryTopNavMenu: jest.fn().mockImplementation(createTopNav(unifiedSearchMock, [])), + createTopNavWithCustomContext: jest + .fn() + .mockImplementation(createTopNav(unifiedSearchMock, [])), }, addSolutionNavigation: jest.fn(), isSolutionNavEnabled$: of(false), diff --git a/src/plugins/navigation/public/top_nav_menu/top_nav_menu.test.tsx b/src/plugins/navigation/public/top_nav_menu/top_nav_menu.test.tsx index dff09fa0bac38..5ad6e2bbe5dd4 100644 --- a/src/plugins/navigation/public/top_nav_menu/top_nav_menu.test.tsx +++ b/src/plugins/navigation/public/top_nav_menu/top_nav_menu.test.tsx @@ -14,16 +14,9 @@ import { MountPoint } from '@kbn/core/public'; import { TopNavMenu } from './top_nav_menu'; import { TopNavMenuData } from './top_nav_menu_data'; import { findTestSubject, mountWithIntl } from '@kbn/test-jest-helpers'; -import type { UnifiedSearchPublicPluginStart } from '@kbn/unified-search-plugin/public'; import { EuiToolTipProps } from '@elastic/eui'; import type { TopNavMenuBadgeProps } from './top_nav_menu_badges'; - -const unifiedSearch = { - ui: { - SearchBar: () =>
, - AggregateQuerySearchBar: () =>
, - }, -} as unknown as UnifiedSearchPublicPluginStart; +import { unifiedSearchMock } from '../mocks'; describe('TopNavMenu', () => { const WRAPPER_SELECTOR = '.kbnTopNavMenu__wrapper'; @@ -97,7 +90,7 @@ describe('TopNavMenu', () => { it('Should render search bar', () => { const component = mountWithIntl( - + ); expect(component.find(WRAPPER_SELECTOR).length).toBe(1); expect(component.find(TOP_NAV_ITEM_SELECTOR).length).toBe(0); @@ -110,7 +103,7 @@ describe('TopNavMenu', () => { appName={'test'} config={menuItems} showSearchBar={true} - unifiedSearch={unifiedSearch} + unifiedSearch={unifiedSearchMock} /> ); expect(component.find(WRAPPER_SELECTOR).length).toBe(1); @@ -124,7 +117,7 @@ describe('TopNavMenu', () => { appName={'test'} config={menuItems} showSearchBar={true} - unifiedSearch={unifiedSearch} + unifiedSearch={unifiedSearchMock} className={'myCoolClass'} /> ); @@ -172,7 +165,7 @@ describe('TopNavMenu', () => { appName={'test'} config={menuItems} showSearchBar={true} - unifiedSearch={unifiedSearch} + unifiedSearch={unifiedSearchMock} setMenuMountPoint={setMountPoint} /> ); @@ -195,7 +188,7 @@ describe('TopNavMenu', () => { appName={'test'} badges={badges} showSearchBar={true} - unifiedSearch={unifiedSearch} + unifiedSearch={unifiedSearchMock} setMenuMountPoint={setMountPoint} /> ); diff --git a/x-pack/plugins/lens/public/app_plugin/app.test.tsx b/x-pack/plugins/lens/public/app_plugin/app.test.tsx index 8d7e1b860ad9a..ee08d86061a3f 100644 --- a/x-pack/plugins/lens/public/app_plugin/app.test.tsx +++ b/x-pack/plugins/lens/public/app_plugin/app.test.tsx @@ -5,13 +5,11 @@ * 2.0. */ -import React, { PropsWithChildren } from 'react'; +import React from 'react'; import { Observable, Subject } from 'rxjs'; -import { ReactWrapper } from 'enzyme'; import { act } from 'react-dom/test-utils'; import { App } from './app'; import { LensAppProps, LensAppServices } from './types'; -import { EditorFrameInstance, EditorFrameProps } from '../types'; import { LensDocument, SavedObjectIndexStore } from '../persistence'; import { visualizationMap, @@ -20,9 +18,7 @@ import { renderWithReduxStore, mockStoreDeps, defaultDoc, - mountWithProvider, } from '../mocks'; -import { SavedObjectSaveModal } from '@kbn/saved-objects-plugin/public'; import { checkForDuplicateTitle } from '../persistence'; import { createMemoryHistory } from 'history'; import type { Query } from '@kbn/es-query'; @@ -30,55 +26,62 @@ import { FilterManager } from '@kbn/data-plugin/public'; import type { DataView } from '@kbn/data-views-plugin/public'; import { buildExistsFilter, FilterStateStore } from '@kbn/es-query'; import type { FieldSpec } from '@kbn/data-plugin/common'; -import { TopNavMenuData } from '@kbn/navigation-plugin/public'; -import { SavedObjectReference } from '@kbn/core/types'; import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public'; import { serverlessMock } from '@kbn/serverless/public/mocks'; +import { cloneDeep } from 'lodash'; import moment from 'moment'; import { setState, LensAppState } from '../state_management'; import { coreMock } from '@kbn/core/public/mocks'; import { LensSerializedState } from '..'; -import { cloneDeep } from 'lodash'; import { createMockedField, createMockedIndexPattern } from '../datasources/form_based/mocks'; -import { I18nProvider } from '@kbn/i18n-react'; import faker from 'faker'; -jest.mock('../editor_frame_service/editor_frame/expression_helpers'); -jest.mock('@kbn/core/public'); +import { screen, waitFor } from '@testing-library/react'; +import userEvent from '@testing-library/user-event'; +import { VisualizeEditorContext } from '../types'; +import { pluginServices as presentationUtilPluginServices } from '@kbn/presentation-util-plugin/public/services'; + +presentationUtilPluginServices.getHooks = jest.fn().mockReturnValue({ + capabilities: { + useService: () => ({ + canAccessDashboards: () => true, + canCreateNewDashboards: () => true, + canSaveVisualizations: () => true, + canSetAdvancedSettings: () => true, + }), + }, +}); + jest.mock('../persistence/saved_objects_utils/check_for_duplicate_title', () => ({ checkForDuplicateTitle: jest.fn(), })); +jest.mock('lodash', () => ({ + ...jest.requireActual('lodash'), + debounce: (fn: unknown) => fn, +})); -jest.mock('lodash', () => { - const original = jest.requireActual('lodash'); +const defaultSavedObjectId: string = faker.random.uuid(); - return { - ...original, - debounce: (fn: unknown) => fn, - }; -}); +const waitToLoad = async () => + await act(async () => new Promise((resolve) => setTimeout(resolve, 0))); -const sessionIdSubject = new Subject(); +function getLensDocumentMock(propsOverrides?: Partial) { + return cloneDeep({ ...defaultDoc, ...propsOverrides }); +} describe('Lens App', () => { - const defaultSavedObjectId: string = faker.random.uuid(); - - function createMockFrame(): jest.Mocked { - return { - EditorFrameContainer: jest.fn((props: EditorFrameProps) =>
), - datasourceMap, - visualizationMap, - }; - } - - const navMenuItems = { - expectedSaveButton: { emphasize: true, testId: 'lnsApp_saveButton' }, - expectedSaveAsButton: { emphasize: false, testId: 'lnsApp_saveButton' }, - expectedSaveAndReturnButton: { emphasize: true, testId: 'lnsApp_saveAndReturnButton' }, - }; - - function makeDefaultProps(): jest.Mocked { - return { - editorFrame: createMockFrame(), + let props: jest.Mocked; + let services: jest.Mocked = makeDefaultServices( + new Subject(), + 'sessionId-1' + ); + + beforeEach(() => { + props = { + editorFrame: { + EditorFrameContainer: jest.fn((_) =>
Editor frame
), + datasourceMap, + visualizationMap, + }, history: createMemoryHistory(), redirectTo: jest.fn(), redirectToOrigin: jest.fn(), @@ -95,118 +98,59 @@ describe('Lens App', () => { search: jest.fn(), } as unknown as SavedObjectIndexStore, }; - } - const makeDefaultServicesForApp = () => makeDefaultServices(sessionIdSubject, 'sessionId-1'); - - /** - * Here's the deal: moving everything to RTL is not just big, but very hard - * right now because many tests rely on unifiedSearch mocks and other plugins - * which are used indirectly to test things. Of course this won't work with RTL as it - * expect to test rendered things, and these mocks won't render anything. - * So some tests who will be able to move over to RTL will be updated, but others - * remains with the old enzyme way - */ - async function mountWithRTL({ - props = makeDefaultProps(), - services = makeDefaultServicesForApp(), - preloadedState, - }: { - props?: jest.Mocked; - services?: jest.Mocked; - preloadedState?: Partial; - }) { - const storeDeps = mockStoreDeps({ lensServices: services }); - const { store, ...instance } = renderWithReduxStore( - , - { - wrapper: ({ children }: { children: React.ReactNode }) => ( - {children} - ), - }, - { - storeDeps, - preloadedState, - } - ); + services = makeDefaultServices(new Subject(), 'sessionId-1'); + }); - const frame = props.editorFrame as ReturnType; - await act(async () => await store.dispatch(setState({ ...preloadedState }))); - return { instance, frame, props, services, lensStore: store }; - } + afterEach(() => { + jest.clearAllMocks(); + }); - async function mountWith({ - props = makeDefaultProps(), - services = makeDefaultServicesForApp(), + async function renderApp({ preloadedState, }: { - props?: jest.Mocked; - services?: jest.Mocked; preloadedState?: Partial; - }) { - const wrappingComponent: React.FC> = ({ children }) => { - return ( - - {children} - - ); - }; - const storeDeps = mockStoreDeps({ lensServices: services }); - const { instance, lensStore } = await mountWithProvider( + } = {}) { + const Wrapper = ({ children }: { children: React.ReactNode }) => ( + {children} + ); + + const { + store, + render: renderRtl, + rerender, + ...rest + } = renderWithReduxStore( , + { wrapper: Wrapper }, { - storeDeps, + storeDeps: mockStoreDeps({ lensServices: services }), preloadedState, - }, - { wrappingComponent } + } ); - const frame = props.editorFrame as ReturnType; - act(() => { - lensStore.dispatch(setState({ ...preloadedState })); - }); - return { instance, frame, props, services, lensStore }; - } + const rerenderWithProps = (newProps: Partial) => { + rerender(, { + wrapper: Wrapper, + }); + }; - function getLensDocumentMock(someProps?: Partial) { - return cloneDeep({ ...defaultDoc, ...someProps }); + await act(async () => await store.dispatch(setState({ ...preloadedState }))); + return { props, lensStore: store, rerender: rerenderWithProps, ...rest }; } it('renders the editor frame', async () => { - const { frame } = await mountWith({}); - expect(frame.EditorFrameContainer).toHaveBeenLastCalledWith( - { - indexPatternService: expect.any(Object), - getUserMessages: expect.any(Function), - addUserMessages: expect.any(Function), - lensInspector: { - getInspectorAdapters: expect.any(Function), - closeInspector: expect.any(Function), - inspect: expect.any(Function), - }, - showNoDataPopover: expect.any(Function), - }, - {} - ); + await renderApp(); + expect(screen.getByText('Editor frame')).toBeInTheDocument(); }); it('updates global filters with store state', async () => { - const services = makeDefaultServicesForApp(); const pinnedField = createMockedField({ name: 'pinnedField', type: '' }); - const indexPattern = createMockedIndexPattern( - { - id: 'index1', - }, - [pinnedField] - ); + const indexPattern = createMockedIndexPattern({ id: 'index1' }, [pinnedField]); const pinnedFilter = buildExistsFilter(pinnedField, indexPattern); - services.data.query.filterManager.getFilters = jest.fn().mockImplementation(() => { - return []; - }); - services.data.query.filterManager.getGlobalFilters = jest.fn().mockImplementation(() => { - return [pinnedFilter]; - }); - const { lensStore } = await mountWith({ services }); + services.data.query.filterManager.getFilters = jest.fn().mockReturnValue([]); + services.data.query.filterManager.getGlobalFilters = jest.fn().mockReturnValue([pinnedFilter]); + const { lensStore } = await renderApp(); expect(lensStore.getState()).toEqual({ lens: expect.objectContaining({ @@ -225,17 +169,13 @@ describe('Lens App', () => { describe('extra nav menu entries', () => { it('shows custom menu entry', async () => { const runFn = jest.fn(); - const { services } = await mountWithRTL({ - props: { - ...makeDefaultProps(), - topNavMenuEntryGenerators: [ - () => ({ - label: 'My entry', - run: runFn, - }), - ], - }, - }); + props.topNavMenuEntryGenerators = [ + () => ({ + label: 'My entry', + run: runFn, + }), + ]; + await renderApp(); expect(services.navigation.ui.AggregateQueryTopNavMenu).toHaveBeenCalledWith( expect.objectContaining({ config: expect.arrayContaining([{ label: 'My entry', run: runFn }]), @@ -272,15 +212,12 @@ describe('Lens App', () => { }, ], }; - await mountWithRTL({ - props: { - ...makeDefaultProps(), - topNavMenuEntryGenerators: [getterFn], - initialContext: { - fieldName: 'a', - dataViewSpec: { id: '1' }, - }, - }, + props.topNavMenuEntryGenerators = [getterFn]; + props.initialContext = { + fieldName: 'a', + dataViewSpec: { id: '1' }, + }; + await renderApp({ preloadedState, }); @@ -306,14 +243,14 @@ describe('Lens App', () => { }); describe('breadcrumbs', () => { - const breadcrumbDocSavedObjectId = defaultSavedObjectId; + const breadcrumbDocSavedObjectId = faker.random.uuid(); const breadcrumbDoc = getLensDocumentMock({ savedObjectId: breadcrumbDocSavedObjectId, title: 'Daaaaaaadaumching!', }); it('sets breadcrumbs when the document title changes', async () => { - const { services, lensStore } = await mountWithRTL({}); + const { lensStore } = await renderApp(); expect(services.chrome.setBreadcrumbs).toHaveBeenCalledWith([ { @@ -343,17 +280,10 @@ describe('Lens App', () => { }); it('sets originatingApp breadcrumb when the document title changes', async () => { - const props = makeDefaultProps(); - const services = makeDefaultServicesForApp(); - props.incomingState = { originatingApp: 'coolContainer' }; + props.incomingState = { originatingApp: 'dashboards' }; services.getOriginatingAppName = jest.fn(() => 'The Coolest Container Ever Made'); - - const { instance, lensStore } = await mountWith({ - props, - services, - preloadedState: { - isLinkedToOriginatingApp: false, - }, + const { lensStore, rerender } = await renderApp({ + preloadedState: { isLinkedToOriginatingApp: false }, }); expect(services.chrome.setBreadcrumbs).toHaveBeenCalledWith([ @@ -366,12 +296,7 @@ describe('Lens App', () => { ]); await act(async () => { - instance.setProps({ - initialInput: { savedObjectId: breadcrumbDocSavedObjectId }, - preloadedState: { - isLinkedToOriginatingApp: true, - }, - }); + await rerender({ initialInput: { savedObjectId: breadcrumbDocSavedObjectId } }); lensStore.dispatch( setState({ @@ -392,17 +317,13 @@ describe('Lens App', () => { it('sets serverless breadcrumbs when the document title changes when serverless service is available', async () => { const serverless = serverlessMock.createStart(); - const { instance, services, lensStore } = await mountWith({ - services: { - ...makeDefaultServices(), - serverless, - }, - }); + services.serverless = serverless; + const { lensStore, rerender } = await renderApp(); expect(services.chrome.setBreadcrumbs).not.toHaveBeenCalled(); expect(serverless.setBreadcrumbs).toHaveBeenCalledWith({ text: 'Create' }); await act(async () => { - instance.setProps({ initialInput: { savedObjectId: breadcrumbDocSavedObjectId } }); + rerender({ initialInput: { savedObjectId: breadcrumbDocSavedObjectId } }); lensStore.dispatch( setState({ persistedDoc: breadcrumbDoc, @@ -417,43 +338,40 @@ describe('Lens App', () => { describe('TopNavMenu#showDatePicker', () => { it('shows date picker if any used index pattern isTimeBased', async () => { - const customServices = makeDefaultServicesForApp(); - customServices.dataViews.get = jest + services.dataViews.get = jest .fn() - .mockImplementation((id) => - Promise.resolve({ id, isTimeBased: () => true, isPersisted: () => true } as DataView) + .mockImplementation( + async (id) => ({ id, isTimeBased: () => true, isPersisted: () => true } as DataView) ); - const { services } = await mountWithRTL({ services: customServices }); + await renderApp(); expect(services.navigation.ui.AggregateQueryTopNavMenu).toHaveBeenCalledWith( expect.objectContaining({ showDatePicker: true }), {} ); }); it('shows date picker if active datasource isTimeBased', async () => { - const customServices = makeDefaultServicesForApp(); - customServices.dataViews.get = jest + services.dataViews.get = jest .fn() - .mockImplementation((id) => - Promise.resolve({ id, isTimeBased: () => true, isPersisted: () => true } as DataView) + .mockImplementation( + async (id) => ({ id, isTimeBased: () => true, isPersisted: () => true } as DataView) ); - const customProps = makeDefaultProps(); - customProps.datasourceMap.testDatasource.isTimeBased = () => true; - const { services } = await mountWithRTL({ props: customProps, services: customServices }); + + props.datasourceMap.testDatasource.isTimeBased = () => true; + await renderApp(); expect(services.navigation.ui.AggregateQueryTopNavMenu).toHaveBeenCalledWith( expect.objectContaining({ showDatePicker: true }), {} ); }); it('does not show date picker if index pattern nor active datasource is not time based', async () => { - const customServices = makeDefaultServicesForApp(); - customServices.dataViews.get = jest + services.dataViews.get = jest .fn() - .mockImplementation((id) => - Promise.resolve({ id, isTimeBased: () => true, isPersisted: () => true } as DataView) + .mockImplementation( + async (id) => ({ id, isTimeBased: () => true, isPersisted: () => true } as DataView) ); - const customProps = makeDefaultProps(); - customProps.datasourceMap.testDatasource.isTimeBased = () => false; - const { services } = await mountWithRTL({ props: customProps, services: customServices }); + + props.datasourceMap.testDatasource.isTimeBased = () => false; + await renderApp(); expect(services.navigation.ui.AggregateQueryTopNavMenu).toHaveBeenCalledWith( expect.objectContaining({ showDatePicker: false }), {} @@ -463,7 +381,7 @@ describe('Lens App', () => { describe('TopNavMenu#dataViewPickerProps', () => { it('calls the nav component with the correct dataview picker props if permissions are given', async () => { - const { instance, lensStore, services } = await mountWith({ preloadedState: {} }); + const { lensStore } = await renderApp(); services.dataViewEditor.userPermissions.editDataView = () => true; const document = { savedObjectId: defaultSavedObjectId, @@ -474,6 +392,7 @@ describe('Lens App', () => { references: [{ type: 'index-pattern', id: '1', name: 'index-pattern-0' }], } as unknown as LensDocument; + (services.navigation.ui.AggregateQueryTopNavMenu as jest.Mock).mockClear(); act(() => { lensStore.dispatch( setState({ @@ -482,24 +401,23 @@ describe('Lens App', () => { }) ); }); - instance.update(); - const props = instance - .find('[data-test-subj="lnsApp_topNav"]') - .prop('dataViewPickerComponentProps') as TopNavMenuData[]; - expect(props).toEqual( + expect(services.navigation.ui.AggregateQueryTopNavMenu).toHaveBeenCalledWith( expect.objectContaining({ - currentDataViewId: 'mockip', - onChangeDataView: expect.any(Function), - onDataViewCreated: expect.any(Function), - onAddField: expect.any(Function), - }) + dataViewPickerComponentProps: expect.objectContaining({ + currentDataViewId: 'mockip', + onChangeDataView: expect.any(Function), + onDataViewCreated: expect.any(Function), + onAddField: expect.any(Function), + }), + }), + {} ); }); }); describe('persistence', () => { it('passes query and indexPatterns to TopNavMenu', async () => { - const { instance, lensStore, services } = await mountWith({ preloadedState: {} }); + const { lensStore } = await renderApp(); const query = { query: 'fake query', language: 'kuery' }; const document = getLensDocumentMock({ savedObjectId: defaultSavedObjectId, @@ -511,15 +429,12 @@ describe('Lens App', () => { references: [{ type: 'index-pattern', id: '1', name: 'index-pattern-0' }], }); - await act(async () => { - await lensStore.dispatch( - setState({ - query, - persistedDoc: document, - }) - ); - }); - instance.update(); + await lensStore.dispatch( + setState({ + query, + persistedDoc: document, + }) + ); expect(services.navigation.ui.AggregateQueryTopNavMenu).toHaveBeenCalledWith( expect.objectContaining({ @@ -538,12 +453,10 @@ describe('Lens App', () => { ); }); it('handles rejected index pattern', async () => { - const customServices = makeDefaultServicesForApp(); - customServices.dataViews.get = jest + services.dataViews.get = jest .fn() - .mockImplementation((id) => Promise.reject({ reason: 'Could not locate that data view' })); - const customProps = makeDefaultProps(); - const { services } = await mountWith({ props: customProps, services: customServices }); + .mockResolvedValue(Promise.reject({ reason: 'Could not locate that data view' })); + await renderApp(); expect(services.navigation.ui.AggregateQueryTopNavMenu).toHaveBeenCalledWith( expect.objectContaining({ indexPatterns: [] }), {} @@ -551,57 +464,38 @@ describe('Lens App', () => { }); describe('save buttons', () => { - interface SaveProps { - newCopyOnSave: boolean; - returnToOrigin?: boolean; - newTitle: string; - } + const querySaveButton = () => screen.queryByTestId('lnsApp_saveButton'); + const clickSaveButton = async () => + await act(async () => await userEvent.click(screen.getByTestId('lnsApp_saveButton'))); - function getButton(inst: ReactWrapper): TopNavMenuData { - return ( - inst.find('[data-test-subj="lnsApp_topNav"]').prop('config') as TopNavMenuData[] - ).find((button) => button.testId === 'lnsApp_saveButton')!; - } - - async function testSave(inst: ReactWrapper, saveProps: SaveProps) { - getButton(inst).run(inst.getDOMNode()); - // wait a tick since SaveModalContainer initializes asynchronously - await new Promise(process.nextTick); - const handler = inst.update().find('SavedObjectSaveModalOrigin').prop('onSave') as ( - p: unknown - ) => void; - handler(saveProps); - } + const querySaveAndReturnButton = () => screen.queryByTestId('lnsApp_saveAndReturnButton'); + const waitForModalVisible = async () => + await waitFor(() => screen.getByTestId('savedObjectTitle')); async function save({ preloadedState, - initialSavedObjectId, - ...saveProps - }: SaveProps & { + savedObjectId = defaultSavedObjectId, + prevSavedObjectId = undefined, + newTitle = 'hello there', + newCopyOnSave = false, + comesFromDashboard = true, + switchToAddToDashboardNone = false, + }: { + newCopyOnSave?: boolean; + newTitle?: string; preloadedState?: Partial; - initialSavedObjectId?: string; + prevSavedObjectId?: string; + savedObjectId?: string; + comesFromDashboard?: boolean; + switchToAddToDashboardNone?: boolean; }) { - const props = { - ...makeDefaultProps(), - initialInput: initialSavedObjectId - ? { savedObjectId: initialSavedObjectId, id: '5678' } - : undefined, - }; - - props.incomingState = { - originatingApp: 'ultraDashboard', - }; - - const services = makeDefaultServicesForApp(); - services.attributeService.saveToLibrary = jest - .fn() - .mockImplementation(async ({ savedObjectId }) => savedObjectId || defaultSavedObjectId); + services.attributeService.saveToLibrary = jest.fn().mockResolvedValue(savedObjectId); services.attributeService.loadFromLibrary = jest.fn().mockResolvedValue({ sharingSavedObjectProps: { outcome: 'exactMatch', }, attributes: { - savedObjectId: initialSavedObjectId ?? defaultSavedObjectId, + savedObjectId, references: [], state: { query: { query: 'fake query', language: 'kuery' }, @@ -611,147 +505,128 @@ describe('Lens App', () => { managed: false, }); - const { frame, instance, lensStore } = await mountWith({ - services, - props, + props = { + ...props, + initialInput: prevSavedObjectId ? { savedObjectId: prevSavedObjectId } : undefined, + }; + + if (comesFromDashboard) { + props.incomingState = { originatingApp: 'dashboards' }; + } + + const { lensStore } = await renderApp({ preloadedState: { isSaveable: true, - isLinkedToOriginatingApp: true, + isLinkedToOriginatingApp: comesFromDashboard, ...preloadedState, }, }); - expect(getButton(instance).disableButton).toEqual(false); - await act(async () => { - await testSave(instance, { ...saveProps }); + await clickSaveButton(); + await waitForModalVisible(); + if (newCopyOnSave) { + await userEvent.click(screen.getByTestId('saveAsNewCheckbox')); + } + if (switchToAddToDashboardNone) { + await userEvent.click(screen.getByLabelText('None')); + } + await waitFor(async () => { + await userEvent.clear(screen.getByTestId('savedObjectTitle')); + expect(screen.getByTestId('savedObjectTitle')).toHaveValue(''); }); - return { props, services, instance, frame, lensStore }; + await userEvent.type(screen.getByTestId('savedObjectTitle'), `${newTitle}`); + await userEvent.click(screen.getByTestId('confirmSaveSavedObjectButton')); + await waitToLoad(); + return { props, lensStore }; } it('shows a disabled save button when the user does not have permissions', async () => { - const services = makeDefaultServicesForApp(); - services.application = { - ...services.application, - capabilities: { - ...services.application.capabilities, - visualize: { save: false, saveQuery: false, show: true }, + services.application.capabilities = { + ...services.application.capabilities, + visualize: { save: false, saveQuery: false, show: true }, + dashboard: { + showWriteControls: false, }, }; - const { instance, lensStore } = await mountWith({ services }); - expect(getButton(instance).disableButton).toEqual(true); - await act(async () => { - await lensStore.dispatch( - setState({ - isSaveable: true, - }) - ); - }); - instance.update(); - expect(getButton(instance).disableButton).toEqual(true); + await renderApp({ preloadedState: { isSaveable: true } }); + expect(querySaveButton()).toBeDisabled(); }); it('shows a save button that is enabled when the frame has provided its state and does not show save and return or save as', async () => { - const { instance, lensStore, services } = await mountWith({}); - expect(getButton(instance).disableButton).toEqual(true); - act(() => { - lensStore.dispatch( - setState({ - isSaveable: true, - }) - ); + await renderApp({ + preloadedState: { isSaveable: true }, }); - instance.update(); - expect(getButton(instance).disableButton).toEqual(false); - await act(async () => { - const topNavMenuConfig = instance - .find(services.navigation.ui.AggregateQueryTopNavMenu) - .prop('config'); - expect(topNavMenuConfig).not.toContainEqual( - expect.objectContaining(navMenuItems.expectedSaveAndReturnButton) - ); - expect(topNavMenuConfig).not.toContainEqual( - expect.objectContaining(navMenuItems.expectedSaveAsButton) - ); - expect(topNavMenuConfig).toContainEqual( - expect.objectContaining(navMenuItems.expectedSaveButton) - ); - }); + expect(querySaveButton()).toHaveTextContent('Save'); + expect(querySaveAndReturnButton()).toBeFalsy(); }); - it('Shows Save and Return and Save As buttons in create by value mode with originating app', async () => { - const props = makeDefaultProps(); - const services = makeDefaultServicesForApp(); + it('Shows Save and Return and Save to library buttons in create by value mode with originating app', async () => { props.incomingState = { - originatingApp: 'ultraDashboard', + originatingApp: 'dashboards', valueInput: { id: 'whatchaGonnaDoWith', attributes: { title: 'whatcha gonna do with all these references? All these references in your value Input', - references: [] as SavedObjectReference[], + references: [], }, } as unknown as LensSerializedState, }; - - const { instance } = await mountWith({ - props, - services, + await renderApp({ preloadedState: { isLinkedToOriginatingApp: true, + isSaveable: true, }, }); - await act(async () => { - const topNavMenuConfig = instance - .find(services.navigation.ui.AggregateQueryTopNavMenu) - .prop('config'); - expect(topNavMenuConfig).toContainEqual( - expect.objectContaining(navMenuItems.expectedSaveAndReturnButton) - ); - expect(topNavMenuConfig).toContainEqual( - expect.objectContaining(navMenuItems.expectedSaveAsButton) - ); - expect(topNavMenuConfig).not.toContainEqual( - expect.objectContaining(navMenuItems.expectedSaveButton) - ); - }); + expect(querySaveAndReturnButton()).toBeEnabled(); + expect(querySaveButton()).toHaveTextContent('Save to library'); }); it('Shows Save and Return and Save As buttons in edit by reference mode', async () => { - const props = makeDefaultProps(); - props.initialInput = { savedObjectId: defaultSavedObjectId, id: '5678' }; props.incomingState = { - originatingApp: 'ultraDashboard', + originatingApp: 'dashboards', }; - - const { instance, services } = await mountWith({ - props, + props.initialInput = { savedObjectId: defaultSavedObjectId, id: '5678' }; + await renderApp({ preloadedState: { + isSaveable: true, isLinkedToOriginatingApp: true, }, }); - await act(async () => { - const topNavMenuConfig = instance - .find(services.navigation.ui.AggregateQueryTopNavMenu) - .prop('config'); - expect(topNavMenuConfig).toContainEqual( - expect.objectContaining(navMenuItems.expectedSaveAndReturnButton) - ); - expect(topNavMenuConfig).toContainEqual( - expect.objectContaining(navMenuItems.expectedSaveAsButton) - ); - expect(topNavMenuConfig).not.toContainEqual( - expect.objectContaining(navMenuItems.expectedSaveButton) - ); + expect(querySaveAndReturnButton()).toBeEnabled(); + expect(querySaveButton()).toHaveTextContent('Save as'); + }); + + it('applies all changes on-save', async () => { + const { lensStore } = await save({ + savedObjectId: undefined, + newCopyOnSave: false, + newTitle: 'hello there', + preloadedState: { + applyChangesCounter: 0, + }, }); + expect(lensStore.getState().lens.applyChangesCounter).toBe(1); + }); + it('adds to the recently accessed list on save', async () => { + const savedObjectId = faker.random.uuid(); + await save({ savedObjectId, prevSavedObjectId: 'prevId', comesFromDashboard: false }); + expect(services.chrome.recentlyAccessed.add).toHaveBeenCalledWith( + `/app/lens#/edit/${savedObjectId}`, + 'hello there', + savedObjectId + ); }); it('saves new docs', async () => { - const { props, services } = await save({ - initialSavedObjectId: undefined, - newCopyOnSave: false, + await save({ + prevSavedObjectId: undefined, + savedObjectId: defaultSavedObjectId, newTitle: 'hello there', + comesFromDashboard: false, + switchToAddToDashboardNone: true, }); expect(services.attributeService.saveToLibrary).toHaveBeenCalledWith( expect.objectContaining({ @@ -773,38 +648,15 @@ describe('Lens App', () => { ); }); - it('applies all changes on-save', async () => { - const { lensStore } = await save({ - initialSavedObjectId: undefined, - newCopyOnSave: false, - newTitle: 'hello there', - preloadedState: { - applyChangesCounter: 0, - }, - }); - expect(lensStore.getState().lens.applyChangesCounter).toBe(1); - }); - - it('adds to the recently accessed list on save', async () => { - const { services } = await save({ - initialSavedObjectId: undefined, - newCopyOnSave: false, - newTitle: 'hello there', - }); - expect(services.chrome.recentlyAccessed.add).toHaveBeenCalledWith( - `/app/lens#/edit/${defaultSavedObjectId}`, - 'hello there', - defaultSavedObjectId - ); - }); - - it('saves the latest doc as a copy', async () => { + it('saves existing docs as a copy', async () => { const doc = getLensDocumentMock(); - const { props, services, instance } = await save({ - initialSavedObjectId: doc.savedObjectId, + await save({ + savedObjectId: doc.savedObjectId, newCopyOnSave: true, newTitle: 'hello there', preloadedState: { persistedDoc: doc }, + prevSavedObjectId: 'prevId', + comesFromDashboard: false, }); expect(services.attributeService.saveToLibrary).toHaveBeenCalledWith( expect.objectContaining({ @@ -814,10 +666,7 @@ describe('Lens App', () => { undefined ); // new copy gets a new SO id - expect(props.redirectTo).toHaveBeenCalledWith(defaultSavedObjectId); - await act(async () => { - instance.setProps({ initialInput: { savedObjectId: defaultSavedObjectId } }); - }); + expect(props.redirectTo).toHaveBeenCalledWith(doc.savedObjectId); expect(services.attributeService.saveToLibrary).toHaveBeenCalledTimes(1); expect(services.notifications.toasts.addSuccess).toHaveBeenCalledWith( "Saved 'hello there'" @@ -825,10 +674,12 @@ describe('Lens App', () => { }); it('saves existing docs', async () => { - const { props, services, instance } = await save({ - initialSavedObjectId: defaultSavedObjectId, + await save({ + savedObjectId: defaultSavedObjectId, + prevSavedObjectId: defaultSavedObjectId, newCopyOnSave: false, newTitle: 'hello there', + comesFromDashboard: false, preloadedState: { persistedDoc: getLensDocumentMock({ savedObjectId: defaultSavedObjectId }), }, @@ -841,298 +692,241 @@ describe('Lens App', () => { defaultSavedObjectId ); expect(props.redirectTo).not.toHaveBeenCalled(); - await act(async () => { - instance.setProps({ initialInput: { savedObjectId: defaultSavedObjectId } }); - }); expect(services.notifications.toasts.addSuccess).toHaveBeenCalledWith( "Saved 'hello there'" ); }); - it('handles save failure by showing a warning, but still allows another save', async () => { - const mockedConsoleDir = jest.spyOn(console, 'dir'); // mocked console.dir to avoid messages in the console when running tests - mockedConsoleDir.mockImplementation(() => {}); - - const props = makeDefaultProps(); - - props.incomingState = { - originatingApp: 'ultraDashboard', - }; + it('saves app filters and does not save pinned filters', async () => { + const indexPattern = { id: 'index1', isPersisted: () => true } as unknown as DataView; + const field = { name: 'myfield' } as unknown as FieldSpec; + const pinnedField = { name: 'pinnedField' } as unknown as FieldSpec; + const unpinned = buildExistsFilter(field, indexPattern); + const pinned = buildExistsFilter(pinnedField, indexPattern); + await act(async () => { + FilterManager.setFiltersStore([pinned], FilterStateStore.GLOBAL_STATE); + }); - const services = makeDefaultServicesForApp(); - services.attributeService.saveToLibrary = jest - .fn() - .mockRejectedValue({ message: 'failed' }); - const { instance } = await mountWith({ - props, - services, + await save({ + savedObjectId: defaultSavedObjectId, + prevSavedObjectId: defaultSavedObjectId, preloadedState: { isSaveable: true, + persistedDoc: getLensDocumentMock({ savedObjectId: defaultSavedObjectId }), isLinkedToOriginatingApp: true, + filters: [pinned, unpinned], }, }); - await act(async () => { - testSave(instance, { newCopyOnSave: false, newTitle: 'hello there' }); - }); - expect(props.redirectTo).not.toHaveBeenCalled(); - expect(getButton(instance).disableButton).toEqual(false); - // eslint-disable-next-line no-console - expect(console.dir).toHaveBeenCalledTimes(1); - mockedConsoleDir.mockRestore(); - }); + const { state: expectedFilters } = services.data.query.filterManager.extract([unpinned]); - it('saves new doc and redirects to originating app', async () => { - const { props, services } = await save({ - initialSavedObjectId: undefined, - returnToOrigin: true, - newCopyOnSave: false, - newTitle: 'hello there', - }); expect(services.attributeService.saveToLibrary).toHaveBeenCalledWith( expect.objectContaining({ title: 'hello there', + state: expect.objectContaining({ filters: expectedFilters }), }), [{ id: 'mockip', name: 'mockip', type: 'index-pattern' }], undefined ); - expect(props.redirectToOrigin).toHaveBeenCalledWith({ - state: expect.objectContaining({ savedObjectId: defaultSavedObjectId }), - isCopied: false, - }); }); - it('saves app filters and does not save pinned filters', async () => { - const indexPattern = { id: 'index1', isPersisted: () => true } as unknown as DataView; - const field = { name: 'myfield' } as unknown as FieldSpec; - const pinnedField = { name: 'pinnedField' } as unknown as FieldSpec; - const unpinned = buildExistsFilter(field, indexPattern); - const pinned = buildExistsFilter(pinnedField, indexPattern); - await act(async () => { - FilterManager.setFiltersStore([pinned], FilterStateStore.GLOBAL_STATE); - }); - const { services } = await save({ - initialSavedObjectId: defaultSavedObjectId, - newCopyOnSave: false, - newTitle: 'hello there2', + it('checks for duplicate title before saving', async () => { + await save({ + savedObjectId: defaultSavedObjectId, + prevSavedObjectId: defaultSavedObjectId, preloadedState: { - persistedDoc: getLensDocumentMock({ savedObjectId: defaultSavedObjectId }), - filters: [pinned, unpinned], + isSaveable: true, + persistedDoc: { savedObjectId: defaultSavedObjectId } as unknown as LensDocument, + isLinkedToOriginatingApp: true, }, }); - const { state: expectedFilters } = services.data.query.filterManager.extract([unpinned]); + expect(checkForDuplicateTitle).toHaveBeenCalledWith( + { + copyOnSave: true, + displayName: 'Lens visualization', + isTitleDuplicateConfirmed: false, + lastSavedTitle: '', + title: 'hello there', + }, + expect.any(Function), + expect.anything() + ); + }); + it('saves new doc and redirects to originating app', async () => { + await save({ + savedObjectId: undefined, + newCopyOnSave: false, + newTitle: 'hello there', + }); expect(services.attributeService.saveToLibrary).toHaveBeenCalledWith( expect.objectContaining({ - title: 'hello there2', - state: expect.objectContaining({ filters: expectedFilters }), + title: 'hello there', }), [{ id: 'mockip', name: 'mockip', type: 'index-pattern' }], - defaultSavedObjectId + undefined ); + expect(props.redirectToOrigin).toHaveBeenCalledWith({ + state: expect.objectContaining({ savedObjectId: defaultSavedObjectId }), + isCopied: false, + }); }); - it('checks for duplicate title before saving', async () => { - const props = makeDefaultProps(); - props.incomingState = { originatingApp: 'coolContainer' }; - const services = makeDefaultServicesForApp(); + it('handles save failure by showing a warning, but still allows another save', async () => { + const mockedConsoleDir = jest.spyOn(console, 'dir').mockImplementation(() => {}); // mocked console.dir to avoid messages in the console when running tests + services.attributeService.saveToLibrary = jest .fn() - .mockReturnValue(Promise.resolve({ savedObjectId: '123' })); - const { instance } = await mountWith({ - props, - services, + .mockRejectedValue({ message: 'failed' }); + + props.incomingState = { + originatingApp: 'dashboards', + }; + + await renderApp({ preloadedState: { isSaveable: true, - persistedDoc: { savedObjectId: '123' } as unknown as LensDocument, isLinkedToOriginatingApp: true, }, }); - await act(async () => { - instance.setProps({ initialInput: { savedObjectId: '123' } }); - getButton(instance).run(instance.getDOMNode()); - }); - instance.update(); - const onTitleDuplicate = jest.fn(); - await act(async () => { - instance.find(SavedObjectSaveModal).prop('onSave')({ - onTitleDuplicate, - isTitleDuplicateConfirmed: false, - newCopyOnSave: false, - newDescription: '', - newTitle: 'test', - }); - }); - expect(checkForDuplicateTitle).toHaveBeenCalledWith( - expect.objectContaining({ id: '123', isTitleDuplicateConfirmed: false }), - onTitleDuplicate, - expect.anything() - ); + await clickSaveButton(); + await userEvent.type(screen.getByTestId('savedObjectTitle'), 'hello there'); + await userEvent.click(screen.getByTestId('confirmSaveSavedObjectButton')); + await waitToLoad(); + + expect(props.redirectTo).not.toHaveBeenCalled(); + expect(services.attributeService.saveToLibrary).toHaveBeenCalled(); + // eslint-disable-next-line no-console + expect(console.dir).toHaveBeenCalledTimes(1); + mockedConsoleDir.mockRestore(); }); it('does not show the copy button on first save', async () => { - const props = makeDefaultProps(); - props.incomingState = { originatingApp: 'coolContainer' }; - const { instance } = await mountWith({ - props, + props.incomingState = { + originatingApp: 'dashboards', + }; + + await renderApp({ preloadedState: { isSaveable: true, isLinkedToOriginatingApp: true }, }); - await act(async () => getButton(instance).run(instance.getDOMNode())); - instance.update(); - expect(instance.find(SavedObjectSaveModal).prop('showCopyOnSave')).toEqual(false); + await clickSaveButton(); + await waitForModalVisible(); + expect(screen.queryByTestId('saveAsNewCheckbox')).not.toBeInTheDocument(); }); it('enables Save Query UI when user has app-level permissions', async () => { - const services = makeDefaultServicesForApp(); - services.application = { - ...services.application, - capabilities: { - ...services.application.capabilities, - visualize: { saveQuery: true }, - }, + services.application.capabilities = { + ...services.application.capabilities, + visualize: { saveQuery: true }, }; - const { instance } = await mountWith({ services }); - await act(async () => { - const topNavMenu = instance.find(services.navigation.ui.AggregateQueryTopNavMenu); - expect(topNavMenu.props().saveQueryMenuVisibility).toBe('allowed_by_app_privilege'); - }); + + await renderApp(); + expect(services.navigation.ui.AggregateQueryTopNavMenu).toHaveBeenLastCalledWith( + expect.objectContaining({ saveQueryMenuVisibility: 'allowed_by_app_privilege' }), + {} + ); }); it('checks global save query permission when user does not have app-level permissions', async () => { - const services = makeDefaultServicesForApp(); - services.application = { - ...services.application, - capabilities: { - ...services.application.capabilities, - visualize: { saveQuery: false }, - }, + services.application.capabilities = { + ...services.application.capabilities, + visualize: { saveQuery: false }, }; - const { instance } = await mountWith({ services }); - await act(async () => { - const topNavMenu = instance.find(services.navigation.ui.AggregateQueryTopNavMenu); - expect(topNavMenu.props().saveQueryMenuVisibility).toBe('globally_managed'); - }); + await renderApp(); + expect(services.navigation.ui.AggregateQueryTopNavMenu).toHaveBeenLastCalledWith( + expect.objectContaining({ saveQueryMenuVisibility: 'globally_managed' }), + {} + ); }); }); }); describe('share button', () => { - function getShareButton(inst: ReactWrapper): TopNavMenuData { - return ( - inst.find('[data-test-subj="lnsApp_topNav"]').prop('config') as TopNavMenuData[] - ).find((button) => button.testId === 'lnsApp_shareButton')!; - } + const getShareButton = () => screen.getByTestId('lnsApp_shareButton'); it('should be disabled when no data is available', async () => { - const { instance } = await mountWith({ preloadedState: { isSaveable: true } }); - expect(getShareButton(instance).disableButton).toEqual(true); + await renderApp({ preloadedState: { isSaveable: true } }); + expect(getShareButton()).toBeDisabled(); }); it('should not disable share when not saveable', async () => { - const { instance } = await mountWith({ + await renderApp({ preloadedState: { isSaveable: false, activeData: { layer1: { type: 'datatable', columns: [], rows: [] } }, }, }); - expect(getShareButton(instance).disableButton).toEqual(false); + expect(getShareButton()).toBeEnabled(); }); it('should still be enabled even if the user is missing save permissions', async () => { - const services = makeDefaultServicesForApp(); - services.application = { - ...services.application, - capabilities: { - ...services.application.capabilities, - visualize: { save: false, saveQuery: false, show: true, createShortUrl: true }, - }, + services.application.capabilities = { + ...services.application.capabilities, + visualize: { save: false, saveQuery: false, show: true, createShortUrl: true }, }; - const { instance } = await mountWith({ - services, + await renderApp({ preloadedState: { isSaveable: true, activeData: { layer1: { type: 'datatable', columns: [], rows: [] } }, }, }); - expect(getShareButton(instance).disableButton).toEqual(false); + expect(getShareButton()).toBeEnabled(); }); it('should still be enabled even if the user is missing shortUrl permissions', async () => { - const services = makeDefaultServicesForApp(); - services.application = { - ...services.application, - capabilities: { - ...services.application.capabilities, - visualize: { save: true, saveQuery: false, show: true, createShortUrl: false }, - }, + services.application.capabilities = { + ...services.application.capabilities, + visualize: { save: true, saveQuery: false, show: true, createShortUrl: false }, }; - const { instance } = await mountWith({ - services, + await renderApp({ preloadedState: { isSaveable: true, activeData: { layer1: { type: 'datatable', columns: [], rows: [] } }, }, }); - expect(getShareButton(instance).disableButton).toEqual(false); + + expect(getShareButton()).toBeEnabled(); }); it('should be disabled if the user is missing shortUrl permissions and visualization is not saveable', async () => { - const services = makeDefaultServicesForApp(); - services.application = { - ...services.application, - capabilities: { - ...services.application.capabilities, - visualize: { save: false, saveQuery: false, show: true, createShortUrl: false }, - }, + services.application.capabilities = { + ...services.application.capabilities, + visualize: { save: false, saveQuery: false, show: true, createShortUrl: false }, }; - const { instance } = await mountWith({ - services, + await renderApp({ preloadedState: { isSaveable: false, activeData: { layer1: { type: 'datatable', columns: [], rows: [] } }, }, }); - expect(getShareButton(instance).disableButton).toEqual(true); + expect(getShareButton()).toBeDisabled(); }); }); describe('inspector', () => { - function getButton(inst: ReactWrapper): TopNavMenuData { - return ( - inst.find('[data-test-subj="lnsApp_topNav"]').prop('config') as TopNavMenuData[] - ).find((button) => button.testId === 'lnsApp_inspectButton')!; - } - - async function runInspect(inst: ReactWrapper) { - await getButton(inst).run(inst.getDOMNode()); - await inst.update(); - } - it('inspector button should be available', async () => { - const { instance } = await mountWith({ preloadedState: { isSaveable: true } }); - const button = getButton(instance); - - expect(button.disableButton).toEqual(false); + await renderApp({ + preloadedState: { isSaveable: true }, + }); + expect(screen.getByTestId('lnsApp_inspectButton')).toBeEnabled(); }); - it('should open inspect panel', async () => { - const services = makeDefaultServicesForApp(); - const { instance } = await mountWith({ services, preloadedState: { isSaveable: true } }); - - await runInspect(instance); - + await renderApp({ + preloadedState: { isSaveable: true }, + }); + await userEvent.click(screen.getByTestId('lnsApp_inspectButton')); expect(services.inspector.inspect).toHaveBeenCalledTimes(1); }); }); describe('query bar state management', () => { it('uses the default time and query language settings', async () => { - const { lensStore, services } = await mountWith({}); + const { lensStore } = await renderApp(); expect(services.navigation.ui.AggregateQueryTopNavMenu).toHaveBeenCalledWith( expect.objectContaining({ query: { query: '', language: 'lucene' }, @@ -1154,18 +948,20 @@ describe('Lens App', () => { }); it('updates the editor frame when the user changes query or time in the search bar', async () => { - const { instance, services, lensStore } = await mountWith({}); + const { lensStore } = await renderApp(); (services.data.query.timefilter.timefilter.calculateBounds as jest.Mock).mockReturnValue({ min: moment('2021-01-09T04:00:00.000Z'), max: moment('2021-01-09T08:00:00.000Z'), }); + const onQuerySubmit = (services.navigation.ui.AggregateQueryTopNavMenu as jest.Mock).mock + .calls[0][0].onQuerySubmit; await act(async () => - instance.find(services.navigation.ui.AggregateQueryTopNavMenu).prop('onQuerySubmit')!({ + onQuerySubmit({ dateRange: { from: 'now-14d', to: 'now-7d' }, query: { query: 'new', language: 'lucene' }, }) ); - instance.update(); + expect(services.navigation.ui.AggregateQueryTopNavMenu).toHaveBeenCalledWith( expect.objectContaining({ query: { query: 'new', language: 'lucene' }, @@ -1191,7 +987,7 @@ describe('Lens App', () => { }); it('updates the filters when the user changes them', async () => { - const { instance, services, lensStore } = await mountWith({}); + const { lensStore } = await renderApp(); const indexPattern = { id: 'index1', isPersisted: () => true } as unknown as DataView; const field = { name: 'myfield' } as unknown as FieldSpec; expect(lensStore.getState()).toEqual({ @@ -1199,10 +995,9 @@ describe('Lens App', () => { filters: [], }), }); - act(() => - services.data.query.filterManager.setFilters([buildExistsFilter(field, indexPattern)]) - ); - instance.update(); + + services.data.query.filterManager.setFilters([buildExistsFilter(field, indexPattern)]); + expect(lensStore.getState()).toEqual({ lens: expect.objectContaining({ filters: [buildExistsFilter(field, indexPattern)], @@ -1211,7 +1006,7 @@ describe('Lens App', () => { }); it('updates the searchSessionId when the user changes query or time in the search bar', async () => { - const { instance, services, lensStore } = await mountWith({}); + const { lensStore } = await renderApp(); expect(lensStore.getState()).toEqual({ lens: expect.objectContaining({ @@ -1219,13 +1014,14 @@ describe('Lens App', () => { }), }); + const AggregateQueryTopNavMenu = services.navigation.ui.AggregateQueryTopNavMenu as jest.Mock; + const onQuerySubmit = AggregateQueryTopNavMenu.mock.calls[0][0].onQuerySubmit; act(() => - instance.find(services.navigation.ui.AggregateQueryTopNavMenu).prop('onQuerySubmit')!({ + onQuerySubmit({ dateRange: { from: 'now-14d', to: 'now-7d' }, query: { query: '', language: 'lucene' }, }) ); - instance.update(); expect(lensStore.getState()).toEqual({ lens: expect.objectContaining({ @@ -1234,12 +1030,12 @@ describe('Lens App', () => { }); // trigger again, this time changing just the query act(() => - instance.find(services.navigation.ui.AggregateQueryTopNavMenu).prop('onQuerySubmit')!({ + onQuerySubmit({ dateRange: { from: 'now-14d', to: 'now-7d' }, query: { query: 'new', language: 'lucene' }, }) ); - instance.update(); + expect(lensStore.getState()).toEqual({ lens: expect.objectContaining({ searchSessionId: `sessionId-3`, @@ -1250,7 +1046,7 @@ describe('Lens App', () => { act(() => services.data.query.filterManager.setFilters([buildExistsFilter(field, indexPattern)]) ); - instance.update(); + expect(lensStore.getState()).toEqual({ lens: expect.objectContaining({ searchSessionId: `sessionId-4`, @@ -1261,15 +1057,11 @@ describe('Lens App', () => { describe('saved query handling', () => { it('does not allow saving when the user is missing the saveQuery permission', async () => { - const services = makeDefaultServicesForApp(); - services.application = { - ...services.application, - capabilities: { - ...services.application.capabilities, - visualize: { save: false, saveQuery: false, show: true }, - }, + services.application.capabilities = { + ...services.application.capabilities, + visualize: { save: false, saveQuery: false, show: true }, }; - await mountWith({ services }); + await renderApp(); expect(services.navigation.ui.AggregateQueryTopNavMenu).toHaveBeenCalledWith( expect.objectContaining({ saveQueryMenuVisibility: 'globally_managed' }), {} @@ -1277,7 +1069,8 @@ describe('Lens App', () => { }); it('persists the saved query ID when the query is saved', async () => { - const { instance, services } = await mountWith({}); + await renderApp(); + expect(services.navigation.ui.AggregateQueryTopNavMenu).toHaveBeenCalledWith( expect.objectContaining({ saveQueryMenuVisibility: 'allowed_by_app_privilege', @@ -1288,8 +1081,11 @@ describe('Lens App', () => { }), {} ); + + const onSaved = (services.navigation.ui.AggregateQueryTopNavMenu as jest.Mock).mock + .calls[0][0].onSaved; act(() => { - instance.find(services.navigation.ui.AggregateQueryTopNavMenu).prop('onSaved')!({ + onSaved({ id: '1', attributes: { title: '', @@ -1316,9 +1112,12 @@ describe('Lens App', () => { }); it('changes the saved query ID when the query is updated', async () => { - const { instance, services } = await mountWith({}); + await renderApp(); + const { onSaved, onSavedQueryUpdated } = ( + services.navigation.ui.AggregateQueryTopNavMenu as jest.Mock + ).mock.calls[0][0]; act(() => { - instance.find(services.navigation.ui.AggregateQueryTopNavMenu).prop('onSaved')!({ + onSaved({ id: '1', attributes: { title: '', @@ -1329,17 +1128,15 @@ describe('Lens App', () => { }); }); act(() => { - instance.find(services.navigation.ui.AggregateQueryTopNavMenu).prop('onSavedQueryUpdated')!( - { - id: '2', - attributes: { - title: 'new title', - description: '', - query: { query: '', language: 'lucene' }, - }, - namespaces: ['default'], - } - ); + onSavedQueryUpdated({ + id: '2', + attributes: { + title: 'new title', + description: '', + query: { query: '', language: 'lucene' }, + }, + namespaces: ['default'], + }); }); expect(services.navigation.ui.AggregateQueryTopNavMenu).toHaveBeenCalledWith( expect.objectContaining({ @@ -1358,19 +1155,19 @@ describe('Lens App', () => { }); it('updates the query if saved query is selected', async () => { - const { instance, services } = await mountWith({}); + await renderApp(); + const { onSavedQueryUpdated } = (services.navigation.ui.AggregateQueryTopNavMenu as jest.Mock) + .mock.calls[0][0]; act(() => { - instance.find(services.navigation.ui.AggregateQueryTopNavMenu).prop('onSavedQueryUpdated')!( - { - id: '2', - attributes: { - title: 'new title', - description: '', - query: { query: 'abc:def', language: 'lucene' }, - }, - namespaces: ['default'], - } - ); + onSavedQueryUpdated({ + id: '2', + attributes: { + title: 'new title', + description: '', + query: { query: 'abc:def', language: 'lucene' }, + }, + namespaces: ['default'], + }); }); expect(services.navigation.ui.AggregateQueryTopNavMenu).toHaveBeenCalledWith( expect.objectContaining({ @@ -1381,9 +1178,12 @@ describe('Lens App', () => { }); it('clears all existing unpinned filters when the active saved query is cleared', async () => { - const { instance, services, lensStore } = await mountWith({}); + const { lensStore } = await renderApp(); + const { onQuerySubmit, onClearSavedQuery } = ( + services.navigation.ui.AggregateQueryTopNavMenu as jest.Mock + ).mock.calls[0][0]; act(() => - instance.find(services.navigation.ui.AggregateQueryTopNavMenu).prop('onQuerySubmit')!({ + onQuerySubmit({ dateRange: { from: 'now-14d', to: 'now-7d' }, query: { query: 'new', language: 'lucene' }, }) @@ -1395,11 +1195,7 @@ describe('Lens App', () => { const pinned = buildExistsFilter(pinnedField, indexPattern); FilterManager.setFiltersStore([pinned], FilterStateStore.GLOBAL_STATE); act(() => services.data.query.filterManager.setFilters([pinned, unpinned])); - instance.update(); - act(() => - instance.find(services.navigation.ui.AggregateQueryTopNavMenu).prop('onClearSavedQuery')!() - ); - instance.update(); + act(() => onClearSavedQuery()); expect(lensStore.getState()).toEqual({ lens: expect.objectContaining({ filters: [pinned], @@ -1410,9 +1206,12 @@ describe('Lens App', () => { describe('search session id management', () => { it('updates the searchSessionId when the query is updated', async () => { - const { instance, lensStore, services } = await mountWith({}); + const { lensStore } = await renderApp(); + const { onSaved, onSavedQueryUpdated } = ( + services.navigation.ui.AggregateQueryTopNavMenu as jest.Mock + ).mock.calls[0][0]; act(() => { - instance.find(services.navigation.ui.AggregateQueryTopNavMenu).prop('onSaved')!({ + onSaved({ id: '1', attributes: { title: '', @@ -1423,19 +1222,16 @@ describe('Lens App', () => { }); }); act(() => { - instance.find(services.navigation.ui.AggregateQueryTopNavMenu).prop('onSavedQueryUpdated')!( - { - id: '2', - attributes: { - title: 'new title', - description: '', - query: { query: '', language: 'lucene' }, - }, - namespaces: ['default'], - } - ); + onSavedQueryUpdated({ + id: '2', + attributes: { + title: 'new title', + description: '', + query: { query: '', language: 'lucene' }, + }, + namespaces: ['default'], + }); }); - instance.update(); expect(lensStore.getState()).toEqual({ lens: expect.objectContaining({ searchSessionId: `sessionId-2`, @@ -1444,9 +1240,12 @@ describe('Lens App', () => { }); it('updates the searchSessionId when the active saved query is cleared', async () => { - const { instance, services, lensStore } = await mountWith({}); + const { lensStore } = await renderApp(); + const { onQuerySubmit, onClearSavedQuery } = ( + services.navigation.ui.AggregateQueryTopNavMenu as jest.Mock + ).mock.calls[0][0]; act(() => - instance.find(services.navigation.ui.AggregateQueryTopNavMenu).prop('onQuerySubmit')!({ + onQuerySubmit({ dateRange: { from: 'now-14d', to: 'now-7d' }, query: { query: 'new', language: 'lucene' }, }) @@ -1458,11 +1257,7 @@ describe('Lens App', () => { const pinned = buildExistsFilter(pinnedField, indexPattern); FilterManager.setFiltersStore([pinned], FilterStateStore.GLOBAL_STATE); act(() => services.data.query.filterManager.setFilters([pinned, unpinned])); - instance.update(); - act(() => - instance.find(services.navigation.ui.AggregateQueryTopNavMenu).prop('onClearSavedQuery')!() - ); - instance.update(); + act(() => onClearSavedQuery()); expect(lensStore.getState()).toEqual({ lens: expect.objectContaining({ searchSessionId: `sessionId-4`, @@ -1471,15 +1266,14 @@ describe('Lens App', () => { }); it('dispatches update to searchSessionId and dateRange when the user hits refresh', async () => { - const { instance, services, lensStore } = await mountWith({}); - + const { lensStore } = await renderApp(); + const { onQuerySubmit } = (services.navigation.ui.AggregateQueryTopNavMenu as jest.Mock).mock + .calls[0][0]; act(() => - instance.find(services.navigation.ui.AggregateQueryTopNavMenu).prop('onQuerySubmit')!({ + onQuerySubmit({ dateRange: { from: 'now-7d', to: 'now' }, }) ); - - instance.update(); expect(lensStore.dispatch).toHaveBeenCalledWith({ type: 'lens/setState', payload: { @@ -1494,15 +1288,12 @@ describe('Lens App', () => { it('updates the state if session id changes from the outside', async () => { const sessionIdS = new Subject(); - const services = makeDefaultServices(sessionIdS, 'sessionId-1'); - const { lensStore } = await mountWith({ props: undefined, services }); + services = makeDefaultServices(sessionIdS, 'sessionId-1'); + const { lensStore } = await renderApp(); - act(() => { - sessionIdS.next('new-session-id'); - }); - await act(async () => { - await new Promise((r) => setTimeout(r, 0)); - }); + act(() => sessionIdS.next('new-session-id')); + + await waitToLoad(); expect(lensStore.getState()).toEqual({ lens: expect.objectContaining({ searchSessionId: `new-session-id`, @@ -1511,7 +1302,7 @@ describe('Lens App', () => { }); it('does not update the searchSessionId when the state changes', async () => { - const { lensStore } = await mountWith({ preloadedState: { isSaveable: true } }); + const { lensStore } = await renderApp({ preloadedState: { isSaveable: true } }); expect(lensStore.getState()).toEqual({ lens: expect.objectContaining({ searchSessionId: `sessionId-1`, @@ -1521,40 +1312,37 @@ describe('Lens App', () => { }); describe('showing a confirm message when leaving', () => { - let defaultLeave: jest.Mock; - let confirmLeave: jest.Mock; + const defaultLeave = jest.fn(); + const confirmLeave = jest.fn(); beforeEach(() => { - defaultLeave = jest.fn(); - confirmLeave = jest.fn(); + jest.clearAllMocks(); }); it('should not show a confirm message if there is no expression to save', async () => { - const { props } = await mountWith({}); - const lastCall = props.onAppLeave.mock.lastCall![0]; + await renderApp(); + const lastCall = (props.onAppLeave as jest.Mock).mock.lastCall![0]; lastCall({ default: defaultLeave, confirm: confirmLeave }); expect(defaultLeave).toHaveBeenCalled(); expect(confirmLeave).not.toHaveBeenCalled(); }); it('does not confirm if the user is missing save permissions', async () => { - const services = makeDefaultServicesForApp(); - services.application = { - ...services.application, - capabilities: { - ...services.application.capabilities, - visualize: { save: false, saveQuery: false, show: true }, - }, + services.application.capabilities = { + ...services.application.capabilities, + visualize: { save: false, saveQuery: false, show: true }, }; - const { props } = await mountWith({ services, preloadedState: { isSaveable: true } }); - const lastCall = props.onAppLeave.mock.lastCall![0]; + await renderApp({ + preloadedState: { isSaveable: true }, + }); + const lastCall = (props.onAppLeave as jest.Mock).mock.lastCall![0]; lastCall({ default: defaultLeave, confirm: confirmLeave }); expect(defaultLeave).toHaveBeenCalled(); expect(confirmLeave).not.toHaveBeenCalled(); }); it('should confirm when leaving with an unsaved doc', async () => { - const { props } = await mountWith({ + await renderApp({ preloadedState: { visualization: { activeId: 'testVis', @@ -1563,14 +1351,16 @@ describe('Lens App', () => { isSaveable: true, }, }); - const lastCall = props.onAppLeave.mock.calls[props.onAppLeave.mock.calls.length - 1][0]; + const lastCall = (props.onAppLeave as jest.Mock).mock.calls[ + (props.onAppLeave as jest.Mock).mock.calls.length - 1 + ][0]; lastCall({ default: defaultLeave, confirm: confirmLeave }); expect(confirmLeave).toHaveBeenCalled(); expect(defaultLeave).not.toHaveBeenCalled(); }); it('should confirm when leaving with unsaved changes to an existing doc', async () => { - const { props } = await mountWith({ + await renderApp({ preloadedState: { persistedDoc: getLensDocumentMock(), visualization: { @@ -1580,71 +1370,43 @@ describe('Lens App', () => { isSaveable: true, }, }); - const lastCall = props.onAppLeave.mock.lastCall![0]; + const lastCall = (props.onAppLeave as jest.Mock).mock.lastCall![0]; lastCall({ default: defaultLeave, confirm: confirmLeave }); expect(confirmLeave).toHaveBeenCalled(); expect(defaultLeave).not.toHaveBeenCalled(); }); it('should confirm when leaving from a context initial doc with changes made in lens', async () => { - const initialProps = { - ...makeDefaultProps(), - contextOriginatingApp: 'TSVB', - initialContext: { - layers: [ - { - indexPatternId: 'ff959d40-b880-11e8-a6d9-e546fe2bba5f', - xFieldName: 'order_date', - xMode: 'date_histogram', - chartType: 'area', - axisPosition: 'left', - palette: { - type: 'palette', - name: 'default', - }, - metrics: [ - { - agg: 'count', - isFullReference: false, - fieldName: 'document', - params: {}, - color: '#68BC00', - }, - ], - timeInterval: 'auto', - }, - ], - type: 'lnsXY', - configuration: { - fill: 0.5, - legend: { - isVisible: true, - position: 'right', - shouldTruncate: true, - maxLines: 1, - }, - gridLinesVisibility: { - x: true, - yLeft: true, - yRight: true, + props.contextOriginatingApp = 'TSVB'; + props.initialContext = { + layers: [ + { + indexPatternId: 'indexPatternId', + chartType: 'area', + axisPosition: 'left', + palette: { + type: 'palette', + name: 'default', }, - extents: { - yLeftExtent: { - mode: 'full', - }, - yRightExtent: { - mode: 'full', + metrics: [ + { + agg: 'count', + isFullReference: false, + fieldName: 'document', + params: {}, + color: '#68BC00', }, - }, + ], + timeInterval: 'auto', }, - savedObjectId: '', - vizEditorOriginatingAppUrl: '#/tsvb-link', - isVisualizeAction: true, - }, - }; + ], + type: 'lnsXY', + savedObjectId: '', + vizEditorOriginatingAppUrl: '#/tsvb-link', + isVisualizeAction: true, + } as unknown as VisualizeEditorContext; - const mountedApp = await mountWith({ - props: initialProps as unknown as jest.Mocked, + await renderApp({ preloadedState: { persistedDoc: getLensDocumentMock(), visualization: { @@ -1654,7 +1416,7 @@ describe('Lens App', () => { isSaveable: true, }, }); - const lastCall = mountedApp.props.onAppLeave.mock.lastCall![0]; + const lastCall = (props.onAppLeave as jest.Mock).mock.lastCall![0]; lastCall({ default: defaultLeave, confirm: confirmLeave }); expect(defaultLeave).not.toHaveBeenCalled(); expect(confirmLeave).toHaveBeenCalled(); @@ -1681,20 +1443,18 @@ describe('Lens App', () => { }, }; - const customProps = makeDefaultProps(); - customProps.datasourceMap.testDatasource.isEqual = jest.fn().mockReturnValue(true); // if this returns false, the documents won't be accounted equal + props.datasourceMap.testDatasource.isEqual = jest.fn().mockReturnValue(true); // if this returns false, the documents won't be accounted equal - await mountWithRTL({ preloadedState, props: customProps }); + await renderApp({ preloadedState }); - const lastCallArg = customProps.onAppLeave.mock.lastCall![0]; + const lastCallArg = props.onAppLeave.mock.lastCall![0]; lastCallArg?.({ default: defaultLeave, confirm: confirmLeave }); expect(defaultLeave).toHaveBeenCalled(); expect(confirmLeave).not.toHaveBeenCalled(); }); - // not sure how to test it it('should confirm when the latest doc is invalid', async () => { - const { lensStore, props } = await mountWith({}); + const { lensStore } = await renderApp(); await act(async () => { await lensStore.dispatch( setState({ @@ -1703,25 +1463,23 @@ describe('Lens App', () => { }) ); }); - const lastCall = props.onAppLeave.mock.lastCall![0]; + const lastCall = (props.onAppLeave as jest.Mock).mock.lastCall![0]; lastCall({ default: defaultLeave, confirm: confirmLeave }); expect(confirmLeave).toHaveBeenCalled(); expect(defaultLeave).not.toHaveBeenCalled(); }); }); + it('should display a conflict callout if saved object conflicts', async () => { const history = createMemoryHistory(); - const { services } = await mountWith({ - props: { - ...makeDefaultProps(), - history: { - ...history, - location: { - ...history.location, - search: '?_g=test', - }, - }, + props.history = { + ...history, + location: { + ...history.location, + search: '?_g=test', }, + }; + await renderApp({ preloadedState: { persistedDoc: getLensDocumentMock({ savedObjectId: defaultSavedObjectId }), sharingSavedObjectProps: { diff --git a/x-pack/plugins/lens/public/app_plugin/app_helpers.test.ts b/x-pack/plugins/lens/public/app_plugin/app_helpers.test.ts index 1524b22739d41..7dc4e8cfda78c 100644 --- a/x-pack/plugins/lens/public/app_plugin/app_helpers.test.ts +++ b/x-pack/plugins/lens/public/app_plugin/app_helpers.test.ts @@ -8,7 +8,6 @@ import { renderHook, act } from '@testing-library/react-hooks'; import faker from 'faker'; import { UseNavigateBackToAppProps, useNavigateBackToApp } from './app_helpers'; -import { Subject } from 'rxjs'; import { defaultDoc, makeDefaultServices } from '../mocks/services_mock'; import { cloneDeep } from 'lodash'; import { LensDocument } from '../persistence'; @@ -17,10 +16,9 @@ function getLensDocumentMock(someProps?: Partial) { return cloneDeep({ ...defaultDoc, ...someProps }); } -const sessionIdSubject = new Subject(); -const getApplicationMock = () => makeDefaultServices(sessionIdSubject, 'sessionId-1').application; +const getApplicationMock = () => makeDefaultServices().application; -describe('App hlpers', () => { +describe('App helpers', () => { function getDefaultProps( someProps?: Partial ): UseNavigateBackToAppProps { diff --git a/x-pack/plugins/lens/public/mocks/data_plugin_mock.ts b/x-pack/plugins/lens/public/mocks/data_plugin_mock.ts index db7ab00de22e3..1ee5ee1447a7d 100644 --- a/x-pack/plugins/lens/public/mocks/data_plugin_mock.ts +++ b/x-pack/plugins/lens/public/mocks/data_plugin_mock.ts @@ -48,13 +48,13 @@ export function mockDataPlugin( function createMockSearchService() { let sessionIdCounter = initialSessionId ? 1 : 0; let currentSessionId: string | undefined = initialSessionId; - const start = () => { - currentSessionId = `sessionId-${++sessionIdCounter}`; - return currentSessionId; - }; + return { session: { - start: jest.fn(start), + start: jest.fn(() => { + currentSessionId = `sessionId-${++sessionIdCounter}`; + return currentSessionId; + }), clear: jest.fn(), getSessionId: jest.fn(() => currentSessionId), getSession$: jest.fn(() => sessionIdSubject.asObservable()), diff --git a/x-pack/plugins/lens/public/mocks/services_mock.tsx b/x-pack/plugins/lens/public/mocks/services_mock.tsx index 1452db8924ea1..5143e09e08476 100644 --- a/x-pack/plugins/lens/public/mocks/services_mock.tsx +++ b/x-pack/plugins/lens/public/mocks/services_mock.tsx @@ -5,7 +5,6 @@ * 2.0. */ -import React from 'react'; import { Subject } from 'rxjs'; import { coreMock } from '@kbn/core/public/mocks'; import { navigationPluginMock } from '@kbn/navigation-plugin/public/mocks'; @@ -104,12 +103,7 @@ export function makeDefaultServices( dataViewsMock.getIdsWithTitle.mockImplementation(jest.fn(async () => [])); const navigationStartMock = navigationPluginMock.createStartContract(); - - jest - .spyOn(navigationStartMock.ui.AggregateQueryTopNavMenu.prototype, 'constructor') - .mockImplementation(() => { - return
; - }); + const presentationUtilMock = presentationUtilPluginMock.createStartContract(core); return { ...startMock, @@ -122,7 +116,7 @@ export function makeDefaultServices( inspect: jest.fn(), closeInspector: jest.fn(), }, - presentationUtil: presentationUtilPluginMock.createStartContract(core), + presentationUtil: presentationUtilMock, savedObjectStore: { load: jest.fn(), search: jest.fn(), @@ -135,6 +129,9 @@ export function makeDefaultServices( capabilities: { ...core.application.capabilities, visualize: { save: true, saveQuery: true, show: true, createShortUrl: true }, + dashboard: { + showWriteControls: true, + }, }, getUrlForApp: jest.fn((appId: string) => `/testbasepath/app/${appId}#/`), }, diff --git a/x-pack/plugins/lens/public/mocks/store_mocks.tsx b/x-pack/plugins/lens/public/mocks/store_mocks.tsx index 2ec1627efb9b7..87667c21fed20 100644 --- a/x-pack/plugins/lens/public/mocks/store_mocks.tsx +++ b/x-pack/plugins/lens/public/mocks/store_mocks.tsx @@ -19,17 +19,25 @@ import { mockVisualizationMap } from './visualization_mock'; import { mockDatasourceMap } from './datasource_mock'; import { makeDefaultServices } from './services_mock'; -export const mockStoreDeps = (deps?: { - lensServices?: LensAppServices; - datasourceMap?: DatasourceMap; - visualizationMap?: VisualizationMap; -}) => { - return { - datasourceMap: deps?.datasourceMap || mockDatasourceMap(), - visualizationMap: deps?.visualizationMap || mockVisualizationMap(), - lensServices: deps?.lensServices || makeDefaultServices(), - }; -}; +export const mockStoreDeps = ( + { + lensServices = makeDefaultServices(), + datasourceMap = mockDatasourceMap(), + visualizationMap = mockVisualizationMap(), + }: { + lensServices?: LensAppServices; + datasourceMap?: DatasourceMap; + visualizationMap?: VisualizationMap; + } = { + lensServices: makeDefaultServices(), + datasourceMap: mockDatasourceMap(), + visualizationMap: mockVisualizationMap(), + } +) => ({ + datasourceMap, + visualizationMap, + lensServices, +}); export function mockDatasourceStates() { return {