我在项目中使用react-cropper，但在测试时遇到了一些麻烦。这是来自我的父IReadOnlyCollection<IWebElement> chatRow = driver.FindElements(By.XPath("//*[@data-tid='message']/div"));
for (int i = 0; i < chatRow.Count; i++)
{
chatRow.ElementAt(i).GetAttribute("innerHTML");
}
组件的代码，该组件调用import { shallow } from 'enzyme';
it('increment count by 1 when button clicked', () => {
const wrapper = shallow(<Counter />);
const incrementBtn = wrapper.find('button.increment');
incrementBtn.simulate('click')
const text = wrapper.find('h1').text();
expect(text).toEqual('Counter is: 1');
})
：
CropperParent我正在使用Jest和Enzyme进行测试，运行以下测试后，我发现Cropper方法被调用了两次，这与代码覆盖率报告中的render() {
onReady = () => {
const { height, width } = this.cropperRef.current.cropper.imageData;
this.setState({
scale: width / height,
});
};
return (
<div>
<Cropper
ref={this.cropperRef}
src={imageSource}
ready={this.onReady}
style={{ width: "100%" }}
modal={false}
autoCrop={false}
aspectRatio={aspectRatio}
guides={false}
viewMode={3}
restore={false}
responsive={true}
imageSmoothingEnabled={false}
imageSmoothingQuality="high"
/>
)}
相同。 （但不确定是否意味着onReady实际上已执行），但其解构语句未执行。我相信，当组件安装在DOM上并且图像已完全加载时，2x会触发onReady事件（请参见上面的Cropper的道具）。
ready Cropper是实际jpeg图像的相对路径。 describe("CropperParent component", () => {
const wrapper = mount(<CropperParent
imageSource={testImage} />);
it('should render correctly', () => {
expect(wrapper).toMatchSnapshot(); // passes
});
it("renders Cropper component", () => {
expect(wrapper.find(Cropper)).toHaveLength(1); // passes
});
});
未执行的原因可能是什么？