Skip to main content

A Robot Framework library for React.

Project description

https://travis-ci.org/kitconcept/robotframework-react.svg?branch=master Egg Status Latest Version License

kitconcept

Introduction

ReactLibrary is a Robot Framework library for React. It currently provides a single ‘Wait for React’ keyword that makes sure your React application has been fully loaded and can be interacted with.

Installation

Install robotframework-react with pip:

$ pip install robotframework-react

Usage

In order to write your first robot test, make sure that you include Selenium2Library and ReactLibrary. Create a test.robot file with the following content:

*** Settings ***

Library         Selenium2Library  timeout=10  implicit_wait=0
Library         React Library
Suite Setup     Open browser  https://airbnb.com  chrome
Suite Teardown  Close browser


*** Test Cases ***

Scenario: Wait for react
  Go To  https://airbnb.com
  Wait for react
  Page Should Contain  Airbnb Book unique homes

Scenario: Wait for react with reducer
  Go To  https://airbnb.com
  Wait for react  reducer=headlines
  Page Should Contain  Airbnb Book unique homes

Keywords

robotframework-react currently only provides a single keyword “Wait for React”. The keyword makes sure the React app is fully loaded.

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

1.0.0a1 (2018-03-08)

  • Initial release. [timo, davidrf]

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

robotframework-react-1.0.0a1.tar.gz (54.4 kB view hashes)

Uploaded Source

Supported by

AWS AWS Cloud computing and Security Sponsor Datadog Datadog Monitoring Fastly Fastly CDN Google Google Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Sentry Sentry Error logging StatusPage StatusPage Status page