Does your Shopify app expose any JavaScript events?

APP SETUP

CREATE FREE GIFTS

HOW TO'S

PROMOTE YOUR FREE GIFT

GIFT INVENTORY

GIFT FRAUD

FAQS

TROUBLESHOOTING

Does this app expose any JavaScript events?

The Dr Free Gift, BOGO Buy X Get Y app exposes several JavaScript events that you can use to integrate with your store’s custom functionality. These events fire at specific moments during the customer journey, allowing you to extend and customize the app’s behavior.

Available Events

Progress Bar Widget Updates

Fires when progress bar widgets are rendered or updated. Use this to synchronize your custom UI elements with the app’s progress display.

document.body.addEventListener('docapp-free-gift-progress-updated', () => {
    console.log('Progress bar widgets updated!');
    // Your custom logic here
});

Popup Widget Updates

Triggers when popup widget offers are rendered or refreshed. Useful for coordinating custom behaviors with the app’s popup displays.

document.body.addEventListener('docapp-free-gift-popup-updated', () => {
    console.log('Popup offers updated!');
    // Your custom logic here
});

Checkout Interaction

Fires when the app intercepts a checkout click (when configured to customize checkout and prevent additional discount applications). This event is particularly valuable for integrating tracking scripts.

document.body.addEventListener('docapp-checkout-start', (e) => {
    console.log('Checkout clicked!');
    // Your tracking or custom checkout logic here
});

Implementation Best Practices

Event Listeners Setup
- Add listeners during your initial page load
- Consider cleanup by removing listeners when appropriate
- Use event delegation if dynamically adding elements
Error Handling
- Implement try-catch blocks in your event handlers
- Avoid blocking operations that might affect the checkout flow
- Log errors appropriately for debugging
Performance Considerations
- Keep event handler logic lightweight
- Avoid expensive operations that might delay the user interface

Technical Notes

All events are prefixed with ‘docapp-‘ to avoid naming conflicts
Events fire asynchronously after their respective operations complete
Event handlers should be non-blocking to maintain app responsiveness

Remember to test your event integrations thoroughly, particularly around the checkout process where timing can be critical for proper functionality.