🌐 How to Set Up a World Object: Seamlessly Exchange Data Between Steps in WebdriverIO, TypeScript, Cucumber Automation Framework
Published: 2023-11-07 05:28:02



---
title: 🌐 How to Set Up a World Object: Seamlessly Exchange Data Between Steps in WebdriverIO, TypeScript, Cucumber Automation Framework
published: true
date: 2023-11-06 15:10:17 UTC
tags: 
canonical_url: https://hardikchotaliya.hashnode.dev/how-to-set-up-a-world-object-seamlessly-exchange-data-between-steps-in-webdriverio-typescript-cucumber-automation-framework
---

Learn how to seamlessly exchange data between steps in WebDriverIO TypeScript Cucumber automation framework for better testing efficiency.

* * *

## 🚩 **Problem Statement**

> As an **Automation Test Engineer** ,
> 
> I want to set a Value/Data in one step definition
> 
> So that I can access the same value on another step definition in the same feature file of cucumber.
> 
> **Usage:-** Use for data exchange like OrderID, AppID, TestCaseID, Unique Identifiers etc.

* * *

## 🏁 **Introduction**

In the realm of automation testing, especially with WebdriverIO, TypeScript, and Cucumber, efficiently exchanging data between test steps is crucial. It's like passing the baton in a relay race, where each step relies on the information provided by the previous one. This guide will take you through the process of setting up a World Object, a valuable tool for sharing data between steps in your automated tests.

* * *

## **🚀 The World Object: Your Data Relay**

### **Understanding the Need**

Imagine a scenario in which you're testing a web application, and you need to create an application ID in one step. Later on, you must access the same application ID in a different step to continue the flow of your test. The World Object is the solution to this challenge. It allows you to set values in one step and access those same values in another, seamlessly passing data between your test steps.

### **Scope of the World Object**

Before diving into implementation, it's essential to understand the scope of the World Object. The data stored in the World Object is not accessible throughout your entire feature file. Instead, it is available only for the duration of a scenario or iteration. For example, if you're using a scenario outline, the data is available for a single iteration of that scenario.

* * *

## **🛠 Implementation: Step by Step**

### **1. Creating the World Object**

The first step is to create a TypeScript file to define your World Object. In your project's step definitions folder, create a file named `world.ts`. This is where you'll manage your World Object.

```
import { setWorldConstructor } from "@wdio/cucumber-framework";

class CustomWorld {
    appid: string; // add any properties that you need
    constructor() {
        this.appid = "" // initialize the properties with default values
    }
}
setWorldConstructor(CustomWorld) // set the custom world as the default world

```

In this example, we're defining a `CustomWorld` class with an `appID` field, initialized as an empty string. This field will store the data we want to exchange between steps.

### **2. Generating and Setting Data**

Now, let's assume that in one of your test steps, you generate a value, such as an application ID, and you want to store it in the World Object. You can do this using TypeScript's `this` operator.

```
When(/^I login with (\w+) and (.+)$/, async function (username, password) {
    this.appid = 'TestAppID'; //Set appid
    await LoginPage.login(username, password)
});

```

You can also directly set any value to `this.appID`. This represents the World Object you've defined.

### **3. Accessing Data in Another Step**

To access the data stored in the World Object in a different step, you can simply use `this.appID`. Here's an example:

```
Then(/^I should see a flash message saying (.*)$/, async function (message) {
    console.log("App ID - " + this.appid); //Get appid
    await expect(SecurePage.flashAlert).toBeExisting();
    await expect(SecurePage.flashAlert).toHaveTextContaining(message);
});

```

This code snippet demonstrates how to retrieve the `appID` from the World Object and use it in another step.

### **4. Executing Feature file**

```
Feature: The Internet Guinea Pig Website

  Scenario Outline: <TestID>: As a user, I can log into the secure area
    Given I am on the login page
    When I login with <username> and <password>
    Then I should see a flash message saying <message>
    Examples:
      | TestID | username | password | message |
      | Test_01 | tomsmith | SuperSecretPassword! | You logged into a secure area! |
      | Test_02 | foobar | barfoo | Your username is invalid! |

```

* * *

## **🌍 Real-world Application**

In real-world automation projects, you can use the World Object to store and exchange various types of data, not just strings. You can work with boolean values, numbers, objects, arrays, and more. This flexibility makes it easy to pass the right information between steps, enhancing your test automation capabilities.

