Measura block

Block-specific storefront methods exposed by the Measura product block runtime.

Availability

These methods are only available when at least one Measura product block has been rendered and initialized on the page.

They are exposed by the Measura product block runtime and are intended for theme code that needs to coordinate mounted Measura blocks.

  • Unlike the line item property builders, these methods are not asynchronous.
  • If no Measura product block has mounted yet, these methods should be treated as unavailable.
  • Use these methods when your theme needs to inspect or control block state that is already present on the page.
if (window.Measura?.getRegisteredProductIds) {
  const productIds = window.Measura.getRegisteredProductIds();
  console.log(productIds);
}

Method summary

MethodAsyncDescription
setVariant(payload)NoProgrammatically switch the selected variant for a mounted Measura product block.
getRegisteredProductIds()NoReturn the Measura product IDs currently registered by the block runtime.
addEventListener(eventName, callback, options?)NoSubscribe to block runtime events such as Measura-managed variant changes.
removeEventListener(eventName, callback, options?)NoUnsubscribe a previously registered block runtime event listener.

window.Measura.setVariant(payload)

Programmatically switch the selected variant for a mounted Measura product block.

Availability

  • Only available when at least one Measura product block has been rendered and initialized.

Purpose

  • Allow theme code to switch the selected variant for a mounted Measura block without relying only on customer interaction.
  • Coordinate Measura block state with other storefront UI such as custom swatches, bundles, or external selectors.

Input

{ variantId?: string | number; source?: string } | string | number

Output

{ handled: boolean; reason?: string; variantId?: string; productId?: string }

Usage note

Call this method only after the target Measura product block has mounted and registered itself with the runtime.

window.Measura.getRegisteredProductIds()

Returns the set of Measura product IDs currently registered by the block runtime.

Availability

  • Only available when at least one Measura product block has been rendered and initialized.

Purpose

  • Inspect which Measura product IDs are currently managed by the block runtime on the page.
  • Help theme code determine whether a target product block is present before attempting block-specific operations.

Input

void

Output

string[]
const productIds = window.Measura.getRegisteredProductIds();

if (productIds.includes("9904458072362")) {
  // Safe point to coordinate with the mounted block.
}

window.Measura.addEventListener(eventName, callback, options?)

Subscribe to block runtime events such as Measura-managed variant changes.

Availability

  • Only available when at least one Measura product block has been rendered and initialized.

Purpose

  • Subscribe to events emitted by the Measura block runtime.
  • React to Measura-managed state changes from theme code without polling block state.

Input

eventName: string
callback: (detail: unknown) => void
options?: { productId?: string | number }

Output

void

Listener lifecycle

Keep a stable callback reference if you also plan to remove the listener later with removeEventListener.

window.Measura.removeEventListener(eventName, callback, options?)

Unsubscribe a previously registered block runtime event listener.

Availability

  • Only available when at least one Measura product block has been rendered and initialized.

Purpose

  • Remove a previously registered event listener from the Measura block runtime.
  • Prevent duplicate event handling and clean up listeners when theme UI is torn down or replaced.

Input

eventName: string
callback: (detail: unknown) => void
options?: { productId?: string | number }

Output

void
function handleMeasuraEvent(event) {
  console.log(event);
}

window.Measura.addEventListener("your-event-name", handleMeasuraEvent);

// Later:
window.Measura.removeEventListener("your-event-name", handleMeasuraEvent);