@analitikisler/ai-tag-debugger 0.20.1 → 0.22.0

package/src/consent.js

@@ -1,10 +1,19 @@
-// Consent scenarios: the start page opened in a fresh browser once per consent choice
-// (accept all, reject all, analytics only), to show which tags each choice lets through.
+// Consent scenarios: the start page opened like an ad click in a fresh browser once per consent choice (no choice
+// and on to the next page, accept all, reject all, analytics only), to show side by side which tags each choice lets
+// through and what they carry: the consent on the first hit, the campaign parameters, the client id, the cookies.
 // Runs on its own with every audit when the page shows a consent banner.
 import { AuditSession, CMP_BANNER_SELECTORS } from "./browser.js";
 import { runPool } from "./pool.js";
+import { CONSENT_SIGNALS, providerLabel } from "./parsers.js";
+import { TRACKING_COOKIE } from "./checks.js";
+import { campaignParamsIn, withCampaignParams } from "./campaign.js";
 
 export const CONSENT_STATES = ["accept", "reject", "analytics"];
+// The visitor who leaves the banner unanswered and opens the next page. Browsing on is no consent under the GDPR or
+// KVKK, so a tag that sends with cookies then is as wrong as after "reject all".
+export const IGNORE = "ignore";
+/** The scenario columns, in the order the reports show them. */
+export const SCENARIO_COLUMNS = ["before", IGNORE, ...CONSENT_STATES];
 // Tags that are advertising, so an "analytics only" choice should keep them quiet.
 export const AD_PLATFORMS = new Set(["google_ads", "meta", "tiktok", "pinterest", "snapchat", "x"]);
 
