diff --git a/x-pack/plugins/uptime/public/lib/helper/component_test_helpers.tsx b/x-pack/plugins/uptime/public/lib/helper/component_test_helpers.tsx new file mode 100644 index 000000000000..1f7b25ae0dd0 --- /dev/null +++ b/x-pack/plugins/uptime/public/lib/helper/component_test_helpers.tsx @@ -0,0 +1,210 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +import React, { ReactElement } from 'react'; +import { render } from '@testing-library/react'; +import { Router } from 'react-router-dom'; +import { MemoryHistory } from 'history/createMemoryHistory'; +import { createMemoryHistory, History } from 'history'; +import { I18nProvider } from '@kbn/i18n/react'; +import { mountWithIntl, renderWithIntl, shallowWithIntl } from '@kbn/test/jest'; +import { coreMock } from 'src/core/public/mocks'; +import { ChromeBreadcrumb } from 'kibana/public'; +import { KibanaContextProvider } from '../../../../../../src/plugins/kibana_react/public'; +import { MountWithReduxProvider } from './helper_with_redux'; +import { AppState } from '../../state'; + +/* default mock core */ +const defaultCore = coreMock.createStart(); +const mockCore: () => any = () => { + let breadcrumbObj: ChromeBreadcrumb[] = []; + const core = { + ...defaultCore, + application: { + getUrlForApp: () => '/app/uptime', + navigateToUrl: jest.fn(), + }, + chrome: { + setBreadcrumbs: (newBreadcrumbs: ChromeBreadcrumb[]) => { + breadcrumbObj = newBreadcrumbs; + }, + }, + }; + + return core; +}; + +/* Higher Order Components */ +export function withKibanaContext( + WrappedComponent: React.ComponentType, + { kibanaProps, customCoreOptions }: { kibanaProps?: { services: any }; customCoreOptions?: any } +) { + const core = { + ...mockCore(), + customCoreOptions, + }; + return (props: any) => ( + + + + + + ); +} + +export function withRouter(WrappedComponent: React.ComponentType, customHistory: History) { + const history = customHistory || createMemoryHistory(); + return (props: T) => ( + + + + ); +} + +/* Mock Provider Components */ +export function MockKibanaProvider({ + children, + customCoreOptions, + kibanaProps, +}: { + children: ReactElement; + customCoreOptions?: any; + kibanaProps?: { services: any }; +}) { + const core = { + ...mockCore(), + customCoreOptions, + }; + return ( + + {children} + + ); +} + +export function MockRouter({ + children, + customCoreOptions, + customHistory, + kibanaProps, +}: { + children: ReactElement; + customCoreOptions?: any; + customHistory?: History; + kibanaProps?: { services: any }; +}) { + const history = customHistory || createMemoryHistory(); + return ( + + + {children} + + + ); +} + +/* React testing library custom render functions */ +export const renderTLWithKibana = ( + ui: ReactElement, + { + customCoreOptions, + kibanaProps, + renderOptions, + }: { + customCoreOptions?: any; + kibanaProps?: { services: any }; + renderOptions?: any; + } = {} +) => { + return render( + + {ui} + , + renderOptions + ); +}; + +export const renderTLWithRouter = ( + ui: ReactElement, + { + customHistory, + customCoreOptions, + kibanaProps, + renderOptions, + }: { + customHistory?: History; + customCoreOptions?: any; + kibanaProps?: { services: any }; + renderOptions?: any; + } = {} +) => { + return render( + + {ui} + , + renderOptions + ); +}; + +/* Enzyme helpers */ +const helperWithRouter: ( + helper: (node: ReactElement) => R, + component: ReactElement, + customHistory?: MemoryHistory, + wrapReduxStore?: boolean, + storeState?: AppState +) => R = (helper, component, customHistory, wrapReduxStore, storeState) => { + const history = customHistory ?? createMemoryHistory(); + + history.location.key = 'TestKeyForTesting'; + + const routerWrapper = {component}; + + if (wrapReduxStore) { + return helper( + {routerWrapper} + ); + } + + return helper(routerWrapper); +}; + +export const renderWithRouter = (component: ReactElement, customHistory?: MemoryHistory) => { + return helperWithRouter(renderWithIntl, component, customHistory); +}; + +export const shallowWithRouter = (component: ReactElement, customHistory?: MemoryHistory) => { + return helperWithRouter(shallowWithIntl, component, customHistory); +}; + +export const mountWithRouter = (component: ReactElement, customHistory?: MemoryHistory) => { + return helperWithRouter(mountWithIntl, component, customHistory); +}; + +export const renderWithRouterRedux = (component: ReactElement, customHistory?: MemoryHistory) => { + return helperWithRouter(renderWithIntl, component, customHistory, true); +}; + +export const shallowWithRouterRedux = (component: ReactElement, customHistory?: MemoryHistory) => { + return helperWithRouter(shallowWithIntl, component, customHistory, true); +}; + +export const mountWithRouterRedux = ( + component: ReactElement, + options?: { customHistory?: MemoryHistory; storeState?: AppState } +) => { + return helperWithRouter( + mountWithIntl, + component, + options?.customHistory, + true, + options?.storeState + ); +}; diff --git a/x-pack/plugins/uptime/public/lib/helper/helper_with_router.tsx b/x-pack/plugins/uptime/public/lib/helper/helper_with_router.tsx deleted file mode 100644 index 132552ef61a6..000000000000 --- a/x-pack/plugins/uptime/public/lib/helper/helper_with_router.tsx +++ /dev/null @@ -1,69 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License; - * you may not use this file except in compliance with the Elastic License. - */ - -import React, { ReactElement } from 'react'; - -import { Router } from 'react-router-dom'; -import { MemoryHistory } from 'history/createMemoryHistory'; -import { createMemoryHistory } from 'history'; -import { mountWithIntl, renderWithIntl, shallowWithIntl } from '@kbn/test/jest'; -import { AppState } from '../../state'; -import { MountWithReduxProvider } from './helper_with_redux'; - -const helperWithRouter: ( - helper: (node: ReactElement) => R, - component: ReactElement, - customHistory?: MemoryHistory, - wrapReduxStore?: boolean, - storeState?: AppState -) => R = (helper, component, customHistory, wrapReduxStore, storeState) => { - const history = customHistory ?? createMemoryHistory(); - - history.location.key = 'TestKeyForTesting'; - - const routerWrapper = {component}; - - if (wrapReduxStore) { - return helper( - {routerWrapper} - ); - } - - return helper(routerWrapper); -}; - -export const renderWithRouter = (component: ReactElement, customHistory?: MemoryHistory) => { - return helperWithRouter(renderWithIntl, component, customHistory); -}; - -export const shallowWithRouter = (component: ReactElement, customHistory?: MemoryHistory) => { - return helperWithRouter(shallowWithIntl, component, customHistory); -}; - -export const mountWithRouter = (component: ReactElement, customHistory?: MemoryHistory) => { - return helperWithRouter(mountWithIntl, component, customHistory); -}; - -export const renderWithRouterRedux = (component: ReactElement, customHistory?: MemoryHistory) => { - return helperWithRouter(renderWithIntl, component, customHistory, true); -}; - -export const shallowWithRouterRedux = (component: ReactElement, customHistory?: MemoryHistory) => { - return helperWithRouter(shallowWithIntl, component, customHistory, true); -}; - -export const mountWithRouterRedux = ( - component: ReactElement, - options?: { customHistory?: MemoryHistory; storeState?: AppState } -) => { - return helperWithRouter( - mountWithIntl, - component, - options?.customHistory, - true, - options?.storeState - ); -}; diff --git a/x-pack/plugins/uptime/public/lib/index.ts b/x-pack/plugins/uptime/public/lib/index.ts index 7e800cc1eae9..b0fc3aaaca95 100644 --- a/x-pack/plugins/uptime/public/lib/index.ts +++ b/x-pack/plugins/uptime/public/lib/index.ts @@ -5,4 +5,4 @@ */ export { MountWithReduxProvider } from './helper'; -export * from './helper/helper_with_router'; +export * from './helper/component_test_helpers';