Transformer

Custom Javascript code in action flow

In a action of the action flow, transformer enable you to write custom Javascript function for data calculation and transformation within action flows, which provide you with limitless potentials.

Transformers serve as an alternative to input fields, and these two modes cannot be active simultaneously.

To switch to transformer mode, click the ƒ(x). This action will open the transformer code editor, allowing you to write your custom JavaScript code.

Click to use transformer

After entering the code editor, you'll find a transformer function. Please refrain from modifying the input and output definitions; instead, write your logic within the function.

The payload is an object that contains event payload data, determined by the element and event triggering it.

The context is used to retrieve data from query results or data store variables, much like the Accessors. To access query result data, use context.getData("#query_name"). For app data, use context.getData("#app.variable_name"), and for page data, use context.getData("#page.variable_name").

The returned parameters object will be the parameters for the action. The fields are determined by the action type. Here is an example of using transformer to Set App Data. map_input is a variable in App Data, and in the transformer, an object is constructed and assigned the value of the map_input variable.

Accessor in Transformer

Function context.getData() can be used to access data from user data, app data to Query node data.

user data: context.getData("#app.user")

app data: context.getData("#app.{{variable_name}}") The variable need to be defined in Data Store

Query node data: context.getData("#{{node_name}}")

Event Data in Transformer

Values such as the date picker, selector or input box value are in the event data, which you can also access in the transformer.

The Event Data is passed to the function through payload parameter. Typically, you can access the event data via payload.event

Troubleshooting

You can use console.log() for troubleshooting. The output will be displayed in the browser’s console. For example, in Chrome, open Developer Tools, go to the Console tab, and view the logs. This works similarly to printf in C or print in Python. By logging variable values, you can track changes, identify bugs, and fix issues more effectively.

  1. Add console.log() to display the variable you want to see in the transformer script and hit update.

  2. Open preview

  3. Open Developer Tools -> Console, clear the existing logs for better readability

  4. Trigger the event

  5. Check the new logs

Last updated

Was this helpful?