Payment Services Data & Events

The Payment Services drop-in uses the event bus to emit and listen for events, enabling communication between drop-ins and external integrations.

Version: 4.0.0

Events reference

Event	Direction	Description
authenticated	Listens	Fired by the User Auth drop-in when the user’s authentication state changes. Used to determine whether the shopper is a guest customer.
cart/data	Listens	Fired by the Cart drop-in when cart data is available or changes. Read by the GooglePay container at click time to supply cart items and totals to the Google Pay payment sheet.
checkout/initialized	Listens	Fired by the Checkout drop-in when the checkout state is first loaded. Used as a fallback by the GooglePay container when checkout/updated has not yet been received.
checkout/updated	Listens	Fired by the Checkout drop-in when the checkout state is updated. Read by the GooglePay container at click time to supply billing address and shipping method to the Google Pay payment sheet.
payment-services/initialized/checkout	Emits	Emitted when the drop-in finishes initializing for the CHECKOUT location.
payment-services/initialized/product-detail	Emits	Emitted when the drop-in finishes initializing for the PRODUCT_DETAIL location.

Event details

The following sections provide detailed information about each event, including its direction, event payload, and usage examples.

authenticated (listens)

Fired by the User Auth drop-in when the user’s authentication state changes. Used to determine whether the shopper is a guest customer.

Event payload

boolean

true when the shopper is authenticated, false when signed out.

Example

import { events } from '@dropins/tools/event-bus.js';

events.on('authenticated', (isAuthenticated) => {
  console.log('authenticated event received:', isAuthenticated);
});

---

cart/data (listens)

Fired by the Cart drop-in when cart data is available or changes. The GooglePay container reads this event using events.lastPayload('cart/data') at the moment the shopper clicks the Google Pay button — not at render time — to populate cart items and price totals in the Google Pay payment sheet.

The cart/data payload must therefore be present on the event bus before the shopper clicks the button. For the full CartModel type definition, see the Cart events reference.

Event payload

CartModel | null

See CartModel for the full type definition.

Example

import { events } from '@dropins/tools/event-bus.js';

events.on('cart/data', (payload) => {
  console.log('cart/data event received:', payload);
});

---

checkout/initialized (listens)

Fired by the Checkout drop-in when the checkout state is first loaded. The GooglePay container uses this event as a fallback when checkout/updated has not yet been received — for example, when the shopper opens the Google Pay payment sheet without having interacted with the checkout form.

Event payload

CheckoutData | null

Example

import { events } from '@dropins/tools/event-bus.js';

events.on('checkout/initialized', (payload) => {
  console.log('checkout/initialized event received:', payload);
});

---

checkout/updated (listens)

Fired by the Checkout drop-in when the checkout state is updated. The GooglePay container reads this event using events.lastPayload('checkout/updated') at the moment the shopper clicks the Google Pay button to populate billing address and shipping method in the Google Pay payment sheet. If checkout/updated has not yet been received, the container falls back to checkout/initialized.

Like cart/data, one of these payloads must be present on the event bus before the shopper clicks the button. For the full Cart and NegotiableQuote type definitions, see the Checkout events reference.

Event payload

Cart | NegotiableQuote | null

See Cart and NegotiableQuote for the full type definitions.

Example

import { events } from '@dropins/tools/event-bus.js';

events.on('checkout/updated', (payload) => {
  console.log('checkout/updated event received:', payload);
});

---

payment-services/initialized/checkout (emits)

See Payment method availability.

---

payment-services/initialized/product-detail (emits)

See Payment method availability.