Fix/react intl testing helper functions (#24527)

update testing helper functions for react-intl

now we use real intl object passed by IntlProvider via context instead of mocking intl object.
so now data(strings, JSX) passed to FormattedMessage component via values are compiled and
are inserted in the output of FormattedMessage component
This commit is contained in:
Maryia Lapata 2018-11-01 13:54:22 +03:00 committed by pavel06081991
parent 704cf6182f
commit 157477a2d7
10 changed files with 316 additions and 497 deletions

View file

@ -5,216 +5,84 @@ exports[`bulkCreate should display error message when bulkCreate request fails 1
bulkCreate={[Function]}
intl={
Object {
"formatDate": [MockFunction],
"formatHTMLMessage": [MockFunction],
"formatMessage": [MockFunction] {
"calls": Array [
Array [
Object {
"defaultMessage": "Load Kibana objects",
"id": "kbn.home.tutorial.savedObject.defaultButtonLabel",
},
],
Array [
Object {
"defaultMessage": "Imports index pattern, visualizations and pre-defined dashboards.",
"id": "kbn.home.tutorial.savedObject.installLabel",
},
],
Array [
Object {
"defaultMessage": "Load Kibana objects",
"id": "kbn.home.tutorial.savedObject.loadTitle",
},
],
Array [
Object {
"defaultMessage": "Load Kibana objects",
"id": "kbn.home.tutorial.savedObject.defaultButtonLabel",
},
],
Array [
Object {
"defaultMessage": "Imports index pattern, visualizations and pre-defined dashboards.",
"id": "kbn.home.tutorial.savedObject.installLabel",
},
],
Array [
Object {
"defaultMessage": "Load Kibana objects",
"id": "kbn.home.tutorial.savedObject.loadTitle",
},
],
Array [
Object {
"defaultMessage": "Imports index pattern, visualizations and pre-defined dashboards.",
"id": "kbn.home.tutorial.savedObject.installLabel",
},
],
Array [
Object {
"defaultMessage": "Load Kibana objects",
"id": "kbn.home.tutorial.savedObject.loadTitle",
},
],
Array [
Object {
"defaultMessage": "{savedObjectsLength} saved objects successfully added",
"id": "kbn.home.tutorial.savedObject.addedLabel",
},
Object {
"savedObjectsLength": 1,
},
],
Array [
Object {
"defaultMessage": "Imports index pattern, visualizations and pre-defined dashboards.",
"id": "kbn.home.tutorial.savedObject.installLabel",
},
],
Array [
Object {
"defaultMessage": "Load Kibana objects",
"id": "kbn.home.tutorial.savedObject.loadTitle",
},
],
Array [
Object {
"defaultMessage": "Load Kibana objects",
"id": "kbn.home.tutorial.savedObject.defaultButtonLabel",
},
],
Array [
Object {
"defaultMessage": "Imports index pattern, visualizations and pre-defined dashboards.",
"id": "kbn.home.tutorial.savedObject.installLabel",
},
],
Array [
Object {
"defaultMessage": "Load Kibana objects",
"id": "kbn.home.tutorial.savedObject.loadTitle",
},
],
Array [
Object {
"defaultMessage": "Imports index pattern, visualizations and pre-defined dashboards.",
"id": "kbn.home.tutorial.savedObject.installLabel",
},
],
Array [
Object {
"defaultMessage": "Load Kibana objects",
"id": "kbn.home.tutorial.savedObject.loadTitle",
},
],
Array [
Object {
"defaultMessage": "Request failed, Error: {message}",
"id": "kbn.home.tutorial.savedObject.requestFailedErrorMessage",
},
Object {
"message": "simulated bulkRequest error",
},
],
Array [
Object {
"defaultMessage": "Imports index pattern, visualizations and pre-defined dashboards.",
"id": "kbn.home.tutorial.savedObject.installLabel",
},
],
Array [
Object {
"defaultMessage": "Load Kibana objects",
"id": "kbn.home.tutorial.savedObject.loadTitle",
},
],
],
"results": Array [
Object {
"isThrow": false,
"value": "Load Kibana objects",
"defaultFormats": Object {
"date": Object {
"full": Object {
"day": "numeric",
"month": "long",
"weekday": "long",
"year": "numeric",
},
Object {
"isThrow": false,
"value": "Imports index pattern, visualizations and pre-defined dashboards.",
"long": Object {
"day": "numeric",
"month": "long",
"year": "numeric",
},
Object {
"isThrow": false,
"value": "Load Kibana objects",
"medium": Object {
"day": "numeric",
"month": "short",
"year": "numeric",
},
Object {
"isThrow": false,
"value": "Load Kibana objects",
"short": Object {
"day": "numeric",
"month": "numeric",
"year": "2-digit",
},
Object {
"isThrow": false,
"value": "Imports index pattern, visualizations and pre-defined dashboards.",
},
"number": Object {
"currency": Object {
"style": "currency",
},
Object {
"isThrow": false,
"value": "Load Kibana objects",
"percent": Object {
"style": "percent",
},
Object {
"isThrow": false,
"value": "Imports index pattern, visualizations and pre-defined dashboards.",
},
"time": Object {
"full": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
Object {
"isThrow": false,
"value": "Load Kibana objects",
"long": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
Object {
"isThrow": false,
"value": "{savedObjectsLength} saved objects successfully added",
"medium": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
},
Object {
"isThrow": false,
"value": "Imports index pattern, visualizations and pre-defined dashboards.",
"short": Object {
"hour": "numeric",
"minute": "numeric",
},
Object {
"isThrow": false,
"value": "Load Kibana objects",
},
Object {
"isThrow": false,
"value": "Load Kibana objects",
},
Object {
"isThrow": false,
"value": "Imports index pattern, visualizations and pre-defined dashboards.",
},
Object {
"isThrow": false,
"value": "Load Kibana objects",
},
Object {
"isThrow": false,
"value": "Imports index pattern, visualizations and pre-defined dashboards.",
},
Object {
"isThrow": false,
"value": "Load Kibana objects",
},
Object {
"isThrow": false,
"value": "Request failed, Error: {message}",
},
Object {
"isThrow": false,
"value": "Imports index pattern, visualizations and pre-defined dashboards.",
},
Object {
"isThrow": false,
"value": "Load Kibana objects",
},
],
},
},
"formatNumber": [MockFunction],
"formatPlural": [MockFunction],
"formatRelative": [MockFunction],
"formatTime": [MockFunction],
"now": [MockFunction],
"textComponent": "span",
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": Symbol(react.fragment),
"timeZone": null,
}
}
savedObjects={
@ -279,7 +147,7 @@ exports[`bulkCreate should display error message when bulkCreate request fails 1
color="warning"
data-test-subj="loadSavedObjects_failed"
size="m"
title="Request failed, Error: {message}"
title="Request failed, Error: simulated bulkRequest error"
/>
</React.Fragment>,
"key": "installStep",
@ -413,7 +281,7 @@ exports[`bulkCreate should display error message when bulkCreate request fails 1
color="warning"
data-test-subj="loadSavedObjects_failed"
size="m"
title="Request failed, Error: {message}"
title="Request failed, Error: simulated bulkRequest error"
>
<div
className="euiCallOut euiCallOut--warning"
@ -425,7 +293,7 @@ exports[`bulkCreate should display error message when bulkCreate request fails 1
<span
className="euiCallOutHeader__title"
>
Request failed, Error: {message}
Request failed, Error: simulated bulkRequest error
</span>
</div>
</div>
@ -443,133 +311,84 @@ exports[`bulkCreate should display success message when bulkCreate is successful
bulkCreate={[Function]}
intl={
Object {
"formatDate": [MockFunction],
"formatHTMLMessage": [MockFunction],
"formatMessage": [MockFunction] {
"calls": Array [
Array [
Object {
"defaultMessage": "Load Kibana objects",
"id": "kbn.home.tutorial.savedObject.defaultButtonLabel",
},
],
Array [
Object {
"defaultMessage": "Imports index pattern, visualizations and pre-defined dashboards.",
"id": "kbn.home.tutorial.savedObject.installLabel",
},
],
Array [
Object {
"defaultMessage": "Load Kibana objects",
"id": "kbn.home.tutorial.savedObject.loadTitle",
},
],
Array [
Object {
"defaultMessage": "Load Kibana objects",
"id": "kbn.home.tutorial.savedObject.defaultButtonLabel",
},
],
Array [
Object {
"defaultMessage": "Imports index pattern, visualizations and pre-defined dashboards.",
"id": "kbn.home.tutorial.savedObject.installLabel",
},
],
Array [
Object {
"defaultMessage": "Load Kibana objects",
"id": "kbn.home.tutorial.savedObject.loadTitle",
},
],
Array [
Object {
"defaultMessage": "Imports index pattern, visualizations and pre-defined dashboards.",
"id": "kbn.home.tutorial.savedObject.installLabel",
},
],
Array [
Object {
"defaultMessage": "Load Kibana objects",
"id": "kbn.home.tutorial.savedObject.loadTitle",
},
],
Array [
Object {
"defaultMessage": "{savedObjectsLength} saved objects successfully added",
"id": "kbn.home.tutorial.savedObject.addedLabel",
},
Object {
"savedObjectsLength": 1,
},
],
Array [
Object {
"defaultMessage": "Imports index pattern, visualizations and pre-defined dashboards.",
"id": "kbn.home.tutorial.savedObject.installLabel",
},
],
Array [
Object {
"defaultMessage": "Load Kibana objects",
"id": "kbn.home.tutorial.savedObject.loadTitle",
},
],
],
"results": Array [
Object {
"isThrow": false,
"value": "Load Kibana objects",
"defaultFormats": Object {
"date": Object {
"full": Object {
"day": "numeric",
"month": "long",
"weekday": "long",
"year": "numeric",
},
Object {
"isThrow": false,
"value": "Imports index pattern, visualizations and pre-defined dashboards.",
"long": Object {
"day": "numeric",
"month": "long",
"year": "numeric",
},
Object {
"isThrow": false,
"value": "Load Kibana objects",
"medium": Object {
"day": "numeric",
"month": "short",
"year": "numeric",
},
Object {
"isThrow": false,
"value": "Load Kibana objects",
"short": Object {
"day": "numeric",
"month": "numeric",
"year": "2-digit",
},
Object {
"isThrow": false,
"value": "Imports index pattern, visualizations and pre-defined dashboards.",
},
"number": Object {
"currency": Object {
"style": "currency",
},
Object {
"isThrow": false,
"value": "Load Kibana objects",
"percent": Object {
"style": "percent",
},
Object {
"isThrow": false,
"value": "Imports index pattern, visualizations and pre-defined dashboards.",
},
"time": Object {
"full": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
Object {
"isThrow": false,
"value": "Load Kibana objects",
"long": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
Object {
"isThrow": false,
"value": "{savedObjectsLength} saved objects successfully added",
"medium": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
},
Object {
"isThrow": false,
"value": "Imports index pattern, visualizations and pre-defined dashboards.",
"short": Object {
"hour": "numeric",
"minute": "numeric",
},
Object {
"isThrow": false,
"value": "Load Kibana objects",
},
],
},
},
"formatNumber": [MockFunction],
"formatPlural": [MockFunction],
"formatRelative": [MockFunction],
"formatTime": [MockFunction],
"now": [MockFunction],
"textComponent": "span",
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": Symbol(react.fragment),
"timeZone": null,
}
}
savedObjects={
@ -634,7 +453,7 @@ exports[`bulkCreate should display success message when bulkCreate is successful
color="success"
data-test-subj="loadSavedObjects_success"
size="m"
title="{savedObjectsLength} saved objects successfully added"
title="1 saved objects successfully added"
/>
</React.Fragment>,
"key": "installStep",
@ -808,7 +627,7 @@ exports[`bulkCreate should display success message when bulkCreate is successful
color="success"
data-test-subj="loadSavedObjects_success"
size="m"
title="{savedObjectsLength} saved objects successfully added"
title="1 saved objects successfully added"
>
<div
className="euiCallOut euiCallOut--success"
@ -820,7 +639,7 @@ exports[`bulkCreate should display success message when bulkCreate is successful
<span
className="euiCallOutHeader__title"
>
{savedObjectsLength} saved objects successfully added
1 saved objects successfully added
</span>
</div>
</div>

View file

@ -7,7 +7,7 @@ Object {
data-test-subj="createIndexPatternStep1Header"
errors={
Array [
"A {indexPatternName} cannot contain spaces or the characters: {characterList}",
"A name cannot contain spaces or the characters: \\\\, /, ?, \\", <, >, |",
]
}
goToNextStep={[Function]}
@ -16,48 +16,6 @@ Object {
onQueryChanged={[Function]}
query="?"
/>,
"i18n": Array [
Array [
Object {
"defaultMessage": "A {indexPatternName} cannot contain spaces or the characters: {characterList}",
"id": "kbn.management.createIndexPattern.step.invalidCharactersErrorMessage",
},
Object {
"characterList": "\\\\, /, ?, \\", <, >, |",
"indexPatternName": "name",
},
],
Array [
Object {
"defaultMessage": "A {indexPatternName} cannot contain spaces or the characters: {characterList}",
"id": "kbn.management.createIndexPattern.step.invalidCharactersErrorMessage",
},
Object {
"characterList": "\\\\, /, ?, \\", <, >, |",
"indexPatternName": "name",
},
],
Array [
Object {
"defaultMessage": "A {indexPatternName} cannot contain spaces or the characters: {characterList}",
"id": "kbn.management.createIndexPattern.step.invalidCharactersErrorMessage",
},
Object {
"characterList": "\\\\, /, ?, \\", <, >, |",
"indexPatternName": "name",
},
],
Array [
Object {
"defaultMessage": "A {indexPatternName} cannot contain spaces or the characters: {characterList}",
"id": "kbn.management.createIndexPattern.step.invalidCharactersErrorMessage",
},
Object {
"characterList": "\\\\, /, ?, \\", <, >, |",
"indexPatternName": "name",
},
],
],
}
`;

View file

@ -19,7 +19,7 @@
import React from 'react';
import { StepIndexPatternComponent } from '../step_index_pattern';
import { shallowWithIntl, intl } from 'test_utils/enzyme_helpers';
import { shallowWithIntl } from 'test_utils/enzyme_helpers';
import { Header } from '../components/header';
jest.mock('../../../lib/ensure_minimum_time', () => ({
@ -79,8 +79,6 @@ const createComponent = props => {
};
describe('StepIndexPattern', () => {
afterEach(() => intl.formatMessage.mockClear());
it('renders the loading state', () => {
const component = createComponent();
component.setState({ isLoadingIndices: true });
@ -109,7 +107,6 @@ describe('StepIndexPattern', () => {
component.update();
expect({
component: component.find('[data-test-subj="createIndexPatternStep1Header"]'),
i18n: intl.formatMessage.mock.calls,
}).toMatchSnapshot();
});

View file

@ -188,7 +188,7 @@ exports[`ScriptedFieldsTable should show a delete modal 1`] = `
confirmButtonText="Delete"
onCancel={[Function]}
onConfirm={[Function]}
title="Delete scripted field '{fieldName}'?"
title="Delete scripted field 'ScriptedField'?"
/>
</eui-overlay-mask>
</div>

View file

@ -339,7 +339,7 @@ exports[`Field for array setting should render user value if there is user value
<span>
<span>
<EuiLink
aria-label="Reset {ariaName} to default"
aria-label="Reset array test setting to default"
color="primary"
data-test-subj="advancedSetting-resetField-array:test:setting"
onClick={[Function]}
@ -712,7 +712,7 @@ exports[`Field for boolean setting should render user value if there is user val
<span>
<span>
<EuiLink
aria-label="Reset {ariaName} to default"
aria-label="Reset boolean test setting to default"
color="primary"
data-test-subj="advancedSetting-resetField-boolean:test:setting"
onClick={[Function]}
@ -1082,7 +1082,7 @@ exports[`Field for image setting should render user value if there is user value
<span>
<span>
<EuiLink
aria-label="Reset {ariaName} to default"
aria-label="Reset image test setting to default"
color="primary"
data-test-subj="advancedSetting-resetField-image:test:setting"
onClick={[Function]}
@ -1098,7 +1098,7 @@ exports[`Field for image setting should render user value if there is user value
</span>
<span>
<EuiLink
aria-label="Change {ariaName}"
aria-label="Change image test setting"
color="primary"
data-test-subj="advancedSetting-changeImage-image:test:setting"
onClick={[Function]}
@ -1440,7 +1440,7 @@ exports[`Field for json setting should render default value if there is no user
<span>
<span>
<EuiLink
aria-label="Reset {ariaName} to default"
aria-label="Reset json test setting to default"
color="primary"
data-test-subj="advancedSetting-resetField-json:test:setting"
onClick={[Function]}
@ -1575,7 +1575,7 @@ exports[`Field for json setting should render user value if there is user value
<span>
<span>
<EuiLink
aria-label="Reset {ariaName} to default"
aria-label="Reset json test setting to default"
color="primary"
data-test-subj="advancedSetting-resetField-json:test:setting"
onClick={[Function]}
@ -2018,7 +2018,7 @@ exports[`Field for markdown setting should render user value if there is user va
<span>
<span>
<EuiLink
aria-label="Reset {ariaName} to default"
aria-label="Reset markdown test setting to default"
color="primary"
data-test-subj="advancedSetting-resetField-markdown:test:setting"
onClick={[Function]}
@ -2413,7 +2413,7 @@ exports[`Field for number setting should render user value if there is user valu
<span>
<span>
<EuiLink
aria-label="Reset {ariaName} to default"
aria-label="Reset number test setting to default"
color="primary"
data-test-subj="advancedSetting-resetField-number:test:setting"
onClick={[Function]}
@ -2843,7 +2843,7 @@ exports[`Field for select setting should render user value if there is user valu
<span>
<span>
<EuiLink
aria-label="Reset {ariaName} to default"
aria-label="Reset select test setting to default"
color="primary"
data-test-subj="advancedSetting-resetField-select:test:setting"
onClick={[Function]}
@ -3239,7 +3239,7 @@ exports[`Field for string setting should render user value if there is user valu
<span>
<span>
<EuiLink
aria-label="Reset {ariaName} to default"
aria-label="Reset string test setting to default"
color="primary"
data-test-subj="advancedSetting-resetField-string:test:setting"
onClick={[Function]}

View file

@ -17,58 +17,22 @@
* under the License.
*/
import PropTypes from 'prop-types';
/**
* Components using the react-intl module require access to the intl context.
* This is not available when mounting single components in Enzyme.
* These helper functions aim to address that and wrap a valid,
* intl context around them.
*/
import React from 'react';
import { shallow, mount } from 'enzyme';
import { intl } from './mocks/intl';
import { I18nProvider, intlShape } from '@kbn/i18n/react';
import { mount, shallow, render } from 'enzyme';
/**
* Creates the wrapper instance using shallow with provided intl object into context
*
* @param node The React element or cheerio wrapper
* @param options properties to pass into shallow wrapper
* @return The wrapper instance around the rendered output with intl object in context
*/
export function shallowWithIntl(node, { context = {}, childContextTypes = {}, ...props } = {}) {
const clonedNode = cloneNode(node);
const options = getOptions(context, childContextTypes, props);
// Use fake component to extract `intl` property to use in tests.
const { intl } = mount(<I18nProvider><br /></I18nProvider>)
.find('IntlProvider').instance().getChildContext();
if (React.isValidElement(node)) {
return shallow(clonedNode, options);
}
return clonedNode.shallow(options);
}
/**
* Creates the wrapper instance using mount with provided intl object into context
*
* @param node The React element or cheerio wrapper
* @param options properties to pass into mount wrapper
* @return The wrapper instance around the rendered output with intl object in context
*/
export function mountWithIntl(node, { context = {}, childContextTypes = {}, ...props } = {}) {
const clonedNode = cloneNode(node);
const options = getOptions(context, childContextTypes, props);
if (React.isValidElement(node)) {
return mount(clonedNode, options);
}
return clonedNode.mount(options);
}
export { intl };
function cloneNode(node) {
if (!node) {
throw new Error(`First argument should be cheerio object or React element, not ${node}`);
}
return React.cloneElement(node, { intl });
}
function getOptions(context, childContextTypes, props) {
function getOptions(context = {}, childContextTypes = {}, props = []) {
return {
context: {
...context,
@ -76,8 +40,63 @@ function getOptions(context, childContextTypes, props) {
},
childContextTypes: {
...childContextTypes,
intl: PropTypes.any,
intl: intlShape,
},
...props,
};
}
/**
* When using React-Intl `injectIntl` on components, props.intl is required.
*/
function nodeWithIntlProp(node) {
return React.cloneElement(node, { intl });
}
/**
* Creates the wrapper instance using shallow with provided intl object into context
*
* @param node The React element or cheerio wrapper
* @param options properties to pass into shallow wrapper
* @return The wrapper instance around the rendered output with intl object in context
*/
export function shallowWithIntl(node, { context, childContextTypes, ...props } = {}) {
const options = getOptions(context, childContextTypes, props);
return shallow(
nodeWithIntlProp(node),
options,
);
}
/**
* Creates the wrapper instance using mount with provided intl object into context
*
* @param node The React element or cheerio wrapper
* @param options properties to pass into mount wrapper
* @return The wrapper instance around the rendered output with intl object in context
*/
export function mountWithIntl(node, { context, childContextTypes, ...props } = {}) {
const options = getOptions(context, childContextTypes, props);
return mount(
nodeWithIntlProp(node),
options,
);
}
/**
* Creates the wrapper instance using render with provided intl object into context
*
* @param node The React element or cheerio wrapper
* @param options properties to pass into render wrapper
* @return The wrapper instance around the rendered output with intl object in context
*/
export function renderWithIntl(node, { context, childContextTypes, ...props } = {}) {
const options = getOptions(context, childContextTypes, props);
return render(
nodeWithIntlProp(node),
options,
);
}

View file

@ -93,7 +93,7 @@ exports[`LabelTemplateFlyout should render normally 1`] = `
Array [
Object {
"input": 1234,
"labelTemplate": "User #{value}",
"labelTemplate": "User #{{value}}",
"output": "<a href=\\"http://company.net/profiles?user_id=1234\\">User #1234</a>",
"urlTemplate": "http://company.net/profiles?user_id={{value}}",
},

View file

@ -90,51 +90,51 @@ Array [
exports[`index table should show the right context menu options when more than one closed index is selected 1`] = `
Array [
"Open {entity}",
"Delete {entity}",
"Open indices",
"Delete indices",
]
`;
exports[`index table should show the right context menu options when more than one open index is selected 1`] = `
Array [
"Close {entity}",
"Force merge {entity}",
"Refresh {entity}",
"Clear {entity} cache",
"Flush {entity}",
"Delete {entity}",
"Close indices",
"Force merge indices",
"Refresh indices",
"Clear indices cache",
"Flush indices",
"Delete indices",
]
`;
exports[`index table should show the right context menu options when one index is selected and closed 1`] = `
Array [
"Show {entity} settings",
"Show {entity} mapping",
"Edit {entity} settings",
"Open {entity}",
"Delete {entity}",
"Show index settings",
"Show index mapping",
"Edit index settings",
"Open index",
"Delete index",
]
`;
exports[`index table should show the right context menu options when one index is selected and open 1`] = `
Array [
"Show {entity} settings",
"Show {entity} mapping",
"Show {entity} stats",
"Edit {entity} settings",
"Close {entity}",
"Force merge {entity}",
"Refresh {entity}",
"Clear {entity} cache",
"Flush {entity}",
"Delete {entity}",
"Show index settings",
"Show index mapping",
"Show index stats",
"Edit index settings",
"Close index",
"Force merge index",
"Refresh index",
"Clear index cache",
"Flush index",
"Delete index",
]
`;
exports[`index table should show the right context menu options when one open and one closed index is selected 1`] = `
Array [
"Open {entity}",
"Delete {entity}",
"Open indices",
"Delete indices",
]
`;

View file

@ -4,42 +4,86 @@
* you may not use this file except in compliance with the Elastic License.
*/
import PropTypes from 'prop-types';
import React from 'react';
import { mount } from 'enzyme'; // eslint-disable-line import/no-extraneous-dependencies
import { intl } from './mocks/intl';
/**
* Creates the wrapper instance with provided intl object into context
*
* @param node The React element or cheerio wrapper
* @param options properties to pass into mount wrapper
* @return The wrapper instance around the rendered output with intl object in context
* Components using the react-intl module require access to the intl context.
* This is not available when mounting single components in Enzyme.
* These helper functions aim to address that and wrap a valid,
* intl context around them.
*/
export function mountWithIntl(node, { context = {}, childContextTypes = {}, ...props } = {}) {
if (!node) {
throw new Error(`First argument should be cheerio object or React element, not ${node}`);
}
const clonedNode = React.cloneElement(node, { intl });
import React from 'react';
import { I18nProvider, intlShape } from '@kbn/i18n/react';
import { mount, shallow, render } from 'enzyme'; // eslint-disable-line import/no-extraneous-dependencies
const options = {
// Use fake component to extract `intl` property to use in tests.
const { intl } = mount(<I18nProvider><br /></I18nProvider>)
.find('IntlProvider').instance().getChildContext();
function getOptions(context = {}, childContextTypes = {}, props = []) {
return {
context: {
...context,
intl,
},
childContextTypes: {
...childContextTypes,
intl: PropTypes.any,
intl: intlShape,
},
...props,
};
if (React.isValidElement(node)) {
return mount(clonedNode, options);
}
return clonedNode.mount(options);
}
export { intl };
/**
* When using React-Intl `injectIntl` on components, props.intl is required.
*/
function nodeWithIntlProp(node) {
return React.cloneElement(node, { intl });
}
/**
* Creates the wrapper instance using shallow with provided intl object into context
*
* @param node The React element or cheerio wrapper
* @param options properties to pass into shallow wrapper
* @return The wrapper instance around the rendered output with intl object in context
*/
export function shallowWithIntl(node, { context, childContextTypes, ...props } = {}) {
const options = getOptions(context, childContextTypes, props);
return shallow(
nodeWithIntlProp(node),
options,
);
}
/**
* Creates the wrapper instance using mount with provided intl object into context
*
* @param node The React element or cheerio wrapper
* @param options properties to pass into mount wrapper
* @return The wrapper instance around the rendered output with intl object in context
*/
export function mountWithIntl(node, { context, childContextTypes, ...props } = {}) {
const options = getOptions(context, childContextTypes, props);
return mount(
nodeWithIntlProp(node),
options,
);
}
/**
* Creates the wrapper instance using render with provided intl object into context
*
* @param node The React element or cheerio wrapper
* @param options properties to pass into render wrapper
* @return The wrapper instance around the rendered output with intl object in context
*/
export function renderWithIntl(node, { context, childContextTypes, ...props } = {}) {
const options = getOptions(context, childContextTypes, props);
return render(
nodeWithIntlProp(node),
options,
);
}

View file

@ -1,18 +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.
*/
/* global jest */
export const intl = {
formatMessage: jest.fn().mockImplementation(({ defaultMessage }) => defaultMessage),
formatDate: jest.fn().mockImplementation(value => value),
formatTime: jest.fn().mockImplementation(value => value),
formatRelative: jest.fn().mockImplementation(value => value),
formatNumber: jest.fn().mockImplementation(value => value),
formatPlural: jest.fn().mockImplementation(value => value),
formatHTMLMessage: jest.fn().mockImplementation(({ defaultMessage }) => defaultMessage),
now: jest.fn().mockImplementation(() => new Date(1531834573179)),
textComponent: 'span'
};