* [I18n] Migrate enzyme helpers to TypeScript * Migrate src enzyme helpers * Remove eslint comments
This commit is contained in:
parent
44c3dfed61
commit
33cbfd76b5
|
@ -24,15 +24,20 @@
|
||||||
* intl context around them.
|
* intl context around them.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from 'react';
|
import { I18nProvider, InjectedIntl, intlShape } from '@kbn/i18n/react';
|
||||||
import { I18nProvider, intlShape } from '@kbn/i18n/react';
|
import { mount, ReactWrapper, render, shallow } from 'enzyme';
|
||||||
import { mount, shallow, render } from 'enzyme';
|
import React, { ReactElement, ValidationMap } from 'react';
|
||||||
|
|
||||||
// Use fake component to extract `intl` property to use in tests.
|
// Use fake component to extract `intl` property to use in tests.
|
||||||
const { intl } = mount(<I18nProvider><br /></I18nProvider>)
|
const { intl } = (mount(
|
||||||
.find('IntlProvider').instance().getChildContext();
|
<I18nProvider>
|
||||||
|
<br />
|
||||||
|
</I18nProvider>
|
||||||
|
).find('IntlProvider') as ReactWrapper<{}, {}, import('react-intl').IntlProvider>)
|
||||||
|
.instance()
|
||||||
|
.getChildContext();
|
||||||
|
|
||||||
function getOptions(context = {}, childContextTypes = {}, props = []) {
|
function getOptions(context = {}, childContextTypes: ValidationMap<any> = {}, props = {}) {
|
||||||
return {
|
return {
|
||||||
context: {
|
context: {
|
||||||
...context,
|
...context,
|
||||||
|
@ -49,8 +54,8 @@ function getOptions(context = {}, childContextTypes = {}, props = []) {
|
||||||
/**
|
/**
|
||||||
* When using React-Intl `injectIntl` on components, props.intl is required.
|
* When using React-Intl `injectIntl` on components, props.intl is required.
|
||||||
*/
|
*/
|
||||||
function nodeWithIntlProp(node) {
|
function nodeWithIntlProp<T>(node: ReactElement<T>): ReactElement<T & { intl: InjectedIntl }> {
|
||||||
return React.cloneElement(node, { intl });
|
return React.cloneElement<any>(node, { intl });
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -60,13 +65,20 @@ function nodeWithIntlProp(node) {
|
||||||
* @param options properties to pass into shallow wrapper
|
* @param options properties to pass into shallow wrapper
|
||||||
* @return The wrapper instance around the rendered output with intl object in context
|
* @return The wrapper instance around the rendered output with intl object in context
|
||||||
*/
|
*/
|
||||||
export function shallowWithIntl(node, { context, childContextTypes, ...props } = {}) {
|
export function shallowWithIntl<T>(
|
||||||
|
node: ReactElement<T>,
|
||||||
|
{
|
||||||
|
context,
|
||||||
|
childContextTypes,
|
||||||
|
...props
|
||||||
|
}: {
|
||||||
|
context?: any;
|
||||||
|
childContextTypes?: ValidationMap<any>;
|
||||||
|
} = {}
|
||||||
|
) {
|
||||||
const options = getOptions(context, childContextTypes, props);
|
const options = getOptions(context, childContextTypes, props);
|
||||||
|
|
||||||
return shallow(
|
return shallow(nodeWithIntlProp(node), options);
|
||||||
nodeWithIntlProp(node),
|
|
||||||
options,
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -76,13 +88,20 @@ export function shallowWithIntl(node, { context, childContextTypes, ...props } =
|
||||||
* @param options properties to pass into mount wrapper
|
* @param options properties to pass into mount wrapper
|
||||||
* @return The wrapper instance around the rendered output with intl object in context
|
* @return The wrapper instance around the rendered output with intl object in context
|
||||||
*/
|
*/
|
||||||
export function mountWithIntl(node, { context, childContextTypes, ...props } = {}) {
|
export function mountWithIntl<T>(
|
||||||
|
node: ReactElement<T>,
|
||||||
|
{
|
||||||
|
context,
|
||||||
|
childContextTypes,
|
||||||
|
...props
|
||||||
|
}: {
|
||||||
|
context?: any;
|
||||||
|
childContextTypes?: ValidationMap<any>;
|
||||||
|
} = {}
|
||||||
|
) {
|
||||||
const options = getOptions(context, childContextTypes, props);
|
const options = getOptions(context, childContextTypes, props);
|
||||||
|
|
||||||
return mount(
|
return mount(nodeWithIntlProp(node), options);
|
||||||
nodeWithIntlProp(node),
|
|
||||||
options,
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -92,11 +111,18 @@ export function mountWithIntl(node, { context, childContextTypes, ...props } = {
|
||||||
* @param options properties to pass into render wrapper
|
* @param options properties to pass into render wrapper
|
||||||
* @return The wrapper instance around the rendered output with intl object in context
|
* @return The wrapper instance around the rendered output with intl object in context
|
||||||
*/
|
*/
|
||||||
export function renderWithIntl(node, { context, childContextTypes, ...props } = {}) {
|
export function renderWithIntl<T>(
|
||||||
|
node: ReactElement<T>,
|
||||||
|
{
|
||||||
|
context,
|
||||||
|
childContextTypes,
|
||||||
|
...props
|
||||||
|
}: {
|
||||||
|
context?: any;
|
||||||
|
childContextTypes?: ValidationMap<any>;
|
||||||
|
} = {}
|
||||||
|
) {
|
||||||
const options = getOptions(context, childContextTypes, props);
|
const options = getOptions(context, childContextTypes, props);
|
||||||
|
|
||||||
return render(
|
return render(nodeWithIntlProp(node), options);
|
||||||
nodeWithIntlProp(node),
|
|
||||||
options,
|
|
||||||
);
|
|
||||||
}
|
}
|
|
@ -11,15 +11,20 @@
|
||||||
* intl context around them.
|
* intl context around them.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from 'react';
|
import { I18nProvider, InjectedIntl, intlShape } from '@kbn/i18n/react';
|
||||||
import { I18nProvider, intlShape } from '@kbn/i18n/react';
|
import { mount, ReactWrapper, render, shallow } from 'enzyme';
|
||||||
import { mount, shallow, render } from 'enzyme'; // eslint-disable-line import/no-extraneous-dependencies
|
import React, { ReactElement, ValidationMap } from 'react';
|
||||||
|
|
||||||
// Use fake component to extract `intl` property to use in tests.
|
// Use fake component to extract `intl` property to use in tests.
|
||||||
const { intl } = mount(<I18nProvider><br /></I18nProvider>)
|
const { intl } = (mount(
|
||||||
.find('IntlProvider').instance().getChildContext();
|
<I18nProvider>
|
||||||
|
<br />
|
||||||
|
</I18nProvider>
|
||||||
|
).find('IntlProvider') as ReactWrapper<{}, {}, import('react-intl').IntlProvider>)
|
||||||
|
.instance()
|
||||||
|
.getChildContext();
|
||||||
|
|
||||||
function getOptions(context = {}, childContextTypes = {}, props = []) {
|
function getOptions(context = {}, childContextTypes = {}, props = {}) {
|
||||||
return {
|
return {
|
||||||
context: {
|
context: {
|
||||||
...context,
|
...context,
|
||||||
|
@ -36,8 +41,8 @@ function getOptions(context = {}, childContextTypes = {}, props = []) {
|
||||||
/**
|
/**
|
||||||
* When using React-Intl `injectIntl` on components, props.intl is required.
|
* When using React-Intl `injectIntl` on components, props.intl is required.
|
||||||
*/
|
*/
|
||||||
function nodeWithIntlProp(node) {
|
function nodeWithIntlProp<T>(node: ReactElement<T>): ReactElement<T & { intl: InjectedIntl }> {
|
||||||
return React.cloneElement(node, { intl });
|
return React.cloneElement<any>(node, { intl });
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -47,13 +52,20 @@ function nodeWithIntlProp(node) {
|
||||||
* @param options properties to pass into shallow wrapper
|
* @param options properties to pass into shallow wrapper
|
||||||
* @return The wrapper instance around the rendered output with intl object in context
|
* @return The wrapper instance around the rendered output with intl object in context
|
||||||
*/
|
*/
|
||||||
export function shallowWithIntl(node, { context, childContextTypes, ...props } = {}) {
|
export function shallowWithIntl<T>(
|
||||||
|
node: ReactElement<T>,
|
||||||
|
{
|
||||||
|
context,
|
||||||
|
childContextTypes,
|
||||||
|
...props
|
||||||
|
}: {
|
||||||
|
context?: any;
|
||||||
|
childContextTypes?: ValidationMap<any>;
|
||||||
|
} = {}
|
||||||
|
) {
|
||||||
const options = getOptions(context, childContextTypes, props);
|
const options = getOptions(context, childContextTypes, props);
|
||||||
|
|
||||||
return shallow(
|
return shallow(nodeWithIntlProp(node), options);
|
||||||
nodeWithIntlProp(node),
|
|
||||||
options,
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -63,13 +75,20 @@ export function shallowWithIntl(node, { context, childContextTypes, ...props } =
|
||||||
* @param options properties to pass into mount wrapper
|
* @param options properties to pass into mount wrapper
|
||||||
* @return The wrapper instance around the rendered output with intl object in context
|
* @return The wrapper instance around the rendered output with intl object in context
|
||||||
*/
|
*/
|
||||||
export function mountWithIntl(node, { context, childContextTypes, ...props } = {}) {
|
export function mountWithIntl<T>(
|
||||||
|
node: ReactElement<T>,
|
||||||
|
{
|
||||||
|
context,
|
||||||
|
childContextTypes,
|
||||||
|
...props
|
||||||
|
}: {
|
||||||
|
context?: any;
|
||||||
|
childContextTypes?: ValidationMap<any>;
|
||||||
|
} = {}
|
||||||
|
) {
|
||||||
const options = getOptions(context, childContextTypes, props);
|
const options = getOptions(context, childContextTypes, props);
|
||||||
|
|
||||||
return mount(
|
return mount(nodeWithIntlProp(node), options);
|
||||||
nodeWithIntlProp(node),
|
|
||||||
options,
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -79,11 +98,18 @@ export function mountWithIntl(node, { context, childContextTypes, ...props } = {
|
||||||
* @param options properties to pass into render wrapper
|
* @param options properties to pass into render wrapper
|
||||||
* @return The wrapper instance around the rendered output with intl object in context
|
* @return The wrapper instance around the rendered output with intl object in context
|
||||||
*/
|
*/
|
||||||
export function renderWithIntl(node, { context, childContextTypes, ...props } = {}) {
|
export function renderWithIntl<T>(
|
||||||
|
node: ReactElement<T>,
|
||||||
|
{
|
||||||
|
context,
|
||||||
|
childContextTypes,
|
||||||
|
...props
|
||||||
|
}: {
|
||||||
|
context?: any;
|
||||||
|
childContextTypes?: ValidationMap<any>;
|
||||||
|
} = {}
|
||||||
|
) {
|
||||||
const options = getOptions(context, childContextTypes, props);
|
const options = getOptions(context, childContextTypes, props);
|
||||||
|
|
||||||
return render(
|
return render(nodeWithIntlProp(node), options);
|
||||||
nodeWithIntlProp(node),
|
|
||||||
options,
|
|
||||||
);
|
|
||||||
}
|
}
|
|
@ -4,6 +4,7 @@
|
||||||
"common/**/*",
|
"common/**/*",
|
||||||
"server/**/*",
|
"server/**/*",
|
||||||
"plugins/**/*",
|
"plugins/**/*",
|
||||||
|
"test_utils/**/*"
|
||||||
],
|
],
|
||||||
"exclude": [
|
"exclude": [
|
||||||
"test/**/*"
|
"test/**/*"
|
||||||
|
|
Loading…
Reference in a new issue