@ecomconsult/consentkit 0.4.0 → 0.5.1

package/src/ck-core.js

@@ -77,6 +77,10 @@
     'nr-data.net': 'analytics',               // New Relic beacon
     'datadoghq.com': 'analytics',             // RUM
     'datadoghq-browser-agent.com': 'analytics',
+    // Cloudflare Web Analytics. Subdomain only, and deliberately NOT in
+    // INFRA_DB: the rest of Cloudflare's edge is infrastructure, but this one
+    // beacon is a measurement product (§8 names it by hand for that reason).
+    'static.cloudflareinsights.com': 'analytics',
 
     // --- marketing -----------------------------------------------------
     'connect.facebook.net': 'marketing',
@@ -119,7 +123,27 @@
     'jivosite.com': 'functional',
     'jivo.chat': 'functional',
     'tidio.co': 'functional',
-    'tidiochat.com': 'functional'
+    'tidiochat.com': 'functional',
+    // Searchanise — site search for e-commerce. The widget IS the search box,
+    // so a shop whose visitor declines functional loses the feature and nothing
+    // else; it is not measurement. The numbered API hosts are enumerated
+    // because matching here is plain suffix matching (see hostMatches) with no
+    // pattern form: searchserverapi1.com is not a subdomain of anything.
+    'searchanise.com': 'functional',
+    'searchserverapi.com': 'functional',
+    'searchserverapi1.com': 'functional',
+    'searchserverapi2.com': 'functional',
+    'searchserverapi3.com': 'functional',
+    // iuteCredit — a Moldovan consumer-credit calculator embedded on shop
+    // product pages. A third party the owner chose, offering a feature.
+    'iutecredit.md': 'functional',
+
+    // --- necessary -----------------------------------------------------
+    // recaptcha.net is Google's alternate reCAPTCHA domain, served for regions
+    // where google.com is unreachable. Unlike the two path-scoped Google hosts
+    // in PATH_DB, this domain hosts NOTHING but the captcha, so the whole host
+    // is the right scope.
+    'recaptcha.net': 'necessary'
   };
 
   // Runtime overrides fed in by ConsentKit._extendHostDb(map) — the SaaS
@@ -145,8 +169,20 @@
   //   tags never get the chance to see consent at all.
   //   gtag.js is the opposite case — a direct GA4/Ads install with no container
   //   in front of it — so it stays blocked by path.
