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.

Usage

Use the startCouponAutoApply(codes: string[]) method provided by the web extension SDK to start the coupon application on a tab.
import { getWebExtSdk } from "@sleek/web-ext-sdk";

getWebExtSdk().onTab(tabId).startCouponAutoApply(['SAVE10', 'SAVE20', 'SAVE30']);

Register for the coupon auto-apply events

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:
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;
  }
});

Register for user generated code (UGC) events

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:
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.

View TypeDoc

Browse the reference TypeDoc for the web extension SDK.