> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.poool.fr/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Send custom tracking using Poool Engage events

###### On Poool Engage, custom tracking is based on the use of events exposed by the solution.
When the Engage SDK loads and during user interactions (element display, clicks, forms, etc.), Poool automatically triggers events containing data associated with each action.

## Principle & How It Works

You can listen to events from your integration in order to retrieve information related to elements and user actions, and then use them to send custom tracking to your tools (analytics, dataLayer, CRM, etc.).
Poool automatically detects interactions and allows you to leverage this data according to your needs.
From your integration, you can subscribe to Poool Engage events using the `.on()` method.
This allows you to:
* detect actions on Engage elements and user interactions in real time
* retrieve data associated with these actions
* send custom tracking according to your needs

## Event Arguments

Each event returns an arguments object containing data related to the triggered action.
These arguments are not identical for all events: they vary depending on the type of event.
For example:
* a click event returns information related to the clicked element or block
* a form event returns information related to fields and submission
* a view event returns contextual data (element, page, state, visibility)
Each event therefore has its own argument structure, which you can use to adapt your tracking.

## Example: Tracking a a click on an element

```
engage.on('click', (event) => {
  console.log('User interacted with Engage', event)

  // Google Analytics (GA4) example
  gtag('event', 'engage_click', {
    element: event.element,
    type: event.type
  })

  // Google Tag Manager (dataLayer) example
  window.dataLayer = window.dataLayer || []
  window.dataLayer.push({
    event: 'poool_engage_click',
    element: event.element,
    type: event.type
  })
})
```

The `click` event is triggered when a user interacts with an Engage element.
It returns an `event` object containing information related to the clicked element.

## Full List of Available Events

Here are the main events available in Poool Engage:
* `ready` : when the Engage element is loaded and ready
* `seen` : when the element becomes visible in the viewport
* `click` : click on the element
* `formSubmit` : form submission inside an Engage widget
* `destroy` : click on a button / image configured to destroy the element
* `error` : SDK or element error

For the full list of available events and their associated data, please refer to the official documentation:
[https://www.poool.dev/en/docs/engage/javascript/events#click](https://www.poool.dev/en/docs/engage/javascript/events#click)

## Best Practices

* Ensure your tracking script is loaded before listening to events
* Test your events in a staging environment
* Use `console.log` to validate received data
* Adapt your tracking depending on the elements