javascript - 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://...”。运行良好。

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

提前非常感谢

Answer 1

我最好的猜测是 jsdom 正在尝试找出如何解析相对 url 照片 url 并且因为它是从您的 /User/ 目录中的目录运行的解决这个问题。

您可以使用虚假的 http 地址作为测试数据，或者验证 props 而不是 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");