[https://github.com/hardikchotaliya/WebdriverIO-TS-Cucumber-e2e](https://github.com/hardikchotaliya/WebdriverIO-TS-Cucumber-e2e)

## **🎬 A Demonstration**

Let's see the World Object in action by running a sample test:

```
>> npm run wdio-local

```

In this demonstration, you'll observe how the `appID` is passed from one step to another, effectively exchanging data between steps.

### **Terminal Output**

```
Execution of 1 workers started at 2023-11-05T14:02:28.910Z

[0-0] RUNNING in chrome - file:///features/login.feature
[0-0] App ID - TestAppID
[0-0] App ID - TestAppID
[0-0] PASSED in chrome - file:///features/login.feature

 "spec" Reporter:
------------------------------------------------------------------
[chrome 119.0.6045.105 mac #0-0] Running: chrome (v119.0.6045.105) on mac
[chrome 119.0.6045.105 mac #0-0] Session ID: 8ed26c36093cd2301632f76100542350
[chrome 119.0.6045.105 mac #0-0]
[chrome 119.0.6045.105 mac #0-0] /features/login.feature
[chrome 119.0.6045.105 mac #0-0] The Internet Guinea Pig Website
[chrome 119.0.6045.105 mac #0-0] Test_01: As a user, I can log into the secure area
[chrome 119.0.6045.105 mac #0-0] Given I am on the login page
[chrome 119.0.6045.105 mac #0-0] When I login with tomsmith and SuperSecretPassword!
[chrome 119.0.6045.105 mac #0-0] Then I should see a flash message saying You logged into a secure area!
[chrome 119.0.6045.105 mac #0-0]
[chrome 119.0.6045.105 mac #0-0] Test_02: As a user, I can log into the secure area
[chrome 119.0.6045.105 mac #0-0] Given I am on the login page
[chrome 119.0.6045.105 mac #0-0] When I login with foobar and barfoo
[chrome 119.0.6045.105 mac #0-0] Then I should see a flash message saying Your username is invalid!
[chrome 119.0.6045.105 mac #0-0]
[chrome 119.0.6045.105 mac #0-0] 6 passing (5.6s)

Spec Files: 1 passed, 1 total (100% completed) in 00:00:10

```

**_<mark>Note:-</mark>_** <mark>App ID we are getting twice because we are calling the feature file twice as it has Example data!</mark>

* * *

## 🔴 Possible Errors/Issues

Below are the possible Errors/Issues we may face while implementing this World object in the Automation framework.

1. <mark>Error - TypeError: Cannot set properties of undefined (setting 'appid')</mark>

**Terminal Error while running script -**

```
Execution of 1 workers started at 2023-11-05T11:20:18.140Z

[0-0] RUNNING in chrome - file:///features/login.feature
[0-0] Error in "0: When I login with tomsmith and SuperSecretPassword!"
TypeError: Cannot set properties of undefined (setting 'appid')
    at CustomWorld.<anonymous> (file:///Users/name/Documents/workspace/WebdriverIO-TS-Cucumber-e2e/features/step-definitions/steps.ts:18:15)
[0-0] Error in "1: When I login with foobar and barfoo"
TypeError: Cannot set properties of undefined (setting 'appid')
    at CustomWorld.<anonymous> (file:///Users/name/Documents/workspace/WebdriverIO-TS-Cucumber-e2e/features/step-definitions/steps.ts:18:15)
[0-0] FAILED in chrome - file:///features/login.feature

```

**Steps.ts File -**

```
When(/^I login with (\w+) and (.+)$/, async (username, password) => {
    this.appid = 'TestAppID'; //Test appid
    await LoginPage.login(username, password)
    console.log("App ID - " + this.appid); //Test appid
});

```

### _Solution_:-

In <mark>Steps.ts</mark> file we have written function which doesnt accept the callback functions! So you need to Modify your `When` step definition to accept a callback function that takes a parameter:

**Steps.ts File -**

```
When(/^I login with (\w+) and (.+)$/, async function (username, password) {
    this.appid = 'TestAppID'; //Test appid
    await LoginPage.login(username, password)
    console.log("App ID - " + this.appid); //Test appid
});

```

* * *

## **🎉 Conclusion**

The World Object in WebdriverIO, TypeScript, and Cucumber automation framework is a powerful tool for exchanging data between test steps. It ensures the seamless flow of information, making your tests more efficient and robust.

By understanding the scope of the World Object and following the steps mentioned in this guide, you can harness its potential and create automation tests that are truly data-driven.

So, go ahead, set up your World Object, and elevate your test automation to new heights! 🌐💡🚀

* * *


tags: #WebDriverIO #TypeScript #Cucumber #AutomationFramework #TestAutomation #WorldObject #DataExchange #StepDefinitions #WebDriverIOTutorial #CucumberAutomation #AutomationTips

---