Send JavaScript Code (RWC) ​

Read the overview on what to use the Step for in the Customize your chat by adding your JavaScript code article.

The Send JavaScript Code (RWC) Step serves to execute the added JavaScript code on the chat client. Once the Flow reaches the Step, it sends the JavaScript to the chat, does not wait till the end of the code execution, and proceeds to the next leg. So there is no pause in the chat. You can use the Step to execute synchronous or asynchronous code and work with DOM. To access some Merged field in the JavaScript code, the Step allows to create a variable and assign the Merge field as a value of this variable. The Step returns the result of the executed code as the Step output.

Settings ​

In the Code field, write your JavaScript to be executed on the frontend. If the field is empty, the Step will take the error leg. You can:

• Execute synchronous JavaScript code. For example:

console.log("test");

console.log("test");

• Execute asynchronous JavaScript code. For example:

return new Promise(resolve => setTimeout(() => {
  console.log("test");
  resolve("test");
}, 2000));

return new Promise(resolve => setTimeout(() => {
  console.log("test");
  resolve("test");
}, 2000));

• Work with DOM. For example:

document.querySelector('div.block');

document.querySelector('div.block');

To use the Merge field value in your JavaScript code, create a variable ​

You can declare necessary variables right in the Code field or as described below.

To use the Merged field value from another Step in your JavaScript code:

1. Click + Add variable.
2. Fill in the Variable name. The value must be unique within the Step and can’t include spaces, special characters, or numbers. Otherwise, the Step will take the error leg. The field is required.
3. Click {x} next to the Variable value field and choose the Merge field you need to reuse in your JavaScript code. The field is required. The field also allows manual input.

Now you can access the necessary Merge field value in your JavaScript code via the created variable.

You can add as many variables as you need with + Add variable. If you need to add a lot of variables, you can switch to the Code mode and add them as an array of objects. Make sure the structure of the objects is the following:

[
  {
    varName: `name`,
    varValue: `Bobby`
  }, 
  {
    varName: `age`,
    varValue: 26
  }
]

[
  {
    varName: `name`,
    varValue: `Bobby`
  }, 
  {
    varName: `age`,
    varValue: 26
  }
]

Example: Assiging a Merge field as a value of the variable and accessing it in the JavaScript code ​

We create the first Send JavaScript Code (RWC) Step:

The Step has the Merge field value, which contains the returned result of the code execution.

We create the second Send JavaScript Code (RWC) Step, add a variable, and add the Merge field of the first Step as a Variable value. Now we can use the Merge field of the first Step in the code of the second Step.

Merge field settings ​

Find details in the Set up Merge fields article.

Step output ​

The Step returns the result of the code execution in its Merge field stepName.result.

{
  "result": "test"
}

{
  "result": "test"
}

result can return any data type.

Conversation ​

Find details in the Conversation settings in the RWC Step article.

Error handling ​

Find details in the Error and timeout handling article.

Reporting ​

Find details in the Reporting events article.