Question

当使用具有ref =“nav”的子组件安装组件（使用jsdom）时，我希望this.refs.nav是componentDidMount中的子Navigator。当我在componentDidMount中的console.log（this.refs）时，我得到了this.refs对象。

下面的组件在ios模拟器中呈现并正常工作，但是使用酶的安装，refs是空白的。我还注意到，如果我对根元素有一个引用，那个特定的引用是在componentDidMount中定义。

我正在使用：

"react": "^15.4.1",
"react-native": "^0.39.2",
"chai": "^3.5.0",
"enzyme": "^2.7.0",
"jsdom": "^9.9.1",
"mocha": "^3.2.0",
"react-native-mock": "^0.2.9"

setup.js 在所有测试之前运行

var jsdom = require('jsdom').jsdom;
global.__DEV__ = true;
global.document = jsdom('');
global.window = document.defaultView;
Object.keys(document.defaultView).forEach((property) => {
  if (typeof global[property] === 'undefined') {
    global[property] = document.defaultView[property];
  }
});
global.navigator = {
  userAgent: 'node.js'
};
require("react-native-mock/mock");

TEST

describe("MyComponent", function() {
  it("does a thing", function() {
    const view = mount(<MyComponent/>);
    expect(...);
  });
});

COMPONENT

const routes = [
  {id: "location", index: 0},
  {id: "rate", index: 1},
  {id: "genres", index: 2},
  {id: "availabilities", index: 3}
];

class MyComponent extends React.Component {
  componentDidMount() {
    console.log(this.refs); // {}
  }

  renderScene() {
    return return <Button ref="test" title="Hello" onPress={() => { } } />;
  }

  render() {
    return (
      <View style={{ flex: 1 }}>
        <Navigator
          ref="nav"
          renderScene={this.renderScene}
          initialRouteStack={routes}
          sceneStyle={{ flex: 1 }}
          configureScene={() => Object.assign(Navigator.SceneConfigs.HorizontalSwipeJump, { gestures: {} })}
        />
        <TouchableHighlight ref="prev" key="prev" onPress={this.handlePressPrev}>
          <Text>Prev</Text>
        </TouchableHighlight>
        <TouchableHighlight ref ="next" key="next" onPress={this.handlePressNext}>
          <Text>Next</Text>
        </TouchableHighlight>
      </View>
    );
  }

}

Answer 1

this.refs是空白的，因为ref属于未呈现的未导出的导航器组件。

您可能已经注意到ShallowRenderer没有ref（）方法的文档，而MounedRenderer则没有。如果你想测试refs，你必须安装。

如果是导航器组件，您需要为ref函数中的每个组件提供renderscene()参数。

使用jsdom进行安装时如何使用refs进行天然酶测试？

1 个答案: