1

我正在用 sinon chai 和酶测试 React 组件。我正在编写一个具有 HOC 的插件，它将生成一个新的 React 组件。

我不确定用户会将什么传递给 HOC，所以我想检查它是否是 React 组件。我能找到的唯一（丑陋）方法是适应这个StackOverflow 答案

export function isClassComponent(component) {
  return (
    typeof component === 'function' && !!component.prototype.isReactComponent
  )
}

export function isFunctionComponent(component) {
  return (
    typeof component === 'function' && String(component).includes('.createElement')
  );
}

export function isReactComponent(component) {
  return !!(isClassComponent(component) || isFunctionComponent(component))
}

这是一种测试组件是否是 React 组件的模糊方法。

问题是当我的组件是一个 sinon 间谍时。

const FnChild = (props) => (<div id="child-fn">{props.children}</div>);
const ChildSpy = spy(FnChild);

现在测试isReactComponent(ChildSpy)将失败，因为isFunctionComponent实际上将检查函数的主体，并且在这种情况下ChildSpy将不再是原始函数的主体。

我知道我不应该依赖身体功能，但这是我能找到的最佳方式。

无论如何，有没有办法从间谍那里访问原始身体？在这种情况下，我怎么能把它传递给我的isFunctionComponent？

4

0 回答 0