Event Listeners - ChatNode API Docs

Overview

ChatNode enables developers to track and respond to key events during a agent’s lifecycle. By using window.chatnode.addEventListener and window.chatnode.removeEventListener, you can listen for and handle specific events to create interactive and dynamic user experiences. This guide explains how to initialize ChatNode, register event listeners, and handle event payloads.

Make sure to load the popup chat script before listening these events.

Available Event Types

The eventName parameter must be one of the following enum values:

Event Name	Description	Payload
`action.call`	Triggered when a action is called.	`{ id, name, args }`
`action.result`	Triggered when a action returns a result.	`{ id, name, args, result }`
`message.user`	Triggered when a user sends a message.	`{ content }`
`message.assistant`	Triggered when the assistant sends a message.	`{ content }`

Adding an Event Listener

To listen for a specific event, use the following syntax:

window.chatnode.addEventListener(eventName, callback);

Parameters

eventName (enum) — Must be one of the event names listed in Available Event Types.
callback (function) — Function to be called when the event is fired. The event payload is passed as an argument.

Example

Listen for a user message:

window.chatnode.addEventListener("message.user", (event) => {
  console.log("User message received:", event.payload.content);
});

Removing an Event Listener

To remove a listener for a specific event, use the following syntax:

window.chatnode.removeEventListener(eventName, callback);

Parameters

eventName (enum) — Must be one of the event names listed in Available Event Types.
callback (function) — The exact callback function used when adding the event listener.

Example

Remove a user message listener:

const userMessageHandler = (event) => {
  console.log("User message received:", event.payload.content);
};

// Attach the event listener
window.chatnode.addEventListener("message.user", userMessageHandler);

// Remove the event listener
window.chatnode.removeEventListener("message.user", userMessageHandler);

Event Payloads

Each event type has a specific payload. Below are the details for each event type:

action.call

{
  id: 'unique-id',
  name: 'action-name',
  args: {},
}

action.result

{
  id: 'unique-id'
  name: 'action-name',
  args: {},
  result: {},
}

message.user
{ content: "Hello, agent!"; }
message.assistant
{ content: "Hello, user!"; }

Troubleshooting

If you encounter issues, consider the following tips:

Check the event name. Ensure you’re using a valid event name listed in Available Event Types.
Match the callback function. Ensure the callback reference used in removeEventListener matches the one used in addEventListener.
Check SDK initialization. Ensure the ChatNode script has loaded before registering event listeners.

​Overview

​Available Event Types

​Adding an Event Listener

​Parameters

​Example

​Removing an Event Listener

​Parameters

​Example

​Event Payloads

​Troubleshooting

Overview

Available Event Types

Adding an Event Listener

Parameters

Example

Removing an Event Listener

Parameters

Example

Event Payloads

Troubleshooting