Specific integration instructions to enable coupon auto-apply.
Sleek’s Web Extension SDK automatically inputs coupon codes into checkout and cart pages.
This documentation will guide you through the integration process.
This document assumes that you have already integrated the Sleek web extension SDK into your
extension. If you haven’t, please refer to the Web Extension SDK integration
guide.
Sleek’s web extension SDK automatically handles restarting CAA after page reloads, finding the
best coupon for the cart, and more. The result and status of CAA is emitted
using the web extension SDK’s event listener. Subscribe to events that you care about to
create UX for your users that shows the status of coupons and the savings that
users earn.For example, you might want to show UI when coupons start to get entered on a
tab and when the CAA process finishes. To do so, you can follow a pattern
like:
Copy
import { getWebExtSdk } from "@sleek/web-ext-sdk";import { SdkEventType } from "@sleek/sdk";getWebExtSdk().registerEventListener((event, { tabId }) => { // `event` is typed, so is the data of the event `event.data` based on the type of the event. switch (event.type) { case SdkEventType.COUPON_SESSION_STARTED: browser.tabs.sendMessage(tabId, { message: "CAA_STARTED", }); break; case SdkEventType.COUPON_SESSION_RESUMED: browser.tabs.sendMessage(tabId, { message: "CAA_RESUMED", }); break; case SdkEventType.COUPON_SESSION_UPDATED: browser.tabs.sendMessage(tabId, { message: "CAA_UPDATED", }); break; case SdkEventType.COUPON_SESSION_COMPLETED: browser.tabs.sendMessage(tabId, { message: "CAA_COMPLETE", }); break; }});
Once CAA has been enabled and run on a tab, the user may enter a coupon code
into the page. This coupon code is called a user generated code (UGC). UGC
events are emitted by the web extension SDK when UGC is detected on a tab.To register for UGC events, you can follow a pattern like:
Copy
import { getWebExtSdk } from "@sleek/web-ext-sdk";import { SdkEventType } from "@sleek/sdk";getWebExtSdk().registerEventListener((event, { tabId }) => { // `event` is typed, so is the data of the event `event.data` based on the type of the event. switch (event.type) { case SdkEventType.USER_GENERATED_CODE: // Emitted when a user generated code is detected on a tab. // Shape of the event is: // interface UserGeneratedCodeEvent { // type: SdkEventType.USER_GENERATED_CODE; // data: { // code: string; // }; // } console.log(event.data.code); // Do something with the UGC. break; }});
What’s next:Now that you have enabled coupon auto-apply in your extension, you can check out the TypeDoc for specific event types and methods on the web extension SDK.