ReactTestUtils中图像源的意外评估结果

Question

我得到了ReactTestUtils的一些意外测试结果。 这是代码：

来源：

var React = require('react');

module.exports = React.createClass({
  render() {
    var data = this.props.data;

    return (
      <div>
        <img className="photo" src={data['photograph-url']} alt={data['photograph-caption']}/>
      </div>
    );
  }
});

使用Jest进行测试

    var React = require('react/addons');
    var TestUtils = React.addons.TestUtils;
    var data = {
      "photograph-url": "photograph url",
      "photograph-caption": "photograph caption"
    };

    var details = TestUtils.renderIntoDocument(
      <Details data={data}/>
    );
    var photo = TestUtils.findRenderedDOMComponentWithClass(details, "photo").getDOMNode();

expect(agentPhoto.src).toEqual('photograph url');

令人惊讶的是，测试失败，因为agentPhoto.src返回的结果是“ /Users/...../photograph url”，这是我的某种文件夹路径。

但是，然后我用实际的http源图像“ http：// ...”更改“照片url”。 一切正常。

我不知道背后的原因是什么

提前谢谢了

Answer 1

我最好的猜测是jsdom试图找出如何解析相对URL photograph url ，因为它是从/User/目录中的目录运行的，因此可以解决该问题。

您可以使用伪造的http地址作为测试数据，也可以验证道具而不是dom元素，例如：

var React = require('react/addons');
var TestUtils = React.addons.TestUtils;
var data = {
  "photograph-url": "photograph url",
  "photograph-caption": "photograph caption"
};

var details = TestUtils.renderIntoDocument(
  <Details data={data}/>
);
var photo = TestUtils.findRenderedDOMComponentWithClass(details, "photo");

expect(photo.props.src).toEqual("photograph url");