首页 > 解决方案 > 使用酶在反应测试中获取 html 元素

问题描述

如何在酶反应测试中获取 HTML 元素?我能够找到包装纸。但我想要 HTML 元素。因为我需要覆盖的代码块对未覆盖的 HTML 元素进行了 offsetParent 检查。下面是示例。

 it('add class test', async () => {

    const wrapper = mount((
        <div class='ag-cell'>
            <div class='ag-react-conatiner'></div>
            <span anum={3} abool={false} />
            <span anum="3" abool="false" />
        </div>
    ));

    const x = wrapper.find('.ag-react-conatiner').offsetParent;

    console.log(wrapper.find('.ag-react-conatiner').offsetParent);
 }

我能够得到 wrapper.find('.ag-react-conatiner')。我怎样才能得到它的 offsetParent?

标签: reactjsunit-testingenzyme

解决方案


为什么不将属性 data-testid='something' 添加到您的元素使用中

const wrapper = mount(<MyComponent />);
expect(wrapper.find('[data-testid="something"]')).to.have.lengthOf(1);

使用上述属性可以清楚地表明它用于测试,不像在开发中可以轻松重命名等的类。


推荐阅读