robotframework-react 1.0.0a1

Plain React Example

When used without any parameter, “Wait for react” expects the React app to set a global variable named “window.appStatus” to true when the app is fully loaded.

To make this work with your React app, add a global window.appStatus to your index.js:

window.appStatus = false
const updateStatus = () => {
  window.appStatus = true
}

ReactDOM.render(<App updateStatus={updateStatus} />, document.getElementById('root'));

Add an “isLoading” state to your App and update it on componentDidMount and componentDidUpdate (App.js):

class App extends Component {
  state = {
    isLoading: true,
  }

  componentDidMount() {
    wait(2000).then(() => {
      this.setState({ isLoading: false })
    })
  }

  componentDidUpdate() {
    if (!this.state.isLoading) {
      this.props.updateStatus()
    }
  }
  ...
}

You can find a full working example here: https://github.com/kitconcept/robotframework-react/tree/master/tests/create-react-app

Robot Test: https://github.com/kitconcept/robotframework-react/blob/master/tests/create-react-app/test.robot

Redux

When working with Redux, you have to pass the name of the reducer to the ‘Wait for React’ keyword:

Wait for react  reducer=headlines

The reducer needs to implement an “isFetching” attribute in the Redux state:

const initialState = {
  isFetching: false,
  ...
};

You can find a full working example here:

https://github.com/kitconcept/robotframework-react/tree/master/tests/create-react-app-with-redux

Robot Test with Redux:

https://github.com/kitconcept/robotframework-react/blob/master/tests/create-react-app-with-redux/test.robot