@@ -14,19 +23,61 @@ const applyInPage = ({ state, selectors }) => {
   const w = window;
   try {
     if (w.OneTrust?.AllowAll) {
+      // Analytics only turns on the group OneTrust's Consent Mode setting gives analytics_storage (sites number their
+      // groups as they like), or C0002, the usual performance group, without one; not when ads share that group.
+      const gc = w.OneTrust.GetDomainData?.()?.GoogleConsent;
+      const analytics = gc?.GCEnable && gc.GCAnalyticsStorage ? String(gc.GCAnalyticsStorage) : "C0002";
+      if (state === "analytics" && gc?.GCEnable && analytics === String(gc.GCAdStorage)) return null;
       if (state === "accept") w.OneTrust.AllowAll();
       else {
         w.OneTrust.RejectAll();
-        // C0002 is OneTrust's performance (analytics) group.
-        if (state === "analytics") w.OneTrust.UpdateConsent?.("Category", "C0002:1");
+        if (state === "analytics") w.OneTrust.UpdateConsent?.("Category", `${analytics}:1`);
       }
       return "OneTrust";
     }
-    if (w.Cookiebot?.submitCustomConsent) {
+    // Cookiebot's newer script names its object CookieConsent only.
+    const cookiebot = w.Cookiebot ?? w.CookieConsent;
+    if (cookiebot?.submitCustomConsent) {
       // preferences, statistics, marketing
-      w.Cookiebot.submitCustomConsent(state === "accept", state !== "reject", state === "accept");
+      cookiebot.submitCustomConsent(state === "accept", state !== "reject", state === "accept");
       return "Cookiebot";
     }
+    // CookieYes has no public choice function, but its buttons and preference center switches carry fixed names.
+    if (w.cookieyes?._ckyStore) {
+      const tag = (name) => document.querySelector(`[data-cky-tag="${name}"]`);
+      if (state === "accept" || state === "reject") {
+        const button = tag(`${state}-button`);
+        if (button) {
+          button.click();
+          return "CookieYes";
+        }
+      } else {
+        tag("settings-button")?.click();
+        const switches = [...document.querySelectorAll('input[id^="ckySwitch"]')];
+        const save = tag("detail-save-button");
+        if (switches.length && save) {
+          for (const box of switches) if (box.checked !== (box.id === "ckySwitchanalytics")) box.click();
+          save.click();
+          return "CookieYes";
+        }
+        return null;
+      }
+    }
+    const efilli = w.efilliSdk?.consentManager;
+    if (efilli?.acceptAll) {
+      if (state === "accept") efilli.acceptAll();
+      else if (state === "reject") efilli.rejectAll();
+      else {
+        // Analytics only: the category Efilli's own Consent Mode mapping gives analytics_storage, when that mapping is
+        // the one in force and puts ads elsewhere. With Consent Mode run from a GTM template instead, it can't be known.
+        const mode = w.efilliSdk.configManager?.getLanguage?.()?.consentMode;
+        const analytics = mode?.active ? mode.mapping?.analytics_storage : null;
+        if (!analytics || analytics === mode.mapping?.ad_storage) return null;
+        for (const category of Object.keys(efilli.getCategories?.() ?? {})) efilli.setCategoryConsent(category, category === "essential" || category === analytics);
+        efilli.saveConsent();
+      }
+      return "Efilli";
+    }
     if (state !== "analytics") {
       if (w.UC_UI?.acceptAllConsents) {
         state === "accept" ? w.UC_UI.acceptAllConsents() : w.UC_UI.denyAllConsents();
@@ -43,9 +94,12 @@ const applyInPage = ({ state, selectors }) => {
   if (state === "analytics") return null;
   const words = state === "accept"
     ? /^(accept|allow|agree|ok|got it|kabul|tümünü kabul|izin ver|onayla|alle akzeptieren|tout accepter)/i
-    : /^(reject|decline|deny|refuse|necessary only|only necessary|reddet|kabul etme|ablehnen|tout refuser)/i;
+    : /^(reject|decline|deny|refuse|necessary only|only necessary|reddet|tümünü reddet|kabul etme|ablehnen|tout refuser)/i;
   const visible = (el) => !!(el.offsetWidth || el.offsetHeight || el.getClientRects().length);
-  const banners = [...document.querySelectorAll(selectors)].filter(visible);
+  // Banners drawn inside open shadow roots (Efilli's) count too.
+  const roots = [document];
+  for (let i = 0; i < roots.length; i++) for (const n of roots[i].querySelectorAll("*")) if (n.shadowRoot) roots.push(n.shadowRoot);
+  const banners = roots.flatMap((r) => [...r.querySelectorAll(selectors)]).filter(visible);
   for (const n of document.querySelectorAll("body *")) {
     const label = `${n.id} ${typeof n.className === "string" ? n.className : ""}`;
     if (/(cookie|consent|gdpr|kvkk)/i.test(label) && visible(n) && !banners.some((b) => b.contains(n))) banners.push(n);
@@ -62,9 +116,10 @@ const applyInPage = ({ state, selectors }) => {
   return null;
 };
 
-// A Google hit that says storage is denied is a cookieless Consent Mode ping, which a "no" allows.
-const cookieless = (h) => !!h.consent && h.consent.ad_storage !== "granted" && h.consent.analytics_storage !== "granted";
-const isAnalyticsOnlyOk = (h) => !!h.consent && h.consent.ad_storage !== "granted";
+// A Google hit that says every tracking signal is denied is a cookieless Consent Mode ping, which a "no"
+// allows; after "analytics only" the ad signals must be denied.
+const cookieless = (h) => !!h.consent && CONSENT_SIGNALS.every((k) => h.consent[k] !== "granted");
+const isAnalyticsOnlyOk = (h) => !!h.consent && CONSENT_SIGNALS.filter((k) => k !== "analytics_storage").every((k) => h.consent[k] !== "granted");
 
 /** Hits per platform and event: { n, quiet } where quiet counts the ones sent with storage denied. */
 const countBy = (hits) => {
@@ -78,26 +133,83 @@ const countBy = (hits) => {
   return out;
 };
 
-/** Opens the start page, makes one consent choice, opens the page again, and returns the hits before and after. */
+const GOOGLE = new Set(["ga4", "google_ads"]);
+
+/**
+ * What one scenario shows beyond the hit counts, from the steps from..to of its own browser: the first Google hit
+ * with its consent and the campaign parameters its page address kept or lost, the GA4 client id on it and in _ga,
+ * whether _gcl_aw holds the landing gclid, the cookies added, how long after the steps began each provider was
+ * first called, and the Google tag's own consent state at the end.
+ */
+function factsOf(session, from, to, landing) {
+  const inRange = (step) => step >= from && step <= to;
+  const google = session.hits.filter((h) => inRange(h.step) && GOOGLE.has(h.platform)).sort((a, b) => a.t - b.t);
+  const first = google.find((h) => h.platform === "ga4") ?? google[0] ?? null;
+  const sent = campaignParamsIn(landing);
+  let campaign = null;
+  if (first?.params?.page_location && Object.keys(sent).length) {
+    const got = campaignParamsIn(first.params.page_location);
+    const names = Object.keys(sent);
+    campaign = { kept: names.filter((n) => got[n] === sent[n]), lost: names.filter((n) => got[n] !== sent[n]) };
+  }
+  const identity = session.steps.filter((st) => inRange(st.index)).map((st) => st.identity).filter(Boolean).at(-1) ?? null;
+  const tag = session.steps.filter((st) => st.index <= to).map((st) => st.tagConsent).filter(Boolean).at(-1) ?? null;
+  const startedAt = session.steps[from]?.t ?? null;
+  const loaded = {};
+  for (const c of session.network) {
+    if (!inRange(c.step) || !c.provider || c.provider in loaded || startedAt === null) continue;
+    loaded[c.provider] = Math.max(0, c.t - startedAt);
+  }
+  return {
+    firstHit: first ? { platform: first.platform, event: first.name, ...(first.consent ? { consent: first.consent } : {}) } : null,
+    campaign,
+    clientId: first?.protocol?.cid ?? null,
+    cookieClientId: identity?.ga_client_id ?? null,
+    gclAw: identity?.gcl_aw ?? null,
+    cookies: [...new Set(session.cookieChanges.filter((c) => inRange(c.step) && c.change === "added").map((c) => c.name))],
+    loaded,
+    tagConsent: tag ? Object.fromEntries(Object.entries(tag.entries).map(([k, e]) => [k, e.update ?? e.default ?? null])) : null,
+  };
+}
+
+/** Where the scenarios start: the start page opened like an ad click (test campaign parameters, or the caller's own), or as it is. */
+export function scenarioLanding(config, campaign) {
+  if (campaign === false || (campaign === undefined && config.campaign_checks === false)) return config.site;
+  return withCampaignParams(config.site, campaign && typeof campaign === "object" ? campaign : null);
+}
+
+/**
+ * Opens the start page, makes one consent choice (none for IGNORE), opens the page again, and returns the hits
+ * before and after the choice with the facts of each part.
+ */
 async function runState(config, state, opts) {
   const session = new AuditSession({
     viewport: "desktop", site: config.site, allowedHosts: config.allowed_hosts, providers: config.providers,
-    blockHits: config.block_hits !== false, headless: !opts.headed,
+    blockHits: config.block_hits !== false, headless: !opts.headed, ...(opts.blockPrivate ? { blockPrivate: opts.blockPrivate } : {}),
   });
+  const landing = scenarioLanding(config, opts.campaign);
   try {
     await session.start();
-    const startError = await session.act({ action: "goto", url: config.site, reason: "Open the start page" });
+    const startError = await session.act({ action: "goto", url: landing, reason: "Open the start page" });
     if (startError) return { state, error: startError };
     session.beginStep(`Choose: ${state}`);
-    const via = await session.page.evaluate(applyInPage, { state, selectors: CMP_BANNER_SELECTORS }).catch(() => null);
-    if (!via) return { state, via: null, before: countBy(session.hits) };
+    const via = state === IGNORE ? "none" : await session.page.evaluate(applyInPage, { state, selectors: CMP_BANNER_SELECTORS }).catch(() => null);
+    if (!via) return { state, via: null, landing, before: countBy(session.hits), beforeFacts: factsOf(session, 0, session.currentStep, landing) };
     await session.settle();
+    await session.observe();
     session.beginStep("Open the start page again");
     await session.page.reload().catch(() => {});
     await session.settle();
+    await session.observe();
     const choice = session.steps.find((s) => s.label.startsWith("Choose:")).index;
+    const beforeFacts = factsOf(session, 0, choice - 1, landing);
+    // What a choice leads to is what the next page sends: a hit fired by the click itself can go out before the
+    // consent update applies. The cookies count from the click on. The client id this same visitor had before
+    // choosing tells a kept id from a new one.
+    const last = session.currentStep;
+    const facts = { ...factsOf(session, last, last, landing), cookies: factsOf(session, choice, last, landing).cookies, clientIdBefore: beforeFacts.clientId };
     return {
-      state, via,
+      state, via, landing, beforeFacts, facts,
       before: countBy(session.hits.filter((h) => h.step < choice)),
       after: countBy(session.hits.filter((h) => h.step >= choice)),
     };
@@ -112,7 +224,9 @@ async function runState(config, state, opts) {
  * Runs every consent scenario on the site's start page. Returns null when the page has no consent
  * banner the tool can answer (the first choice found nothing to click), so the report leaves the section out.
  * opts.concurrency runs the other choices side by side, each in its own browser; default 1.
- * @returns {Promise<null | { cmp: string, before: object, states: Record<string, { via: string|null, after?: object, error?: string }> }>}
+ * opts.campaign: the campaign parameters to open the start page with, or false for none (see scenarioLanding).
+ * opts.blockPrivate: as for AuditSession, for an MCP server reachable over HTTP.
+ * @returns {Promise<null | { cmp: string, landing: string, before: object, beforeFacts: object, states: Record<string, { via: string|null, after?: object, facts?: object, error?: string }> }>}
  */
 export async function runConsentScenarios(config, opts = {}) {
   const log = opts.log ?? (() => {});
@@ -120,19 +234,20 @@ export async function runConsentScenarios(config, opts = {}) {
   if (!first.via) return null;
   log(`\n▶ consent scenarios (${first.via})`);
   // The first choice shows whether there is a banner to answer at all; the others don't depend on each other.
-  const results = [first, ...(await runPool(CONSENT_STATES.slice(1), opts.concurrency ?? 1, (state) => runState(config, state, opts)))];
+  const results = [first, ...(await runPool([IGNORE, ...CONSENT_STATES.slice(1)], opts.concurrency ?? 1, (state) => runState(config, state, opts)))];
   const states = {};
-  for (const r of results) {
-    states[r.state] = r.error ? { via: null, error: r.error } : { via: r.via, ...(r.after ? { after: r.after } : {}) };
-    log(`  ${r.state}: ${r.error ? `✗ ${r.error}` : r.via ? `${Object.values(r.after ?? {}).reduce((s, e) => s + Object.values(e).reduce((a, b) => a + b.n, 0), 0)} tracking hits` : "not supported here"}`);
+  for (const state of [IGNORE, ...CONSENT_STATES]) {
+    const r = results.find((x) => x.state === state);
+    states[state] = r.error ? { via: null, error: r.error } : { via: r.via, ...(r.after ? { after: r.after } : {}), ...(r.facts ? { facts: r.facts } : {}) };
+    log(`  ${state}: ${r.error ? `✗ ${r.error}` : r.via ? `${Object.values(r.after ?? {}).reduce((s, e) => s + Object.values(e).reduce((a, b) => a + b.n, 0), 0)} tracking hits` : "not supported here"}`);
   }
-  return { cmp: first.via, before: first.before, states };
+  return { cmp: first.via, landing: first.landing, before: first.before, beforeFacts: first.beforeFacts, states };
 }
 
 /**
  * The per-state tag table: one row per platform and event, one cell per state (hit count, or null when
  * the state did not run). A cell is a problem when a tag sent hits a choice should have kept quiet:
- * anything after "reject all" except cookieless Consent Mode pings, and ad tags after "analytics only"
+ * anything after "reject all" or no choice except cookieless Consent Mode pings, and ad tags after "analytics only"
  * unless they were sent with ad storage denied.
  */
 export function consentTable(scenarios) {
@@ -140,17 +255,76 @@ export function consentTable(scenarios) {
   const add = (counts) => Object.entries(counts ?? {}).forEach(([p, events]) => Object.keys(events).forEach((e) => keys.add(`${p}\u0000${e}`)));
   add(scenarios.before);
   for (const s of Object.values(scenarios.states)) add(s.after);
-  const cols = ["before", ...CONSENT_STATES];
+  // Captures from before the no-choice scenario existed have no column for it.
+  const cols = SCENARIO_COLUMNS.filter((col) => col !== IGNORE || scenarios.states?.[IGNORE]);
   const rows = [...keys].sort().map((k) => {
     const [platform, event] = k.split("\u0000");
     const cells = cols.map((col) => {
       const s = col === "before" ? { after: scenarios.before } : scenarios.states[col];
       if (!s?.after) return { state: col, count: null, problem: false };
       const c = s.after[platform]?.[event] ?? { n: 0, cookieless: 0, adDenied: 0 };
-      const problem = (col === "reject" && c.n > c.cookieless) || (col === "analytics" && AD_PLATFORMS.has(platform) && c.n > c.adDenied);
+      const problem = ((col === "reject" || col === IGNORE) && c.n > c.cookieless) || (col === "analytics" && AD_PLATFORMS.has(platform) && c.n > c.adDenied);
       return { state: col, count: c.n, problem };
     });
     return { platform, event, cells };
   });
   return { cols, rows };
 }
+
+/**
+ * The consent matrix: one row per fact, one cell per scenario column, from the facts each scenario recorded.
+ * Every cell is { text, problem }, where problem marks what should not happen with that choice: tracking cookies
+ * set before a choice, without one or after "reject all", a client id that changes when the visitor accepts, and a
+ * UTM parameter lost from the first hit. Null for captures from before the scenarios recorded facts.
+ * @returns {null | { landing: string|null, cols: string[], rows: { key: string, label: string, cells: { text: string, problem: boolean }[] }[] }}
+ */
+export function consentMatrix(m, scenarios) {
+  const t = m.ui.matrix;
+  const factsFor = (col) => (col === "before" ? scenarios.beforeFacts : scenarios.states?.[col]?.facts) ?? null;
+  const cols = SCENARIO_COLUMNS.filter((col) => col === "before" || scenarios.states?.[col]);
+  if (!cols.some(factsFor)) return null;
+  const signals = (c) => CONSENT_SIGNALS.filter((k) => c?.[k]).map((k) => `${t.signals[k]} ${c[k] === "granted" ? "✓" : c[k] === "denied" ? "✗" : "?"}`).join(" ");
+  // No choice yet, no choice and on, and "reject all" may not leave tracking cookies; accepting must not lose the visitor.
+  const strict = (col) => col === "before" || col === IGNORE || col === "reject";
+  const cell = (text, problem = false) => ({ text, problem });
+  const clientId = (f, col) => {
+    if (col === "before") return cell(f.cookieClientId ? t.cid.cookie : f.clientId ? t.cid.cookieless : t.cid.none, Boolean(f.cookieClientId));
+    const after = f.cookieClientId ?? f.clientId;
+    if (!after) return cell(t.cid.none);
+    if (!f.clientIdBefore) return cell(t.cid.new);
+    if (after === f.clientIdBefore) return cell(t.cid.kept);
+    // Without a cookie every page load gets a new id, which is what declining asks for.
+    return cell(t.cid.changed, !strict(col) && Boolean(f.cookieClientId));
+  };
+  const rows = {
+    firstHit: (f) => cell(f.firstHit ? `${f.firstHit.event}${f.firstHit.consent ? ` · ${signals(f.firstHit.consent)}` : ""}` : t.none),
+    campaign: (f) => (!f.campaign ? cell(t.notRun) : f.campaign.lost.length
+      ? cell(t.lost(f.campaign.lost), f.campaign.lost.some((n) => n.startsWith("utm_")) || f.firstHit?.consent?.ad_storage === "granted")
+      : cell(t.kept)),
+    clientId,
+    gclAw: (f) => cell(t.gcl[f.gclAw ?? "none"]),
+    cookies: (f, col) => cell(t.cookies(f.cookies.length, f.cookies.slice(0, 10)), strict(col) && f.cookies.some((n) => TRACKING_COOKIE.test(n))),
+    loaded: (f) => cell(Object.entries(f.loaded).sort((a, b) => a[1] - b[1]).slice(0, 8).map(([p, ms]) => `${providerLabel(p)} ${t.ms(ms)}`).join(" · ") || t.none),
+    tagConsent: (f) => cell(f.tagConsent ? signals(f.tagConsent) || t.none : t.notRun),
+  };
+  return {
+    landing: scenarios.landing ?? null,
+    cols,
+    rows: Object.entries(rows).map(([key, fn]) => ({ key, label: t.rows[key], cells: cols.map((col) => (factsFor(col) ? fn(factsFor(col), col) : cell(t.notRun))) })),
+  };
+}
+
+/** The consent matrix as a Markdown table with its legend, for report.md and MCP. */
+export function consentMatrixMarkdown(m, scenarios) {
+  const matrix = consentMatrix(m, scenarios);
+  if (!matrix) return [];
+  const esc = (x) => String(x).replace(/\|/g, "\\|");
+  return [
+    ...(matrix.landing ? [m.ui.matrix.intro(matrix.landing), ""] : []),
+    `| | ${matrix.cols.map((c) => m.ui.scenarioCols[c]).join(" | ")} |`,
+    `|${" --- |".repeat(matrix.cols.length + 1)}`,
+    ...matrix.rows.map((r) => `| ${r.label} | ${r.cells.map((c) => `${esc(c.text)}${c.problem ? " ⚠" : ""}`).join(" | ")} |`),
+    "",
+    m.ui.matrix.legend,
+  ];
+}

package/src/containers.js

@@ -0,0 +1,163 @@
+// How each Google container got onto the page: GTM (gtm.js) and Google tag (gtag/js) scripts, with what
+// inserted them. The browser records every container script as it is added (see CONTAINER_HOOK in browser.js):
+// parser-inserted from the HTML, or set by a script, with the scripts on the call stack at that moment. This
+// module turns that into a load source: the snippet, a script tag in the HTML, another script on the page,
+// a tag or Zone in another container, or a gtag config or send_to command the Google tag acted on.
+
+// Container and destination IDs gtm.js and gtag/js are loaded with.
+const CONTAINER_ID = /^(GTM|G|GT|AW|DC|MC|HA)-[A-Z0-9]+$/;
+
+/**
+ * The container a script URL loads, or null: its ID, gtm or gtag, the dataLayer it reads (`l`), the host it
+ * came from (Google's, or the site's own through the Google tag gateway or a server container) and the GTM
+ * environment when one is named (`gtm_preview`). gtm_auth, the environment's token, is never kept.
+ */
+export function containerOf(url) {
+  let u;
+  try { u = new URL(url); } catch { return null; }
+  if (!/^https?:$/.test(u.protocol)) return null;
+  const id = (u.searchParams.get("id") ?? "").toUpperCase();
+  if (!CONTAINER_ID.test(id)) return null;
+  const script = /\/gtm\.js$/.test(u.pathname) ? "gtm" : /\/gtag\/js$/.test(u.pathname) ? "gtag" : null;
+  if (!script) return null;
+  const environment = u.searchParams.get("gtm_preview") || (u.searchParams.has("gtm_auth") ? "unnamed" : null);
+  return {
+    id,
+    script,
+    layer: u.searchParams.get("l") || "dataLayer",
+    host: u.hostname,
+    served: /(^|\.)googletagmanager\.com$/.test(u.hostname) ? "google" : "site",
+    ...(environment ? { environment } : {}),
+  };
+}
+
+/** origin + path, so a caller's query string (which may carry user data) is never kept. */
+export function scriptPath(url) {
+  try {
+    const u = new URL(url);
+    return /^https?:$/.test(u.protocol) ? u.origin + u.pathname : null;
+  } catch {
+    return null;
+  }
+}
+
+/**
+ * The call stack the browser captured, as callers from the innermost out: { inline: true } for script in the
+ * page itself (the page's address, or "inline" for code injected without one) (the snippet, or a Custom HTML tag GTM injected), { container: id } for a container script and
+ * { script: url } for any other script. Repeats in a row are folded.
+ */
+export function callersOf(frames, documentUrl) {
+  const doc = String(documentUrl ?? "").split("#")[0];
+  const out = [];
+  for (const f of frames ?? []) {
+    const url = String(f).split("#")[0];
+    const c = containerOf(url);
+    const caller = url === doc || url === "inline" ? { inline: true } : c ? { container: c.id } : scriptPath(url) ? { script: scriptPath(url) } : null;
+    if (!caller) continue;
+    const last = out.at(-1);
+    if (last && JSON.stringify(last) === JSON.stringify(caller)) continue;
+    out.push(caller);
+  }
+  return out;
+}
+
+const pathOf = (href) => scriptPath(href);
+
+/** Whether a gtag command in the dataLayer names this ID: ["config", id] or ["event", name, { send_to }]. */
+function commandFor(load, pushes) {
+  const earlier = pushes.filter((e) => Array.isArray(e.value) && (e.t ?? 0) <= (load.t ?? Infinity) && (!load.page || pathOf(e.url) === load.page));
+  if (earlier.some((e) => e.value[0] === "config" && String(e.value[1]).toUpperCase() === load.id)) return "config";
+  const sendsTo = (e) => {
+    const to = e.value[0] === "event" ? e.value[2]?.send_to : undefined;
+    const list = Array.isArray(to) ? to : String(to ?? "").split(",");
+    return list.some((s) => String(s).trim().toUpperCase().split("/")[0] === load.id);
+  };
+  return earlier.some(sendsTo) ? "send_to" : null;
+}
+
+/**
+ * Where one recorded load came from, as { kind, by? }:
+ * - html: a script tag in the page's HTML (the gtag.js snippet, or gtm.js referenced directly)
+ * - inline: code in the page itself (the GTM snippet, or a hand-written loader)
+ * - script: another script on the page; by is its address (a consent platform, the site's bundle)
+ * - custom_html: a Custom HTML tag in the GTM container `by`
+ * - google_tag: a Google tag or template in the GTM container `by`, through GTM's load_google_tags
+ * - nested: GTM container `by` loaded another GTM container itself, as a Zone or a tag template does
+ * - config / send_to: a gtag('config') or an event's send_to naming the ID, acted on by `by`
+ * - destination: the Google tag `by` loaded it as one of its destinations, with no command in the page
+ */
+export function sourceOf(load, pushes = []) {
+  if (load.how === "parser") return { kind: "html" };
+  const callers = load.callers ?? [];
+  const at = callers.findIndex((c) => c.container && c.container !== load.id);
+  if (at >= 0) {
+    const by = callers[at].container;
+    const command = commandFor(load, pushes);
+    if (command) return { kind: command, by };
+    if (by.startsWith("GTM-")) {
+      // Code in the page between the call and the container is a Custom HTML tag the container injected.
+      if (callers.slice(0, at).some((c) => c.inline)) return { kind: "custom_html", by };
+      return { kind: load.id.startsWith("GTM-") ? "nested" : "google_tag", by };
+    }
+    return { kind: "destination", by };
+  }
+  const other = callers.find((c) => c.script);
+  if (other) return { kind: "script", by: other.script };
+  return { kind: "inline" };
+}
+
+/** A run's container loads with their sources, in the order they happened. Runs saved by older versions have none. */
+export function loadSources(run) {
+  const pushes = run.dataLayerLog ?? [];
+  return (run.containerLoads ?? []).map((load) => ({ ...load, ...sourceOf(load, pushes) }));
+}
+
+/**
+ * One row per container and source across runs, in the order first seen: { id, script, layer, served, host,
+ * environment?, kind, by?, pages, journeys }.
+ */
+export function containerRows(runs) {
+  const rows = new Map();
+  for (const run of runs) {
+    for (const l of loadSources(run)) {
+      const k = [l.id, l.kind, l.by ?? "", l.host, l.layer, l.environment ?? ""].join("|");
+      const row = rows.get(k) ?? {
+        id: l.id, script: l.script, layer: l.layer, served: l.served, host: l.host,
+        ...(l.environment ? { environment: l.environment } : {}), kind: l.kind, ...(l.by ? { by: l.by } : {}),
+        pages: new Set(), journeys: new Set(),
+      };
+      if (l.page) row.pages.add(l.page);
+      row.journeys.add(`${run.journeyId} (${run.viewport})`);
+      rows.set(k, row);
+    }
+  }
+  return [...rows.values()].map((r) => ({ ...r, pages: [...r.pages].sort(), journeys: [...r.journeys] }));
+}
+
+/** The containers loaded more than once into one page, as [{ id, loads }] with the loads in order. */
+export function duplicateLoads(run) {
+  const byDoc = new Map();
+  for (const l of loadSources(run)) {
+    const k = `${l.doc ?? l.page}|${l.id}`;
+    byDoc.set(k, [...(byDoc.get(k) ?? []), l]);
+  }
+  return [...byDoc.values()].filter((list) => list.length > 1).map((loads) => ({ id: loads[0].id, loads }));
+}
+
+/** Pages where containers read different dataLayers, as [{ page, step, layers: [{ id, layer }] }]. */
+export function splitLayers(run) {
+  const byDoc = new Map();
+  for (const l of loadSources(run)) {
+    // A destination a Google tag loaded reads that tag's dataLayer, whatever its own URL says.
+    if (["config", "send_to", "destination"].includes(l.kind)) continue;
+    const k = l.doc ?? l.page;
+    byDoc.set(k, [...(byDoc.get(k) ?? []), l]);
+  }
+  const out = [];
+  for (const loads of byDoc.values()) {
+    if (new Set(loads.map((l) => l.layer)).size < 2) continue;
+    const seen = new Map(loads.map((l) => [l.id, { id: l.id, layer: l.layer }]));
+    out.push({ page: loads[0].page, step: loads[0].step, layers: [...seen.values()] });
+  }
+  return out;
+}

package/src/help.js

@@ -102,6 +102,7 @@ Advanced:
   --host <addr>        HTTP host (default 127.0.0.1)
   --token <secret>     Secret URL path segment, at least 16 characters (default: random)
   --allow-private-network   Over HTTP, let audits open localhost and private addresses
+  --allow-live              Over HTTP, let start_audit send live (tracking requests reach the real accounts)
   --reports <dir>      Where finished audits write reports (default: ~/ai-tag-debugger-reports)
   --public-url <url>   The HTTPS address of your tunnel or host, so audits can link to reports`;
 

package/src/hit-params.js

@@ -0,0 +1,70 @@
+// The parameters a hit's request carried, split into the event's own and the session, device, page and
+// consent ones. Shared by the HTML report's hit cards and the MCP server's get_hit, so both show the same table.
+import { parseTrackingRequest } from "./parsers.js";
+import { isEventParam } from "./glossary.js";
+
+const cell = (v) => (v === null || v === undefined ? "" : typeof v === "object" ? JSON.stringify(v) : String(v));
+
+/** The network request that carried the hit. Identical hits (duplicates) are paired with identical requests in order. */
+export function callsForHit(run, hit) {
+  // A late hit was sent during a later step, so its request is recorded there.
+  const sentIn = hit.late?.during ?? hit.step;
+  const calls = (run.network ?? []).filter((c) => c.step === sentIn && c.url === hit.url);
+  const twins = run.hits.filter((h) => (h.late?.during ?? h.step) === sentIn && h.url === hit.url);
+  return twins.length > 1 && calls.length === twins.length ? [calls[twins.indexOf(hit)]] : calls;
+}
+
+/** Nested JSON as dotted keys (properties.value); arrays stay JSON text. */
+function flatten(obj, prefix = "", out = []) {
+  for (const [k, v] of Object.entries(obj ?? {})) {
+    const key = prefix ? `${prefix}.${k}` : k;
+    if (v && typeof v === "object" && !Array.isArray(v) && prefix.split(".").length < 3) flatten(v, key, out);
+    else out.push([key, cell(v)]);
+  }
+  return out;
+}
+
+/** The parameter sets a request carried: one per event in a GA4 batch (query plus each body line), the query plus a flattened JSON body, or just the query. */
+export function paramSets(call) {
+  let u;
+  try {
+    u = new URL(call.url);
+  } catch {
+    return [[]];
+  }
+  const query = [...u.searchParams];
+  const body = call.postData;
+  if (!body) return [query];
+  const trimmed = body.trim();
+  if (trimmed.startsWith("{")) {
+    try {
+      return [[...query, ...flatten(JSON.parse(trimmed))]];
+    } catch { /* not JSON, or cut at the size limit */ }
+  }
+  if (/^[^\s{]*=/.test(trimmed)) {
+    return trimmed.split("\n").filter(Boolean).map((line) => {
+      const merged = new Map(query);
+      for (const [k, v] of new URLSearchParams(line)) merged.set(k, v);
+      return [...merged];
+    });
+  }
+  return [query];
+}
+
+/**
+ * What a hit card shows as its parameters: the request's own parameter set (raw keys, with glossary tips), split
+ * into the event's parameters and the session, device, page and consent ones. A GA4 batch carries one set per
+ * event; the hit takes the set with its name. Without a captured request, the hit's parsed parameters.
+ */
+export function hitParams(run, hit) {
+  const call = callsForHit(run, hit)[0] ?? null;
+  if (!call) return { call, batch: null, event: Object.entries(hit.params ?? {}).filter(([k]) => !(k === "items" && hit.items?.length)).map(([k, v]) => [k, cell(v)]), context: [] };
+  const sets = paramSets(call);
+  let i = 0;
+  if (sets.length > 1) {
+    const names = (parseTrackingRequest(call.url, call.postData ?? null) ?? []).map((h) => h.name);
+    i = Math.max(0, names.indexOf(hit.name));
+  }
+  const entries = sets[i] ?? [];
+  return { call, batch: sets.length > 1 ? [i + 1, sets.length] : null, event: entries.filter(([k]) => isEventParam(k)), context: entries.filter(([k]) => !isEventParam(k)) };
+}