IntlProvider - дочерние компоненты не отображаются - PullRequest
Новая
       6

IntlProvider - дочерние компоненты не отображаются

0 голосов
/ 10 марта 2019

Я пишу тест так: 

class Foo extends Component {
    render() {
        return (
            <div data-test="foo-test">
                <span data-test="foo-test">Bar</span>
            </div>
        )
    }
}

describe('Login Page', () => {
    test('logs in to the application', async () => {
        const component = await componentBuilder(Foo, '[data-test="foo-test"]');

    });
});

componentBuilder выглядит так: 

const componentBuilder = async (RootComponent, selector) => {
    try {
        const component = mount(
            <Wrapper store={store}>
                <RootComponent />
            </Wrapper>
        );

        console.log(component.debug());

        if (selector) {
            await waitForComponentSelector(selector, component);
        }

        return component;
    } catch(err) {
        throw err;
    }
};

Wrapper выглядит так: 

class Wrapper extends Component {
    ...
    render() {
        return (
            <Provider store={this.props.store}>
                <LocaleProviderWrapper>
                    <ThemeProvider>{this.props.children}</ThemeProvider>
                </LocaleProviderWrapper>
            </Provider>
        );
    }
}

LocaleProviderWrapper выглядит так: 

const LocaleProviderWrapper = ({ children, locale }) => {
    ...
    return (
        <IntlProvider locale={locale} messages={messages}>
            {children}
        </IntlProvider>
    )
};

const propTypes = {
    children: PropTypes.element.isRequired,
    locale: PropTypes.string.isRequired,
};

LocaleProviderWrapper.propTypes = propTypes;

const mapStateToProps = state => ({
    locale: getLoggedInUserLocale(state),
});

export default connect(mapStateToProps)(LocaleProviderWrapper);

Выходные данные console.log(component.debug()); в componentBuilder: 

<Wrapper store={{...}}>
      <Provider store={{...}}>
        <Connect(LocaleProviderWrapper)>
          <LocaleProviderWrapper locale="en-GB" dispatch={[Function]}>
            <IntlProvider locale="en-GB" messages={{...}} defaultLocale="en-GB" />
          </LocaleProviderWrapper>
        </Connect(LocaleProviderWrapper)>
      </Provider>
    </Wrapper>

Как видите, Foo не отображаетсякак ребенок <IntlProvider>, который я ожидал бы увидеть.Любая причина, почему это?

...