TURBO for Developers

Home > widget-integration > CountdownTimerController > connect

CountdownTimerController.connect() method

Initialize the countdown timer on the given DOM element.

Fetches the active campaign via the API, then starts the render/tick loop. Hides the element if the API call fails or no campaign matches.

Signature:

connect(element: HTMLElement, scopeOverride?: CountdownPlacement): Promise<void>;

Parameters

Parameter	Type	Description
element	HTMLElement	The container element provided by the TAE block system. The timer will be rendered as children of this element.
scopeOverride	CountdownPlacement	(Optional) Optional explicit placement scope. When provided, bypasses the automatic page-type detection. Used by cart drawer integration where the timer scope is independent of the current page.

Returns:

Promise<void>

Resolves once the timer is rendered and ticking, or immediately if the API call fails or no matching campaign is found.

Example

Override to defer connection until the element is visible:

async connect(element, scopeOverride) {
  await new Promise(resolve => {
    const observer = new IntersectionObserver(([entry]) => {
      if (entry.isIntersecting) { observer.disconnect(); resolve(undefined); }
    });
    observer.observe(element);
  });
  return super.connect(element, scopeOverride);
}