带有嵌套组件的 Jest 快照答案

【问题标题】：Jest snapshots with nested components带有嵌套组件的 Jest 快照
【发布时间】：2017-02-15 08:50:49
【问题描述】：

我为具有许多子组件的组件创建了快照测试，该方法的主要原因是它警告开发人员“内部”组件中的修改将对许多其他父组件产生影响。

但是快照文件好像不对，很多地方的代码都像下面这样。可能是什么原因造成的？

Filter.js
<div>
        Function.debounce
      </div>
      <div
        style={
          Object {
            "color": "rgba(255, 255, 255, 0.7)",
            "fontSize": "0.8em",
          }
        }>
        <a
          href="file:///home/<myuser>/console/node_modules/lodash/index.js"
          style={
            Object {
              "color": "rgba(255, 255, 255, 0.7)",
              "textDecoration": "none",
            }
          }>
          /home/<myuser>/console/node_modules/lodash/index.js:7667:15
        </a>
      </div>
    </div>
    <div
      style={
        Object {
          "marginTop": "1em",
        }
      }>
      <div>
        Filter.render
      </div>

Function.debouce
href="file://home//console
Filter.render

【问题讨论】：

标签： reactjs jestjs

【解决方案1】：

我还不能发表评论，所以不得不添加一个答案......抱歉 Stack Overflow 诸神 - 如果 OP 添加更多详细信息，我将编辑答案

您能否添加一些产生该问题的源代码？另外，您如何渲染组件并转换为 JSON（react-test-renderer 或酶）？

如果没有更多信息，很难猜出Function.debouce 或 Filter.render 是，但是您是否将 <a> 中的 href 设置为本地文件？

【讨论】：