Question

我有一个名为“ Paginator”的组件，但在安装时不可用：

<Col xs='4'>
    {
        (() => {
            if (this.state.gridApi) {
                return <Paginator pages={this.state.gridApi.paginationGetTotalPages()} gridApi={this.state.gridApi} />
            }
            return <></>
        })()
    }
</Col>

如果没有安装它该如何测试？

import React from 'react';
import RelatorioVendas from './RelatorioVendas';
import { configure, mount } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
import { AgGridReact } from 'ag-grid-react/lib/agGridReact';
import Paginator from '../../components/General/Paginator';

import { Provider } from 'react-redux';
import { SnackbarProvider } from 'notistack';
import store from '../../store';

configure({ adapter: new Adapter() });

test('renders the "RelatorioVendas" component.', () => {
    const wrapper = mount(
        <Provider store={store}>
            <SnackbarProvider>
                <RelatorioVendas />
            </SnackbarProvider>
        </Provider>
    );
    expect(wrapper.find(Paginator)).toHaveLength(1);
});

我如何“等待”状态改变并最终渲染组件？

Answer 1

您应该能够setState像这样安装/浅装的组件：

it('should render pagination if gridApi exists', () => {
    const relatorioVendas = shallow(< RelatorioVendas />);
    relatorioVendas.setState({ gridApi: {} });
    expect(relatorioVendas.find(Paginator)).toHaveLength(1);
});

如何查找未安装的组件？

1 个答案: