A/B Testing & Gradual Rollouts

window.addEventListener("remark:session-initialized", () => {
  // The session is initialized and ready
  // Safe to access control group data
  const isControlGroup = localStorage.getItem("isInRemarkABControlGroup");
  console.log("Control group status:", isControlGroup);
});

const isInControlGroup = localStorage.getItem("isInRemarkABControlGroup");

if (isInControlGroup === "true") {
  // User is in the control group (will NOT see Remark)
  console.log("Control group - Remark hidden");
} else if (isInControlGroup === "false") {
  // User is in the treatment group (will see Remark)
  console.log("Treatment group - Remark visible");
}

const leadId = localStorage.getItem("remark_lead");

if (leadId) {
  // Use this ID to track the same visitor in your analytics
  console.log("Remark Lead ID:", leadId);
}

window.addEventListener("remark:session-initialized", () => {
  const isInControlGroup = localStorage.getItem("isInRemarkABControlGroup");
  const leadId = localStorage.getItem("remark_lead");
  
  // Send A/B test group to Google Analytics
  if (typeof gtag !== "undefined") {
    gtag("event", "remark_ab_test", {
      event_category: "ab_testing",
      event_label: isInControlGroup === "true" ? "control" : "treatment",
      remark_lead_id: leadId,  // Include lead ID for tracking
      non_interaction: true
    });
    
    // Set as custom dimensions for all subsequent events
    gtag("set", "user_properties", {
      remark_ab_group: isInControlGroup === "true" ? "control" : "treatment",
      remark_lead: leadId
    });
  }
});

window.addEventListener("remark:session-initialized", () => {
  const isInControlGroup = localStorage.getItem("isInRemarkABControlGroup");
  const leadId = localStorage.getItem("remark_lead");
  
  if (typeof analytics !== "undefined") {
    analytics.track("Remark A/B Test Assigned", {
      group: isInControlGroup === "true" ? "control" : "treatment",
      remark_lead_id: leadId,
      timestamp: new Date().toISOString()
    });
    
    // Optionally set lead ID as user identifier for cross-session tracking
    if (leadId) {
      analytics.identify(leadId, {
        remark_ab_group: isInControlGroup === "true" ? "control" : "treatment"
      });
    }
  }
});

window.addEventListener("remark:session-initialized", () => {
  const isInControlGroup = localStorage.getItem("isInRemarkABControlGroup");
  const leadId = localStorage.getItem("remark_lead");
  
  // Send to your custom analytics endpoint
  fetch("https://your-analytics.com/api/track", {
    method: "POST",
    headers: { "Content-Type": "application/json" },
    body: JSON.stringify({
      event: "remark_ab_test_assigned",
      properties: {
        controlGroup: isInControlGroup === "true",
        leadId: leadId,
        timestamp: Date.now(),
        pageUrl: window.location.href
      }
    })
  });
});

https://yoursite.com?remark_open=true

# Track email campaign performance
https://yoursite.com?remark_open=true&utm_source=email&utm_campaign=ab_test

# Track demo link clicks
https://yoursite.com?remark_force_widget=true&remark_open=true&utm_source=demo&utm_medium=sales_deck

// Check if localStorage is being set correctly
console.log("Control Group Status:", localStorage.getItem("isInRemarkABControlGroup"));
console.log("Lead ID:", localStorage.getItem("remark_lead"));

// Verify both values are available for external tracking
const abTestData = {
  isControlGroup: localStorage.getItem("isInRemarkABControlGroup") === "true",
  leadId: localStorage.getItem("remark_lead")
};
console.log("A/B Test Data:", abTestData);

let sessionInitialized = false;

window.addEventListener("remark:session-initialized", () => {
  sessionInitialized = true;
  console.log("✓ Session initialized successfully");
});

// Check after a few seconds
setTimeout(() => {
  if (!sessionInitialized) {
    console.error("✗ Session did not initialize within 5 seconds");
  }
}, 5000);

https://yoursite.com?remark_force_widget=true&remark_open=true

https://yoursite.com?remark_force_widget=true&remark_open=true&utm_source=demo&utm_campaign=sales

// ✓ Good - wait for the session
window.addEventListener("remark:session-initialized", () => {
  const isControlGroup = localStorage.getItem("isInRemarkABControlGroup");
  // Use the data...
});

// ✗ Bad - might run before the session initializes
const isControlGroup = localStorage.getItem("isInRemarkABControlGroup");

window.addEventListener("remark:session-initialized", () => {
  const isControlGroup = localStorage.getItem("isInRemarkABControlGroup");
  
  if (isControlGroup === null) {
    console.warn("Control group status not yet available");
    return;
  }
  
  // Proceed with your logic...
});

window.addEventListener("remark:session-initialized", () => {
  try {
    // Your monitoring code
  } catch (e) {
    // Fail silently - don't break the user experience
    console.error("Monitoring error:", e);
  }
});

// ✓ Good - anonymous tracking
analytics.track("Remark A/B Test", {
  group: isControlGroup === "true" ? "control" : "treatment"
});

// ✗ Bad - avoid PII unless necessary
analytics.track("Remark A/B Test", {
  group: isControlGroup === "true" ? "control" : "treatment",
  email: userEmail,  // Avoid
  name: userName     // Avoid
});

console.log("Checking for Remark SDK...");
console.log("window.remark exists:", typeof window.remark !== "undefined");

setTimeout(() => {
  console.log(
    "Control group status:", 
    localStorage.getItem("isInRemarkABControlGroup")
  );
}, 3000);