如何使用 Enzyme 在 React 组件的数据属性中断言 div？

Question

我有一个 React 组件，它创建了一个带有自定义数据属性的 <div>，例如

<div className="video-wrapper" data-video-source="brightcove" />

使用酶我可以断言类像这样

it('creates a div with correct oVideo attributes', () => {
    const videoDiv = component.find('div.video-wrapper')
    expect(videoDiv.hasClass('video-wrapper')).to.equal(true);
});

但是我如何断言 data-video-source 属性的值为 brightcove？

Answer 1

您可以使用 .prop() 方法实现此目的：

it('creates a div with correct oVideo attributes', () => {
    const videoDiv = component.find('div.video-wrapper')
    expect(videoDiv.hasClass('video-wrapper')).to.equal(true);
    expect(videoDiv.prop('data-video-source')).to.equal('brightcove');
});

如何使用 Enzyme 在 React 组件的数据属性中断言 div？

How to assert a div in a React component's data attributes using Enzyme?

javascript

testing

reactjs

enzyme