如何使用带有Jest的酶在React Component中编写DataTable的单元测试？

Question

我是React Unit测试的新手。 我已经构建了一个React组件来呈现DataTable ，该DataTable以column names和data作为道具。 我已经使用带有Jest的Enzyme（即PASSED编写了表格元素的单元测试。 单元测试为

describe('Client Component Testing', () => {

    let mountedClientComp;
    const clientComp = () => {
        if (!mountedClientComp) {
            mountedClientComp = mount(
                <ClientsTable/>
            );
        }
        return mountedClientComp;
    };

    it('Client component renders a table', () => {
        const table = clientComp();
        table.setState({ temp: true });
        table.update();
        expect(table.exists('table')).toEqual(true);
    });
});

但是还不知道如何为DataTable搜索字段，分页按钮，表信息，表长度，排序元素编写单元测试。

DataTable通过将table html标签带入DataTable对象来操纵DOM，并且由于table html标签是写在React组件中的，因此对表元素PASSED单元测试。

但是，对于测试DataTable Search输入字段，我正在寻找input元素，该元素未编写且将动态附加，因此无法获得编写单元测试的方法！

如何编写动态添加元素的单元测试？

问候[Shashidhar]

Answer 1

您可以在每个具有不同属性的测试用例中安装新的<ClientsTable> ，并在各个测试用例中找到所需的内容。