+  //
+  // reCAPTCHA is the other reason this table exists. www.google.com and
+  // www.gstatic.com host it, and neither can be given a category as a WHOLE
+  // host — that would rule on every Google property at once. Path-scoping names
+  // the widget and nothing else. The category is 'necessary': a form gated
+  // behind a captcha is unusable without it, and allowed() lets 'necessary'
+  // through unconditionally, so this classifies the request for the report
+  // without ever blocking it. (Strict mode already passed these through via
+  // BASE_ALLOW_PATH; what this adds is a NAME, so the audit stops filing the
+  // captcha under «сторонние подключения без категории».)
   var PATH_DB = {
     '/gtag/js': 'analytics',            // googletagmanager.com/gtag/js?id=G-XXXX
+    'www.google.com/recaptcha/': 'necessary',
+    'www.gstatic.com/recaptcha/': 'necessary',
     '/trackers/ga.js': 'analytics',
     '/trackers/pixel.js': 'marketing',
     '/trackers/chat.js': 'functional'
@@ -215,7 +251,16 @@
     policyVersion: '1',
     language: 'auto',
     layout: { type: 'bar', position: 'bottom' },
-    theme: { accent: '#2B50D8', radius: '10px' },
+    // 0.5.0: radius/font/buttons are resolved in ck-ui.js, not defaulted here.
+    // A concrete default in this object would be merged into every config and
+    // would then shadow the UI's own defaults — which is exactly what happened
+    // to `radius: '10px'` before 0.5.0: it pinned the pre-reference geometry on
+    // every site whether or not the owner had ever set it.
+    theme: { accent: '#2B50D8' },
+    // 0.5.0 (SPEC V1.6 §2). `detailsAction` is deliberately absent rather than
+    // set: its default depends on whether policyUrl is present, and a merged
+    // concrete value here would make that URL-sensitive default unreachable.
+    texts: {},
     categories: {
       functional: { enabled: true },
       analytics: { enabled: true },
@@ -231,22 +276,82 @@
     cookieTable: []
   };
 
-  // Hosts strict mode never intercepts, even though they are third-party and
-  // unknown to HOST_DB. Two kinds only: asset CDNs that serve the site's own
-  // code, and things a page is broken or unusable without (payment, captcha).
-  // Deliberately short — everything else is the site owner's `blocking.allow`.
-  // Matched with the same suffix semantics as HOST_DB; the recaptcha entries
-  // are hosts because www.google.com/recaptcha and www.gstatic.com/recaptcha
-  // cannot be expressed host-wise without also allowing the whole of google.com,
-  // so they are handled by BASE_ALLOW_PATH below instead.
-  var BASE_ALLOW = [
+  // Infrastructure (§8) — NOT a consent category, a CLASS of host.
+  //
+  // These are the CDNs, static hosts and font services that site builders and
+  // hosting platforms serve a site's OWN markup, styles and scripts from. A
+  // Tilda page loads its own layout from tildacdn.com; a Wix page loads its own
+  // from parastorage.com. Reporting those to the site owner as «сторонние
+  // подключения без категории» is noise about something they cannot decide:
+  // there is no consent question to answer and no switch to flip. §8 exists to
+  // stop the audit spending the owner's attention on them.
+  //
+  // Two consequences, both of them the point:
+  //   - strict mode NEVER intercepts these (a builder's dynamic modules break
+  //     without their own CDN, and blocking them breaks the site, not a tracker);
+  //   - the scanner flags them `infra: true`, keeps them out of the summary and
+  //     never writes them to tracker_observations.
+  //
+  // Suffix-matched, exactly like HOST_DB. Membership here is not a claim that a
+  // host is harmless in general — it is a claim that it serves the site's own
+  // assets. Anything that MEASURES belongs in HOST_DB with a real category
+  // instead: static.cloudflareinsights.com is the worked example (§8 calls it
+  // out by name), and it sits above as `analytics` for that reason. Because
+  // categoryForUrl is consulted before the strict allowlist, a host in both
+  // places is classified, not waved through — so a bare `cloudflare.com` here
+  // would be a bug.
+  var INFRA_DB = [
+    // --- site builders and hosting platforms ---------------------------
+    'tildacdn.com',
+    'tildacdn.net',
+    'tilda.ws',
+    'static.wixstatic.com',
+    'parastorage.com',                     // Wix static assets
+    'cdn.shopify.com',
+    'squarespace-cdn.com',
+    'assets.website-files.com',            // Webflow
+    // --- general asset CDNs --------------------------------------------
     'cdn.jsdelivr.net',
     'unpkg.com',
     'cdnjs.cloudflare.com',
     'code.jquery.com',
+    'ajax.googleapis.com',
+    'ajax.aspnetcdn.com',                  // Microsoft Ajax CDN (jQuery, MVC)
+    'aspnetcdn.com',
+    'kxcdn.com',                           // KeyCDN tenants, e.g. *-ef84.kxcdn.com
+    'cloudfront.net',                      // AWS CloudFront distributions
+    'akamaihd.net',                        // Akamai
+    'fastly.net',
+    'b-cdn.net',                           // bunny.net
+    // --- fonts ----------------------------------------------------------
     'fonts.googleapis.com',
+    // gstatic.com whole: Google's static-asset domain. Its subdomains serve
+    // fonts (fonts.gstatic.com), the reCAPTCHA widget's own code
+    // (www.gstatic.com/recaptcha/) and ordinary images — assets a page is
+    // broken without, none of which measure a visitor. Nothing on it is a
+    // tracker: the Google properties that DO measure live on their own hosts
+    // (google-analytics.com, googletagmanager.com, doubleclick.net) and are
+    // classified there. fonts.gstatic.com is kept below it, redundant under
+    // suffix matching but named because §8 and the fixtures both refer to it.
+    'gstatic.com',
     'fonts.gstatic.com',
+    // --- captcha ---------------------------------------------------------
+    // A page whose form is gated behind a captcha is unusable without it. The
+    // Google-hosted halves are path-scoped in BASE_ALLOW_PATH below, since
+    // www.google.com and www.gstatic.com cannot be waved through wholesale.
     'hcaptcha.com',
+    // --- our own service -------------------------------------------------
+    // The consent tool must not report itself as an unnamed third party.
+    'consent.ecomconsult.net'
+  ];
+
+  // Hosts strict mode never intercepts that are NOT infrastructure: things a
+  // page is broken or unusable without, but which are somebody's product
+  // rather than the site's own asset delivery. Kept separate from INFRA_DB so
+  // that «инфраструктура» in a report means what §8 says it means — a payment
+  // form is a third party the owner chose, and calling it infrastructure would
+  // hide a real decision. Both lists feed strict mode identically.
+  var BASE_ALLOW = [
     'js.stripe.com',
     'pay.google.com',
     'checkout.creem.io'
@@ -254,6 +359,12 @@
 
   // Path-scoped members of the base allowlist: allowed only on this exact path
   // prefix, because the host at large is not something to wave through.
+  //
+  // §8 lists these two under infrastructure, and they are — but they cannot
+  // live in INFRA_DB, which is a flat list of suffix-matched HOSTS. Allowing
+  // `www.google.com` as a host would wave through every Google property, and
+  // `_isInfra(host)` has no path to test. So they stay here: strict mode treats
+  // them exactly as it treats INFRA_DB, and `_infra()` reports hosts only.
   var BASE_ALLOW_PATH = [
     { host: 'www.google.com', path: '/recaptcha' },
     { host: 'www.gstatic.com', path: '/recaptcha' }
@@ -760,7 +871,32 @@
     return !!r && r === pr;
   }
 
+  // Is this host infrastructure (§8)? Suffix-matched, like everything else.
+  //
+  // `ConsentKitDebugUrl` is resolved HERE rather than being baked into
+  // INFRA_DB, because it is a runtime window global a site sets to point the
+  // debug panel at its own mirror. Reading it at call time is the only way it
+  // can be covered at all; a snapshot taken when this file was evaluated would
+  // miss every page that sets it after the core loads.
+  function isInfraHost(host) {
+    if (!host) { return false; }
+    for (var i = 0; i < INFRA_DB.length; i++) {
+      if (hostMatches(host, INFRA_DB[i])) { return true; }
+    }
+    try {
+      var dbg = global.ConsentKitDebugUrl;
+      if (typeof dbg === 'string' && dbg) {
+        var dh = urlParts(dbg).host;
+        if (dh && dh === host) { return true; }
+      }
+    } catch (e) { /* noop */ }
+    return false;
+  }
+
   function baseAllowed(host, url) {
+    // §8: infrastructure is never intercepted by strict mode. Checked first —
+    // it is the larger list and the commoner case on a builder-hosted site.
+    if (isInfraHost(host)) { return true; }
     for (var i = 0; i < BASE_ALLOW.length; i++) {
       if (hostMatches(host, BASE_ALLOW[i])) { return true; }
     }
@@ -1325,7 +1461,7 @@
   // Public API
   // ---------------------------------------------------------------------------
   var ConsentKit = {
-    version: '0.4.0',
+    version: '0.5.1',
     config: config,
 
     init: function (userConfig) {
@@ -1400,7 +1536,11 @@
     },
 
     // The built-in strict-mode allowlist, exported for docs and tests so the
-    // list a site owner reads is the list the engine actually uses.
+    // list a site owner reads is the list the engine actually uses. Since 0.4.1
+    // that is INFRA_DB (§8) plus the payment/captcha set plus the path-scoped
+    // entries — everything baseAllowed() consults, in one list, because what a
+    // site owner needs to know is «what does strict mode let through», not how
+    // the engine files it internally.
     //
     // A GETTER, not a plain array: a plain property is evaluated once, and the
     // single array it produced would be handed to every caller — one
@@ -1408,7 +1548,48 @@
     // widen what strict mode lets through for the rest of the page load.
     // Each read returns a fresh copy, so the list is readable and inert.
     get _baseAllow() {
-      return BASE_ALLOW.slice().concat(BASE_ALLOW_PATH.map(function (e) { return e.host + e.path; }));
+      return INFRA_DB.slice()
+        .concat(BASE_ALLOW)
+        .concat(BASE_ALLOW_PATH.map(function (e) { return e.host + e.path; }));
+    },
+
+    // The infrastructure list (§8): CDNs and static hosts of site builders and
+    // hosting platforms, general asset CDNs, fonts and captcha. A CLASS of
+    // host, not a consent category — nothing here is a decision the site owner
+    // gets to make, which is exactly why the audit stops reporting them.
+    //
+    // Shared with the SaaS scanner, which loads this core and reads this list
+    // to set `thirdParty[].infra`, keep infrastructure out of the summary and
+    // out of tracker_observations. Hosts only: the two path-scoped recaptcha
+    // entries are infrastructure too, but cannot be expressed as bare hosts —
+    // see BASE_ALLOW_PATH. A fresh copy per read, for the same reason as
+    // _baseAllow.
+    _infra: function () {
+      return INFRA_DB.slice();
+    },
+
+    // Is this URL infrastructure? Takes a URL, like every other public
+    // predicate here, so a caller never has to reimplement host extraction.
+    //
+    // A BARE HOST is accepted too ('tildacdn.com'), because the scanner works
+    // in hosts and would otherwise have to glue a fake scheme on every call.
+    // It needs its own branch: urlParts resolves a relative string against the
+    // page, so a bare host arrives as a PATH on the first-party origin and
+    // would answer false. The test is deliberately narrow — a string with no
+    // scheme, no slash, no query and at least one dot is a hostname and cannot
+    // be anything else.
+    _isInfra: function (url) {
+      try {
+        if (!url || typeof url !== 'string') { return false; }
+        var s = url.trim();
+        if (!s) { return false; }
+        if (/^[a-z0-9.\-]+\.[a-z0-9\-]+$/i.test(s)) {
+          return isInfraHost(s.toLowerCase().replace(/^\.+|\.+$/g, ''));
+        }
+        var host = urlParts(s).host;
+        if (!host) { return false; }
+        return isInfraHost(host);
+      } catch (e) { return false; }
     },
 
     // What is being held back until consent: everything the engine intercepted

package/src/ck-debug.js

@@ -199,6 +199,28 @@
       note: NOTE_RU,
       secConsentMode: 'Consent Mode / dataLayer',
       noEvents: 'событий не было',
+      secTheme: 'Оформление',
+      themeMode: 'тема',
+      themeModeLight: 'светлая',
+      themeModeDark: 'тёмная',
+      themeFont: 'шрифт',
+      themeFontInherit: 'как на сайте',
+      themeFontSystem: 'системный',
+      themeRadius: 'скругления',
+      themeCard: 'карточка',
+      themeBtn: 'кнопки',
+      themeLink: 'Ссылки',
+      btnAccept: 'Принять всё',
+      btnReject: 'Отклонить всё',
+      btnSettings: 'Настроить',
+      btnFilled: 'залитая',
+      btnOutline: 'обводка',
+      btnText: 'текст',
+      btnBorder: 'обводка',
+      btnOn: 'на',
+      btnAdjusted: 'исправлено автоматически',
+      btnOk: 'AA',
+      btnFail: 'ниже AA',
       secActions: 'Действия',
       reset: 'Сбросить согласие',
       showPrefs: 'Показать настройки',
@@ -236,6 +258,28 @@
       note: NOTE_EN,
       secConsentMode: 'Consent Mode / dataLayer',
       noEvents: 'no events',
+      secTheme: 'Appearance',
+      themeMode: 'theme',
+      themeModeLight: 'light',
+      themeModeDark: 'dark',
+      themeFont: 'font',
+      themeFontInherit: 'site font',
+      themeFontSystem: 'system',
+      themeRadius: 'radii',
+      themeCard: 'card',
+      themeBtn: 'buttons',
+      themeLink: 'Links',
+      btnAccept: 'Accept all',
+      btnReject: 'Reject all',
+      btnSettings: 'Customize',
+      btnFilled: 'filled',
+      btnOutline: 'outline',
+      btnText: 'text',
+      btnBorder: 'border',
+      btnOn: 'on',
+      btnAdjusted: 'adjusted automatically',
+      btnOk: 'AA',
+      btnFail: 'below AA',
       secActions: 'Actions',
       reset: 'Reset consent',
       showPrefs: 'Show preferences',
@@ -547,6 +591,13 @@
 
   function tag(text, cls) { return el('span', { class: 't' + (cls ? ' ' + cls : '') }, text); }
 
+  // A contrast ratio the way WCAG tools quote it. null when the colour could
+  // not be measured (a colour name, an rgb() string) — shown as "?" rather
+  // than a made-up number.
+  function fmtRatio(r) {
+    return typeof r === 'number' && isFinite(r) ? (Math.round(r * 100) / 100) + ':1' : '?';
+  }
+
   // Resolved lazily, not at parse time: this file runs before ConsentKit.init()
   // has merged the site's config, so asking for the language now would always
   // read the built-in default. Re-resolved on every render so a page that
@@ -663,7 +714,75 @@
     }
     body.appendChild(s5);
 
-    // 6. Buttons
+    // 6. Appearance (SPEC V1.6 §1) — the three buttons' RESOLVED colours and
+    // their contrast ratios, read straight off ConsentKit._contrast rather than
+    // recomputed here: the banner, this panel and the cabinet's theme editor
+    // must all quote the same numbers. The mode is named explicitly because
+    // light and dark resolve differently and only one of them is on screen.
+    var contrast = CK && CK._contrast;
+    if (contrast && typeof contrast.buildThemeCss === 'function') {
+      var sT = section(T.secTheme);
+      try {
+        var built = contrast.buildThemeCss((CK && CK.config) || {});
+        // Which palette the visitor is actually looking at right now.
+        var dark = built.mode === 'dark';
+        if (built.mode === 'auto') {
+          try {
+            dark = !!(global.matchMedia && global.matchMedia('(prefers-color-scheme: dark)').matches);
+          } catch (e) { dark = false; }
+        }
+        var resolved = dark ? built.dark : built.light;
+
+        // Fourth row: --ck-link, the accent as TEXT on the card. It is a
+        // separate number from every button's, because it is measured against
+        // the card rather than against a button fill — a brand accent can pass
+        // as a filled button's background and still be unreadable as a link.
+        var lk = resolved.link;
+        var lkTxt = '—';
+        if (lk) {
+          lkTxt = lk.color + ' ' + T.btnOn + ' ' + lk.against +
+            ' · ' + fmtRatio(lk.ratio) +
+            ' ' + ((typeof lk.ratio === 'number' && lk.ratio >= 4.5) ? T.btnOk : T.btnFail) +
+            (lk.adjusted ? ' · ' + T.btnAdjusted : '');
+        }
+
+        sT.appendChild(defs([
+          [T.themeMode, (dark ? T.themeModeDark : T.themeModeLight) +
+            (built.mode === 'auto' ? ' (auto)' : '')],
+          [T.themeFont, built.font === 'inherit' ? T.themeFontInherit : T.themeFontSystem],
+          [T.themeRadius, T.themeCard + ' ' + built.radius.card + 'px · ' +
+            T.themeBtn + ' ' + built.radius.button + 'px'],
+          [T.themeLink, lkTxt]
+        ]));
+
+        var labels = { accept: T.btnAccept, reject: T.btnReject, settings: T.btnSettings };
+        var uT = doc.createElement('ul');
+        ['accept', 'reject', 'settings'].forEach(function (role) {
+          var b = resolved.buttons[role];
+          if (!b) { return; }
+          var li = doc.createElement('li');
+          li.appendChild(tag(b.variant === 'filled' ? T.btnFilled : T.btnOutline));
+          var ok = typeof b.ratio === 'number' && b.ratio >= 4.5;
+          li.appendChild(tag(fmtRatio(b.ratio) + ' ' + (ok ? T.btnOk : T.btnFail),
+            ok ? 'on' : 'off'));
+          li.appendChild(doc.createTextNode(labels[role] + ' — ' +
+            T.btnText + ' ' + b.fg + ' ' + T.btnOn + ' ' + b.against +
+            (b.variant === 'outline'
+              ? ' · ' + T.btnBorder + ' ' + b.border + ' (' + fmtRatio(b.borderRatio) + ')'
+              : '')));
+          if (b.adjusted) {
+            li.appendChild(el('span', { class: 'mut' }, ' · ' + T.btnAdjusted));
+          }
+          uT.appendChild(li);
+        });
+        sT.appendChild(uT);
+      } catch (e) {
+        sT.appendChild(el('div', { class: 'mut' }, '—'));
+      }
+      body.appendChild(sT);
+    }
+
+    // 7. Buttons
     var s6 = section(T.secActions);
     var row = el('div', { class: 'row' });
     var bReset = el('button', { type: 'button' }, T.reset);