DEV Community

loading...
Cover image for test case example

test case example

egitsptr profile image Egit S. Originally published at esabook.wordpress.com on ・1 min read

Is this a bug report?

Yes

Have you read the Bugs section of the Contributing to React Native Guide?

Yes

Environment

  1. react-native -v: 0.4.5
  2. node -v: 7.4.0
  3. npm -v: 5.0.3
  4. yarn --version (if you use Yarn): 0.24.5

Then, specify:

  1. Target Platform (e.g. iOS, Android): iOS
  2. Development Operating System (e.g. macOS Sierra, Windows 10): macOs Sierra
  3. Build tools (Xcode or Android Studio version, iOS or Android SDK version, if relevant): XCode 8.3.3

Steps to Reproduce

  1. Implement React-Native FlatList in a module.
  2. Render a component in renderItems prop
  3. nest FlatList inside `` element
  4. Pull up on device to attempt to refresh

Expected Behavior

Call onRefresh function on pull up.

Actual Behavior

onRefresh function is not called.

Reproducible Demo

Snack Link: https://snack.expo.io/HJYx3Kx4W

...
  constructor(props) {
    super(props);
    this.state = {
      stories: [],
      isFetching: false,
    };
  }
  componentDidMount() { this.fetchData() }
  onRefresh() {
    this.setState({ isFetching: true }, function() { this.fetchData() });
  }
  fetchData() {
    var that = this;
    axios.get('http://192.168.0.13:3000/api/story/get/by/geo')
      .then((res) => {
        that.setState({ stories: res.data, isFetching: false });
        that.props.dispatch(StoryActions.setStories(res.data))
      })
  }
  render() {
    return (
      
         this.onRefresh()}
          refreshing={this.state.isFetching}
          data={this.state.stories}
          keyExtractor={(item, index) => item.id}
          renderItem={({item}) => ( )}
          />
      
    )
  }

Origin link: https://github.com/facebook/react-native/issues/14756

Discussion

pic
Editor guide