Debugger

The debugger is an in-page overlay and console API for inspecting SDK state, monitoring events, and triggering cart operations during development. It is not loaded in production builds — you opt in per page via a URL parameter, meta tag, or config flag.

How It Works

1. The page is loaded with ?debugger=true (or with <meta name="next-debug" content="true">).
2. The SDK lazy-loads the debug module, attaches an overlay to the bottom of the page, and exposes a global nextDebug object on window.
3. The overlay shows panels for cart, campaign, config, checkout, events, and storage. The console object lets you trigger SDK actions without writing custom code.
4. Refreshing the page without the parameter unloads the debugger entirely.

Panels

The overlay has six panels:

• Cart — current items, totals, discounts; add/remove/update from buttons
• Campaign — packages and campaign metadata; sort, inspect, test shipping
• Config — active SDK config and feature flags
• Checkout — form state and validation errors
• Event Timeline — live feed of SDK events with payloads
• Storage — localStorage and sessionStorage browser; edit and delete keys