Configure the Javascript Class for a Flow Local Action

When a component is executed as a flow local action, the flow calls the invoke method in the javascript class. To run the code asynchronously in your client-side component, such as when you’re making an XML HTTP request (XHR), return a Promise. When the Promise is fulfilled, control is returned back to the flow.

Asynchronous Code

When the Promise is resolved, the next element in the flow is executed. When the Promise is rejected or hits the timeout, the flow takes the local action’s fault connector and sets the error message to $Flow.FaultMessage.

The default error message is An error occurred when the elementName element tried to execute the c-myComponent component. To customize the error message in $Flow.FaultMessage, return it as a new Error object in the reject() call.

1import { api, LightningElement } from 'lwc';
2import { ShowToastEvent } from 'lightning/platformShowToastEvent';
3
4
5export default class ShowToastExampleComponent extends LightningElement {
6   @api toastTitle;
7   @api toastMessage;
8
9   @api invoke(cancelToken) {
10       return new Promise((resolve, reject) => {
11
12           // If the Promise times out, abort the request and
13           // pass set $Flow.FaultMessage to "Request timed out"
14           cancelToken.promise.then(error => {
15// Here is where you can clean up ongoing async requests and customize the fault message in the event of a timeout
16               reject(new Error("Request timed out."));
17           });
18
19           // Do your asynchronous work and call resolve() or reject("Custom error message") when finished.
20           resolve();
21       });
22   }
23}

If you’re making callouts to an external server, add the external server to the allowlist in your org and enable or configure CORS in the external server.

Note

Synchronous Code

When the method finishes, the next element in the flow is executed.

1import { api, LightningElement } from 'lwc';
2import { ShowToastEvent } from 'lightning/platformShowToastEvent';
3
4export default class ShowToastExampleComponent extends LightningElement {
5   @api toastTitle;
6   @api toastMessage;
7
8
9   @api invoke() {
10       this.dispatchEvent(new ShowToastEvent({
11           title: this.toastTitle,
12           message: this.toastMessage,
13       }));
14   }
15}

See Also