CLS (Performance Impact) Updated Code - [Desktop + Mobile]

Below is the latest version of the code developed by our Tech team to ensure optimal CLS performance and improved site speed. This version has been tested and has been in use since January 26.

There are two versions of this code available:

• One addressing CLS issues on mobile only

• One addressing CLS issues on both mobile and desktop

This version is for mobile and desktop. If you require the mobile-only version, please click here.

Instruction: Replace the highlighted section of the code with the respective client’s CDN code.

// --- 0. Device detection ---
var mediaQuery = "screen and (max-width: 992px) and (pointer: coarse)";
var getDeviceType = function getDeviceType() {
  return window.matchMedia(mediaQuery).matches ? "mobile" : "desktop";
};
// --- 1. CSS to hide widget until interaction ---
var style = document.createElement("style");
style.textContent = "\n  body.chat-hidden #chat-widget-container {\n    display: none !important;\n    pointer-events: none !important;\n    z-index: -1 !important;\n  }\n";
document.head.appendChild(style);
// --- 2. Load LiveChat script ---
function loadCvChatScript() {
  var s = document.createElement("script");
  s.src = "https://cht-srvc.net/api/lc.js?client=cv_commversion";
  s.async = true;
  document.body.appendChild(s);
  console.log("LiveChat script loaded");
}
// --- 3. Initialize LiveChat widget ---
function initializeLiveChat() {
  var attempts = 0;
  var maxAttempts = 7;
  var retryDelay = 300;
  var _tryInit = function tryInit() {
    if (typeof LiveChatWidget === "undefined" || window.__lc_inited) {
      if (attempts < maxAttempts) {
        attempts++;
        setTimeout(_tryInit, retryDelay);
      } else {
        console.error("Failed to initialize LiveChat script");
      }
    } else {
      LiveChatWidget.init();
      LiveChatWidget.on("ready", function () {
        var LC_chat_status = LiveChatWidget.get("customer_data");
        if ((LC_chat_status === null || LC_chat_status === void 0 ? void 0 : LC_chat_status.status) === "chatting" || (LC_chat_status === null || LC_chat_status === void 0 ? void 0 : LC_chat_status.status) === "queued") {
          document.body.classList.remove("chat-hidden");
        }
      });
    }
  };
  _tryInit();
}
// --- 4. Hide chat by default (for mobile only) ---
function setInitialState() {
  document.body.classList.add("chat-hidden");
}
// --- 5. Show chat when user interacts ---
function markUserInteraction() {
  setTimeout(function () {
    document.body.classList.remove("chat-hidden");
    console.log("Chat widget visible after interaction");
  }, 100);
}
// --- 6. Setup ---
window.__lc = window.__lc || {};
Object.assign(window.__lc, {
  asyncInit: true
});

setInitialState();
loadCvChatScript();
initializeLiveChat();
// Listen for first user interaction
["click", "keydown", "scroll", "touchstart"].forEach(function (evt) {
  return window.addEventListener(evt, markUserInteraction, {
    once: true
  });
});