Beauty Affairs HK

JavaScript globals

Everything the theme puts on window, where it comes from, and what reads it.

src/@types/global.ts declares these types. People write and update those declarations by hand, and nothing checks them against Liquid, so treat them as documentation, not a guarantee. See Liquid to JavaScript contract.

window.theme

KeyWritten byConsumed by
pageTypelayout/theme.liquidPage-specific branching
moneyFormat, moneyWithCurrencyFormat, shopCurrencylayout/theme.liquidformatMoney and shopifyFormatCurrency in src/entrypoints/utils.ts
productImageSize, searchModelayout/theme.liquidPrestige code
showPageTransition, showElementStaggering, showImageZoominglayout/theme.liquidPrestige animation code
labelslayout/theme.liquidTranslated strings across components
labels.medispalayout/theme.liquidRemaining balance wording in the cart
gift_productlayout/theme.liquidsrc/components/purchase-gift-manager/
cartRewardBannerlayout/theme.liquidsrc/components/cart-reward-banner/
medispaCalendarConfigsnippets/medispa-calendar-config.liquidsrc/components/medispa-calendar/
popupManagerConfigsnippets/popup-logic.liquidNo script reads it. It exists only when the popup manager is enabled
needHelpPopupsections/need-help-popup.liquidThe need-help popup definition
packOptionssnippets/pack-options-config.liquidsrc/entrypoints/pack-options.ts
plpSegmentationTilessections/plp-segmentation-tiles.liquidCollection page tiles
selectOptionsModalConfigsections/select-options-modal.liquidsrc/entrypoints/select-options-modal.ts

After the base object, the snippets that add keys run in no fixed order. Each one creates its key only if it is missing, with window.theme.x = window.theme.x || {}. Several keys are optional in the type because only some templates render the snippet that adds them.

Two implementations of deferJS

Each of the three layouts defines window.deferJS inline, for Liquid and older scripts. src/components/utils/defer.ts exports its own defer and deferJS, and bundled TypeScript imports those instead of reading the global. The two are separate implementations, and changing one does not change the other.

Globals the theme defines

GlobalDefined inPurpose
enableLogging(value?)src/lib/logger.tsTurn console output on. '*' or a comma-separated namespace list
disableLogging()src/lib/logger.tsTurn console output off
deferJS(fn, condition)layout/theme.liquid and its two siblings, inlineRun a function once a condition holds. Defined in all three layouts
addCheckoutEventChain(fn)src/entrypoints/mini-cart/internals/checkout-chain.tsRegister a checkout step. Returns false with no footer element
PopupMonitorsrc/components/popup-logic/index.tsThe class, exposed for debugging
popupMonitorsrc/entrypoints/popup-logic.tsThe live instance
popupTimersrc/entrypoints/popup-logic.tsThe 15-second popup timer
klaviyoSniffer, customSniffersrc/entrypoints/popup-logic.tsDOM watchers for popups
PurchaseGiftManagersrc/components/purchase-gift-manager/Automatic gift handling
selectOptionsHandlersrc/entrypoints/select-options-modal.tsOpens the quick add modal
miniCartGiftsConfigLiquidGift definitions for the drawer
Medispa.carouselsMedispa sectionsCarousel instances

Globals owned by others

The theme reads these but does not create them. Any of them can be absent.

GlobalOwnerNotes
ShopifyShopifyEvery cart and section URL uses Shopify.routes.root
SesamiSDKSesamiThe booking calendar waits for it and never times out
SwiperSwiper libraryCarousels
jQueryOlder app scriptsStill loaded, and some older snippets still use it
SentryDeclared onlyTyped in global.ts, but nothing in the theme initialises it. Assume no error reporting
tbyb, TryWithMirraTry before you buy integrations
offerPopupConfigLiquidRead by src/entrypoints/klaviyo-popup-trigger.ts
_klOnsiteKlaviyoThe popup adapters and the collection page script push openForm commands to it

The logger

The logger is off by default, and nothing reaches the console until a developer turns it on.

window.enableLogging('*'); // everything
window.enableLogging('cart,popup-logic'); // named namespaces
window.disableLogging();

It also reads a query parameter and saves the value to localStorage under BA_DEBUG:

?ba_debug=*
?ba_debug=cart,popup-logic

Each createLogger('name') call defines a namespace. Search src/ for createLogger to list them. The logger also patches the global console, so the same switch hides direct console.log calls in older code.

The comment block at the top of src/lib/logger.ts names the helpers baDebugEnable and baDebugDisable. Those functions do not exist. The code at the bottom of the file assigns enableLogging and disableLogging, and those are the ones to use.

On this page