JavaScript Events
Enhance exposes custom JavaScript events that developers can use when adding custom functionality, analytics tracking, or third-party integrations.
Available Events
Event | Description |
| Triggered after a product is successfully added to the cart. |
| Triggered when the quick view drawer is opened. |
| Triggered when the cart is updated. |
| Triggered when a popup is opened. |
| Triggered when a product variant is changed. |
| Triggered when a cart line item quantity or state changes. |
| Triggered when a side panel is opened. |
| Triggered when a side panel is closed. |
Example Usage
Use document.addEventListener() to listen for theme events.
document.addEventListener('product:variant-change', function(event) {
console.log('Variant changed:', event.detail);
});
document.addEventListener('cart:item-added', function(event) {
console.log('Item added to cart:', event.detail);
});
document.addEventListener('side-panel:open', function(event) {
console.log('Side panel opened:', event.detail);
});
Notes
Event payloads may vary depending on the component that triggers the event. We recommend checking event.detail when building custom integrations.
document.addEventListener('cart-change', function(event) {
console.log(event.detail);
});