Question

我正在使用react-test-renderer（16.0.0-beta.5）对自定义React Native组件执行快照测试。该组件包含一个Switch组件，它会在测试执行期间抛出此警告：

console.error node_modules \ fbjs \ lib \ warning.js：36

警告：无法为无状态功能组件提供参考。尝试访问此参考将失败。

检查Switch的渲染方法。          在未知（由Switch创建）          在Switch

要重现的最小代码：

import React from 'react';
import renderer from 'react-test-renderer';
import { Switch } from 'react-native';

test('renders correctly', () => {
  const tree = renderer.create(
    <Switch />
  );
});

更多详细信息：问题是由Switch.render使用的本机RCTSwitch组件引起的：

return (
  <RCTSwitch
    {...props}
    ref={(ref) => { this._rctSwitch = ref; }}
    onChange={this._onChange}
  />
);

如您所见，此组件已分配参考号。但是，react-test-renderer使用以下代码检查组件是否为无状态：

if (typeof value === 'object' && value !== null && typeof value.render === 'function') {
  // Proceed under the assumption that this is a class instance

因为RCTSwitch没有render方法，所以会引发警告。这是一个错误吗？

Answer 1

我在测试中添加了jest.mock('Switch')，现在它通过了。

请注意，这样做会从快照中删除Switch组件，但是由于没有理由测试纯react-native组件，我认为只要Switch使用的所有功能都是单独测试的。 / p>

Answer 2

无状态组件不支持refs，创建有状态组件。

有关详情，请参阅this回答

将react-test-renderer与<switch>一起使用会导致“无状态函数组件无法给出refs”警告

2 个答案: