javascript React测试库:在react-test-renderer中使用findAll按类名查找元素

tv6aics1  于 2023-05-16  发布在  Java
关注(0)|答案(1)|浏览(93)

我想知道是否有一种解决方案可以使用React测试渲染器来通过类名查找元素。我找到了一种方法,但我也想知道其他的解决方案。

const component = create(<Footer/>)

作为一个例子,我们有一个页脚组件,我们喜欢通过类名找到那里的链接。

component.root.findAll(/* here the class name */)
pkmbmrz7

pkmbmrz71#

我找到的解决方案是使用这个函数:

function testSelector(selector = ''): (instance: ReactTestInstance) => boolean {
    const [type, ...classNames] = selector.split('.');
    return instance => {
        if (type && instance.type !== type) {
            return false;
        }
        const {className = ''} = instance.props;
        const instanceClassNames = (className as string).split(' ');
        return classNames.every(className => instanceClassNames.includes(className));
    };
}

然后像这样使用它:

expect(component.root.findAll(testSelector('span.footer_link')).length).toBe(2)

P.S.这不是我的代码,只是找到了它。

相关问题