Kheera NPM module

This module provides some extra features when using WebDriverIO with Cucumber. It allows the developer to sync with Kheera UI or generate Page Object Models, elements, actions and validators which later can be used when writing e2e tests.

Getting started

Install the NPM module

Install Kheera and WebdriverIO npm install kheera webdriverio --save-dev.

The Kheera module will provide kheera binary which can be used to run commands inside your project root directory: ./node_modules/.bin/kheera

You can also choose to install Kheera globally. You must then link it to your local project with npm link kheera.

Kheera uses some ES2015 and experimental features such as decorators in the POM classes. Decorators are used to make it easy to register components, elements, actions and validators to the store. In addition actions and validators are registered as Cucumber steps so that they can be used when writing scenarios. To use these features, the definition files need to be compiled with Babel. Your project needs some (additional) dependencies and babel runtime configuration.

Some additional dependencies that are required: npm install chai babel-register babel-preset-es2015 babel-preset-stage-1 babel-plugin-transform-decorators-legacy --save-dev

When everything is installed, run the ./node_modules/bin/wdio to setup WebdriverIO. It will guide you through a few steps.

Reply with the answers below. Bold items are mandatory. All the others are recommended, but can be different depending on the project.

• Where to execute the tests: On my local machine
• Framework: Cucumber
• Reporter: Spec
• Service: Selenium Standalone
• Log level: Command
• Base URL: http://localhost:3000 (your local development URL)

When everything is installed, a file wdio.conf.js will be generated inside your root directory. You need to do two things inside the cucumberOpts object to hook it up with Kheera:

• Add "./node_modules/kheera/dist/definitions/" to the require array. This will register some basic steps provided by Kheera.
• Add "js:babel-register" to compiler array. This is required to make sure the definition files are parsed with Babel on execution.

Add the configuration below to .babelrc in your project root directory. If you're already using babel, make sure the following presets and plugins are also configured.

{ "presets": [ "es2015", "stage-1" ], "plugins": [ "transform-decorators-legacy" ] }

Using WebdriverIO

./node_modules/.bin/wdio

Using Kheera

Generate POM and content

You can run kheera generate to generate items listed below. It will read the WebdriverIO's configuration file to determine where to write the files to. The command is also interactive so when generating an element, action or validator it will ask you which POM class should be used.

• Page Generate a new POM class that represents a page
• Component Generate a new POM class that represents a component
• Element Generate a new element getter on an existing POM class
• Action Generate a new action method on an existing POM class
• Validator Generate a new validator method on an existing POM class

Run Cucumber tests

You can run ./node_modules/.bin/wdio wdio.conf.js to run the Cucumber tests.