govuk_publishing_components 35.7.0 → 35.9.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 19aaa8a186568f17fc86baced60aab3d35f790e35f819702736f6dc861f64bcb
-  data.tar.gz: 947c684323444fb20d04063a801f71868193ca46ee7dfba877a26b05c235ae5f
+  metadata.gz: 619cac6fc6ecb8078d66be77a50e1fe4d5f320b61a15e574fbd92a892d896d80
+  data.tar.gz: d339abcad29fe3e59dafe2157e3ba605c8817563797b30bead89650ebe5d278f
 SHA512:
-  metadata.gz: 4c151b005305fa534de28d3769131a41334c3a39b64e89a8f737f6e59747ba03d28d24e62fcdf122fb9b290c5a3d3596842aa973100a208144c83280dcf12fb1
-  data.tar.gz: 1ef830fa00101728968b9bc2e0d865f923cf00cbd265b33d5e8958f18539938146a1b802e6e6d42a0ee269fc2be3664ba89734d67dbcabef04187a46caa22df8
+  metadata.gz: a163d27c8f13d7019869a16ac1f0c58c4c71e88be7c456e1639cb717bdf3f0da4c483ae7336824ed288d2888e5f0e671e1b1120fe910fa75d838aa85da998f98
+  data.tar.gz: 87d03d1a7c4f50d4065b501c8f415831f218f28e2dd28ebfe61d87d270162ae595899ba46387d5bed9cc3b9472fbc7d47255fd573354bcfcc8477262aa574427

data/app/assets/javascripts/govuk_publishing_components/analytics-ga4/ga4-link-tracker.js

@@ -82,7 +82,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
       var text = data.text || event.target.textContent
       data.text = window.GOVUK.analyticsGa4.core.trackFunctions.removeLinesAndExtraSpaces(text)
       data.text = this.PIIRemover.stripPIIWithOverride(data.text, true, true)
-      if (!data.text && (element.querySelector('img') || element.querySelector('svg'))) {
+      if (!data.text && (element.querySelector('img') || element.querySelector('svg') || element.tagName === 'IMG' || element.closest('svg'))) {
         data.text = 'image'
       }
       var url = data.url || this.findLink(event.target).getAttribute('href')

data/app/assets/javascripts/govuk_publishing_components/vendor/lux/lux-reporter.js

@@ -42,7 +42,6 @@
     var autoMode = getProperty(obj, "auto", true);
     return {
       auto: autoMode,
-      autoWhenHidden: getProperty(obj, "autoWhenHidden", false),
       beaconUrl: getProperty(obj, "beaconUrl", "https://lux.speedcurve.com/lux/"),
       conversions: getProperty(obj, "conversions", undefined),
       customerid: getProperty(obj, "customerid", undefined),
@@ -54,9 +53,12 @@
       maxErrors: getProperty(obj, "maxErrors", 5),
       maxMeasureTime: getProperty(obj, "maxMeasureTime", 60000),
       minMeasureTime: getProperty(obj, "minMeasureTime", 0),
+      newBeaconOnPageShow: getProperty(obj, "newBeaconOnPageShow", false),
       samplerate: getProperty(obj, "samplerate", 100),
       sendBeaconOnPageHidden: getProperty(obj, "sendBeaconOnPageHidden", autoMode),
+      serverTiming: getProperty(obj, "serverTiming", undefined),
       trackErrors: getProperty(obj, "trackErrors", true),
+      trackHiddenPages: getProperty(obj, "trackHiddenPages", false),
       pagegroups: getProperty(obj, "pagegroups", undefined),
     };
   }
@@ -102,9 +104,9 @@
   function valuesToString(values) {
     var strings = [];
     for (var key in values) {
-              // Convert all values to strings
+      // Convert all values to strings
       var value = "" + values[key];
-              // Strip out reserved characters (, and | are used as delimiters)
+      // Strip out reserved characters (, and | are used as delimiters)
       key = key.replace(/,/g, "").replace(/\|/g, "");
       value = value.replace(/,/g, "").replace(/\|/g, "");
       strings.push(key + "|" + value);
@@ -115,6 +117,13 @@
   function floor(x) {
     return Math.floor(x);
   }
+  var max = Math.max;
+  /**
+   * Clamp a number so that it is never less than 0
+   */
+  function clamp(x) {
+    return max(0, x);
+  }
 
   function now() {
     return Date.now ? Date.now() : +new Date();
@@ -147,10 +156,13 @@
   function getNavigationEntry() {
     var navEntries = getEntriesByType("navigation");
     if (navEntries.length) {
-      var entry_1 = navEntries[0];
-      entry_1.navigationStart = 0;
-      if (typeof entry_1.activationStart === "undefined") {
-        entry_1.activationStart = 0;
+      var nativeEntry = navEntries[0];
+      var entry_1 = {
+        navigationStart: 0,
+        activationStart: 0,
+      };
+      for (var key in nativeEntry) {
+        entry_1[key] = nativeEntry[key];
       }
       return entry_1;
     }
@@ -164,7 +176,7 @@
     if (__ENABLE_POLYFILLS) {
       for (var key in timing) {
         if (typeof timing[key] === "number" && key !== "navigationStart") {
-          entry[key] = Math.max(0, timing[key] - timing.navigationStart);
+          entry[key] = floor(timing[key] - timing.navigationStart);
         }
       }
     }
@@ -189,26 +201,39 @@
     if (document.visibilityState) {
       return document.visibilityState === "visible";
     }
-          // For browsers that don't support document.visibilityState, we assume the page is visible.
+    // For browsers that don't support document.visibilityState, we assume the page is visible.
     return true;
   }
   function onVisible(cb) {
-    if (isVisible()) {
-      cb();
+    afterPrerender(function () {
+      if (isVisible()) {
+        cb();
+      }
+      else {
+        var onVisibleCallback_1 = function () {
+          if (isVisible()) {
+            cb();
+            removeEventListener("visibilitychange", onVisibleCallback_1);
+          }
+        };
+        addEventListener("visibilitychange", onVisibleCallback_1, true);
+      }
+    });
+  }
+  function afterPrerender(cb) {
+    if (document.prerendering) {
+      document.addEventListener("prerenderingchange", cb, true);
     }
     else {
-      var onVisibleCallback_1 = function () {
-        if (isVisible()) {
-          cb();
-          removeEventListener("visibilitychange", onVisibleCallback_1);
-        }
-      };
-      addEventListener("visibilitychange", onVisibleCallback_1, true);
+      cb();
     }
   }
   function wasPrerendered() {
     return document.prerendering || getNavigationEntry().activationStart > 0;
   }
+  function wasRedirected() {
+    return getNavigationEntry().redirectCount > 0 || timing.redirectEnd > 0;
+  }
 
   var Flags = {
     InitCalled: 1 << 0,
@@ -222,6 +247,7 @@
     PageLabelFromGlobalVariable: 1 << 8,
     PageLabelFromPagegroup: 1 << 9,
     PageWasPrerendered: 1 << 10,
+    PageWasBfCacheRestored: 1 << 11,
   };
   function addFlag(flags, flag) {
     return flags | flag;
@@ -235,8 +261,8 @@
   }
 
   /**
-  * Get the interaction attribution name for an element
-  */
+   * Get the interaction attribution name for an element
+   */
   function interactionAttributionForElement(el) {
     // Our first preference is to use the data-sctrack attribute from anywhere in the tree
     var trackId = getClosestScTrackAttribute(el);
@@ -291,6 +317,7 @@
     UnloadHandlerTriggered: 10,
     OnloadHandlerTriggered: 11,
     MarkLoadTimeCalled: 12,
+    SendCancelledPageHidden: 13,
     // Data collection events
     SessionIsSampled: 21,
     SessionIsNotSampled: 22,
@@ -315,39 +342,45 @@
     PaintTimingNotSupported: 72,
   };
   var Logger = /** @class */ (function () {
-  function Logger() {
-    this.events = [];
-  }
-  Logger.prototype.logEvent = function (event, args) {
-    if (args === void 0) { args = []; }
-    this.events.push([now(), event, args]);
-  };
-  Logger.prototype.getEvents = function () {
-    return this.events;
-  };
-  return Logger;
+    function Logger() {
+      this.events = [];
+    }
+    Logger.prototype.logEvent = function (event, args) {
+      if (args === void 0) { args = []; }
+      this.events.push([now(), event, args]);
+    };
+    Logger.prototype.getEvents = function () {
+      return this.events;
+    };
+    return Logger;
   }());
   var sessionValue = 0;
   var sessionEntries = [];
+  var maximumSessionValue = 0;
   function addEntry$2(entry) {
     if (!entry.hadRecentInput) {
       var firstEntry = sessionEntries[0];
       var latestEntry = sessionEntries[sessionEntries.length - 1];
       if (sessionEntries.length &&
         (entry.startTime - latestEntry.startTime >= 1000 ||
-          entry.startTime - firstEntry.startTime >= 5000)) {
-        reset$1();
+        entry.startTime - firstEntry.startTime >= 5000)) {
+        sessionValue = entry.value;
+        sessionEntries = [entry];
       }
-      sessionValue += entry.value;
-      sessionEntries.push(entry);
+      else {
+        sessionValue += entry.value;
+        sessionEntries.push(entry);
+      }
+      maximumSessionValue = max(maximumSessionValue, sessionValue);
     }
   }
   function reset$1() {
     sessionValue = 0;
     sessionEntries = [];
+    maximumSessionValue = 0;
   }
   function getCLS() {
-    return sessionValue;
+    return maximumSessionValue;
   }
 
   /**
@@ -372,7 +405,7 @@
       var duration = entry.duration, startTime = entry.startTime, interactionId = entry.interactionId;
       var existingEntry = slowestEntriesMap[interactionId];
       if (existingEntry) {
-        existingEntry.duration = Math.max(duration, existingEntry.duration);
+        existingEntry.duration = max(duration, existingEntry.duration);
       }
       else {
         interactionCountEstimate++;
@@ -405,44 +438,6 @@
     return interactionCountEstimate;
   }
 
-  /**
-   * Get the number of milliseconds between navigationStart and the given PerformanceNavigationTiming key
-   */
-  function getNavTimingValue(key) {
-    var navEntry = getNavigationEntry();
-    var relativeTo = key === "activationStart" ? 0 : navEntry.activationStart;
-    if (typeof navEntry[key] === "number") {
-      return Math.max(0, navEntry[key] - relativeTo);
-    }
-    return undefined;
-  }
-
-  /******************************************************************************
-  Copyright (c) Microsoft Corporation.
-
-  Permission to use, copy, modify, and/or distribute this software for any
-  purpose with or without fee is hereby granted.
-
-  THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-  REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
-  AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-  INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
-  LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
-  OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
-  PERFORMANCE OF THIS SOFTWARE.
-  ***************************************************************************** */
-
-  var __assign = function() {
-    __assign = Object.assign || function __assign(t) {
-      for (var s, i = 1, n = arguments.length; i < n; i++) {
-        s = arguments[i];
-        for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-      }
-      return t;
-    };
-    return __assign.apply(this, arguments);
-  };
-
   var ALL_ENTRIES = [];
   function observe(type, callback, options) {
     if (typeof PerformanceObserver === "function" &&
@@ -450,10 +445,10 @@
       var po = new PerformanceObserver(function (list) {
         list.getEntries().forEach(function (entry) { return callback(entry); });
       });
-    po.observe(__assign({ type: type, buffered: true }, options));
-    return po;
-  }
-  return undefined;
+      po.observe(Object.assign({ type: type, buffered: true }, { options: options }));
+      return po;
+    }
+    return undefined;
   }
   function getEntries(type) {
     return ALL_ENTRIES.filter(function (entry) { return entry.entryType === type; });
@@ -465,6 +460,39 @@
     ALL_ENTRIES.splice(0);
   }
 
+  /**
+   * A server timing metric that has its value set to the duration field
+   */
+  var TYPE_DURATION = "r";
+  /**
+   * When a description metric has no value, we consider it to be a boolean and set it to this value.
+   */
+  var BOOLEAN_TRUE_VALUE = "true";
+  function getKeyValuePairs(config, serverTiming) {
+    var pairs = {};
+    serverTiming.forEach(function (stEntry) {
+      var name = stEntry.name;
+      var description = stEntry.description;
+      if (name in config) {
+        var spec = config[name];
+        var multiplier = spec[1];
+        if (spec[0] === TYPE_DURATION) {
+          pairs[name] = stEntry.duration * (multiplier || 1);
+        }
+        else if (description && multiplier) {
+          var numericValue = parseFloat(description);
+          if (!isNaN(numericValue)) {
+            pairs[name] = numericValue * multiplier;
+          }
+        }
+        else {
+          pairs[name] = description || BOOLEAN_TRUE_VALUE;
+        }
+      }
+    });
+    return pairs;
+  }
+
   function getMatchesFromPatternMap(patternMap, hostname, pathname, firstOnly) {
     var matches = [];
     for (var key in patternMap) {
@@ -496,7 +524,7 @@
     return regex.test(hostname + pathname);
   }
   function createRegExpFromPattern(pattern) {
-    return new RegExp("^" + escapeStringForRegExp(pattern).replaceAll("*", ".*") + "$", "i");
+    return new RegExp("^" + escapeStringForRegExp(pattern).replace(/\*/g, ".*") + "$", "i");
   }
   function escapeStringForRegExp(str) {
     // Note: we don't escape * because it's our own special symbol!
@@ -514,7 +542,7 @@
     // -------------------------------------------------------------------------
     /// End
     // -------------------------------------------------------------------------
-    var SCRIPT_VERSION = "308";
+    var SCRIPT_VERSION = "309";
     var logger = new Logger();
     var globalConfig = fromObject(LUX);
     logger.logEvent(LogEvent.EvaluationStart, [SCRIPT_VERSION]);
@@ -585,7 +613,7 @@
       observe("first-input", function (entry) {
         var fid = entry.processingStart - entry.startTime;
         if (!gFirstInputDelay || gFirstInputDelay < fid) {
-          gFirstInputDelay = fid;
+          gFirstInputDelay = floor(fid);
         }
         // Allow first-input events to be considered for INP
         addEntry$1(entry);
@@ -612,7 +640,13 @@
     var gUid = refreshUniqueId(gSyncId); // cookie for this session ("Unique ID")
     var gCustomerDataTimeout; // setTimeout timer for sending a Customer Data beacon after onload
     var gMaxMeasureTimeout; // setTimeout timer for sending the beacon after a maximum measurement time
-    var navEntry = getNavigationEntry();
+    var pageRestoreTime; // ms since navigationStart representing when the page was restored from the bfcache
+    /**
+     * To measure the way a user experienced a metric, we measure metrics relative to the time the user
+     * started viewing the page. On prerendered pages, this is activationStart. On bfcache restores, this
+     * is the page restore time. On all other pages this value will be zero.
+     */
+    var getZeroTime = function () { return pageRestoreTime || getNavigationEntry().activationStart; };
     if (_sample()) {
       logger.logEvent(LogEvent.SessionIsSampled, [globalConfig.samplerate]);
     }
@@ -713,7 +747,7 @@
       var startMark = _getMark(START_MARK);
       // For SPA page views, we use our internal mark as a reference point
       if (startMark && !absolute) {
-        return sinceNavigationStart - startMark.startTime;
+        return floor(sinceNavigationStart - startMark.startTime);
       }
       // For "regular" page views, we can use performance.now() if it's available...
       return sinceNavigationStart;
@@ -796,6 +830,7 @@
       }
       // ...Otherwise provide a polyfill
       if (__ENABLE_POLYFILLS) {
+        var navEntry = getNavigationEntry();
         var startTime = typeof startMarkName === "number" ? startMarkName : 0;
         var endTime = typeof endMarkName === "number" ? endMarkName : _now();
         var throwError = function (missingMark) {
@@ -906,7 +941,7 @@
           hUT[name] = { startTime: startTime };
         }
         else {
-          hUT[name].startTime = Math.max(startTime, hUT[name].startTime);
+          hUT[name].startTime = max(startTime, hUT[name].startTime);
         }
       });
       // measures
@@ -939,7 +974,7 @@
     function elementTimingValues() {
       var aET = [];
       var startMark = _getMark(START_MARK);
-      var tZero = startMark ? startMark.startTime : 0;
+      var tZero = startMark ? startMark.startTime : getZeroTime();
       getEntries("element").forEach(function (entry) {
         if (entry.identifier && entry.startTime) {
           logger.logEvent(LogEvent.PerformanceEntryProcessed, [entry]);
@@ -1164,11 +1199,11 @@
       var nThis = ("" + gUid).substr(-2); // number for THIS page - from 00 to 99
       return parseInt(nThis) < globalConfig.samplerate;
     }
-    // _init()
-    // Use this function in Single Page Apps to reset things.
-    // This function should ONLY be called within a SPA!
-    // Otherwise, you might clear marks & measures that were set by a shim.
-    function _init() {
+    /**
+     * Re-initialize lux.js to start a new "page". This is typically called within a SPA at the
+     * beginning of a page transition, but is also called internally when the BF cache is restored.
+     */
+    function _init(startTime) {
       // Some customers (incorrectly) call LUX.init on the very first page load of a SPA. This would
       // cause some first-page-only data (like paint metrics) to be lost. To prevent this, we silently
       // bail from this function when we detect an unnecessary LUX.init call.
@@ -1176,6 +1211,14 @@
       if (!endMark) {
         return;
       }
+      // Mark the "navigationStart" for this SPA page. A start time can be passed through, for example
+      // to set a page's start time as an event timestamp.
+      if (startTime) {
+        _mark(START_MARK, { startTime: startTime });
+      }
+      else {
+        _mark(START_MARK);
+      }
       logger.logEvent(LogEvent.InitCalled);
       // Clear all interactions from the previous "page".
       _clearIx();
@@ -1197,8 +1240,6 @@
       // Clear flags then set the flag that init was called (ie, this is a SPA).
       gFlags = 0;
       gFlags = addFlag(gFlags, Flags.InitCalled);
-      // Mark the "navigationStart" for this SPA page.
-      _mark(START_MARK);
       // Reset the maximum measure timeout
       createMaxMeasureTimeout();
     }
@@ -1305,8 +1346,9 @@
       var ns = timing.navigationStart;
       var startMark = _getMark(START_MARK);
       var endMark = _getMark(END_MARK);
-      if (startMark && endMark) {
+      if (startMark && endMark && !pageRestoreTime) {
         // This is a SPA page view, so send the SPA marks & measures instead of Nav Timing.
+        // Note: pageRestoreTime indicates this was a bfcache restore, which we don't want to treat as a SPA.
         var start = floor(startMark.startTime); // the start mark is "zero"
         ns += start; // "navigationStart" for a SPA is the real navigationStart plus the start mark
         var end = floor(endMark.startTime) - start; // delta from start mark
@@ -1322,21 +1364,33 @@
       }
       else if (performance.timing) {
         // Return the real Nav Timing metrics because this is the "main" page view (not a SPA)
+        var navEntry_1 = getNavigationEntry();
         var startRender = getStartRender();
         var fcp = getFcp();
         var lcp = getLcp();
         var prefixNTValue = function (key, prefix) {
-          var value = getNavTimingValue(key);
-          if (typeof value === "undefined") {
-            return "";
+          // activationStart is always absolute. Other values are relative to activationStart.
+          var zero = key === "activationStart" ? 0 : getZeroTime();
+          if (typeof navEntry_1[key] === "number") {
+            var value = clamp(floor(navEntry_1[key] - zero));
+            return prefix + value;
           }
-          return prefix + value;
+          return "";
         };
+        var loadEventStartStr = prefixNTValue("loadEventStart", "ls");
+        var loadEventEndStr = prefixNTValue("loadEventEnd", "le");
+        if (pageRestoreTime && startMark && endMark) {
+          // For bfcache restores, we set the load time to the time it took for the page to be restored.
+          var loadTime = floor(endMark.startTime - startMark.startTime);
+          loadEventStartStr = "ls" + loadTime;
+          loadEventEndStr = "le" + loadTime;
+        }
+        var redirect = wasRedirected();
         s = [
           ns,
           prefixNTValue("activationStart", "as"),
-          prefixNTValue("redirectStart", "rs"),
-          prefixNTValue("redirectEnd", "re"),
+          redirect ? prefixNTValue("redirectStart", "rs") : "",
+          redirect ? prefixNTValue("redirectEnd", "re") : "",
           prefixNTValue("fetchStart", "fs"),
           prefixNTValue("domainLookupStart", "ds"),
           prefixNTValue("domainLookupEnd", "de"),
@@ -1350,11 +1404,11 @@
           prefixNTValue("domContentLoadedEventStart", "os"),
           prefixNTValue("domContentLoadedEventEnd", "oe"),
           prefixNTValue("domComplete", "oc"),
-          prefixNTValue("loadEventStart", "ls"),
-          prefixNTValue("loadEventEnd", "le"),
-          typeof startRender !== "undefined" ? "sr" + startRender : "",
-          typeof fcp !== "undefined" ? "fc" + fcp : "",
-          typeof lcp !== "undefined" ? "lc" + lcp : "",
+          loadEventStartStr,
+          loadEventEndStr,
+          typeof startRender !== "undefined" ? "sr" + clamp(startRender) : "",
+          typeof fcp !== "undefined" ? "fc" + clamp(fcp) : "",
+          typeof lcp !== "undefined" ? "lc" + clamp(lcp) : "",
         ].join("");
       }
       else if (endMark) {
@@ -1378,7 +1432,7 @@
       for (var i = 0; i < paintEntries.length; i++) {
         var entry = paintEntries[i];
         if (entry.name === "first-contentful-paint") {
-          return floor(entry.startTime);
+          return floor(entry.startTime - getZeroTime());
         }
       }
       return undefined;
@@ -1389,7 +1443,7 @@
       if (lcpEntries.length) {
         var lastEntry = lcpEntries[lcpEntries.length - 1];
         logger.logEvent(LogEvent.PerformanceEntryProcessed, [lastEntry]);
-        return floor(lastEntry.startTime);
+        return floor(lastEntry.startTime - getZeroTime());
       }
       return undefined;
     }
@@ -1402,7 +1456,7 @@
         if (paintEntries.length) {
           // If the Paint Timing API is supported, use the value of the first paint event
           var paintValues = paintEntries.map(function (entry) { return entry.startTime; });
-          return floor(Math.min.apply(null, paintValues));
+          return floor(Math.min.apply(null, paintValues) - getZeroTime());
         }
       }
       if (performance.timing && timing.msFirstPaint && __ENABLE_POLYFILLS) {
@@ -1474,17 +1528,17 @@
     }
     function docHeight(doc) {
       var body = doc.body, docelem = doc.documentElement;
-      var height = Math.max(body ? body.scrollHeight : 0, body ? body.offsetHeight : 0, docelem ? docelem.clientHeight : 0, docelem ? docelem.scrollHeight : 0, docelem ? docelem.offsetHeight : 0);
+      var height = max(body ? body.scrollHeight : 0, body ? body.offsetHeight : 0, docelem ? docelem.clientHeight : 0, docelem ? docelem.scrollHeight : 0, docelem ? docelem.offsetHeight : 0);
       return height;
     }
     function docWidth(doc) {
       var body = doc.body, docelem = doc.documentElement;
-      var width = Math.max(body ? body.scrollWidth : 0, body ? body.offsetWidth : 0, docelem ? docelem.clientWidth : 0, docelem ? docelem.scrollWidth : 0, docelem ? docelem.offsetWidth : 0);
+      var width = max(body ? body.scrollWidth : 0, body ? body.offsetWidth : 0, docelem ? docelem.clientWidth : 0, docelem ? docelem.scrollWidth : 0, docelem ? docelem.offsetWidth : 0);
       return width;
     }
     // Return the main HTML document transfer size (in bytes).
     function docSize() {
-      return navEntry.encodedBodySize || 0;
+      return getNavigationEntry().encodedBodySize || 0;
     }
     // Return the connection type based on Network Information API.
     // Note this API is in flux.
@@ -1624,6 +1678,10 @@
     // Beacon back the LUX data.
     function _sendLux() {
       var _a;
+      if (!isVisible() && !globalConfig.trackHiddenPages) {
+        logger.logEvent(LogEvent.SendCancelledPageHidden);
+        return;
+      }
       clearMaxMeasureTimeout();
       var customerid = getCustomerId();
       if (!customerid ||
@@ -1663,6 +1721,15 @@
       if (wasPrerendered()) {
         gFlags = addFlag(gFlags, Flags.PageWasPrerendered);
       }
+      if (globalConfig.serverTiming) {
+        var navEntry = getNavigationEntry();
+        if (navEntry.serverTiming) {
+          var stPairs = getKeyValuePairs(globalConfig.serverTiming, navEntry.serverTiming);
+          for (var name_2 in stPairs) {
+            _addData(name_2, stPairs[name_2]);
+          }
+        }
+      }
       if (LUX.conversions) {
         getMatchesFromPatternMap(LUX.conversions, location.hostname, location.pathname).forEach(function (conversion) {
           LUX.addData(conversion, BOOLEAN_TRUE);
@@ -1757,7 +1824,7 @@
       var sIx = ixValues(); // Interaction Metrics
       var INP = getINP();
       if (sIx) {
-      var beaconUrl = _getBeaconUrl(getUpdatedCustomData()) +
+        var beaconUrl = _getBeaconUrl(getUpdatedCustomData()) +
         "&IX=" +
         sIx +
         (typeof gFirstInputDelay !== "undefined" ? "&FID=" + gFirstInputDelay : "") +
@@ -2031,8 +2098,8 @@
           setTimeout(sendBeaconAfterMinimumMeasureTime_1, timeRemaining);
         }
       };
-      if (globalConfig.autoWhenHidden) {
-        // The autoWhenHidden config forces the beacon to be sent even when the page is not visible.
+      if (globalConfig.trackHiddenPages) {
+        // The trackHiddenPages config forces the beacon to be sent even when the page is not visible.
         sendBeaconAfterMinimumMeasureTime_1();
       }
       else {
@@ -2040,6 +2107,31 @@
         onVisible(sendBeaconAfterMinimumMeasureTime_1);
       }
     }
+    // When newBeaconOnPageShow = true, we initiate a new page view whenever a page is restored from
+    // bfcache. Since we have no "onload" event to hook into after a bfcache restore, we rely on the
+    // unload and maxMeasureTime handlers to send the beacon.
+    if (globalConfig.newBeaconOnPageShow) {
+      window.addEventListener("pageshow", function (event) {
+        if (event.persisted) {
+          // Record the timestamp of the bfcache restore
+          pageRestoreTime = event.timeStamp;
+          // In Chromium, document.visibilityState is still "hidden" when pageshow fires after a bfcache
+          // restore. Wrapping this in a setTimeout ensures the browser has enough time to update the
+          // visibility.
+          // See https://bugs.chromium.org/p/chromium/issues/detail?id=1133363
+          setTimeout(function () {
+            if (gbLuxSent) {
+              // If the beacon was already sent for this page, we start a new page view and mark the
+              // load time as the time it took to restore the page.
+              _init(pageRestoreTime);
+              _markLoadTime();
+            }
+            // Flag the current page as a bfcache restore
+            gFlags = addFlag(gFlags, Flags.PageWasBfCacheRestored);
+          }, 0);
+        }
+      });
+    }
     // Add the unload handlers when sendBeaconOnPageHidden is enabled
     if (globalConfig.sendBeaconOnPageHidden) {
       _addUnloadHandlers();

data/app/assets/stylesheets/govuk_publishing_components/components/_document-list.scss

@@ -8,10 +8,14 @@
 }
 
 .gem-c-document-list__item {
-  margin-bottom: govuk-spacing(5);
+  margin-top: govuk-spacing(5);
   padding-top: govuk-spacing(2);
   border-top: 1px solid $govuk-border-colour;
   list-style: none;
+
+  &:first-child {
+    margin-top: 0;
+  }
 }
 
 .gem-c-document-list__item-title {
@@ -86,14 +90,6 @@
   }
 }
 
-.gem-c-document-list--bottom-margin {
-  margin-bottom: govuk-spacing(4);
-}
-
-.gem-c-document-list--top-margin {
-  margin-top: govuk-spacing(4);
-}
-
 .gem-c-document-list__multi-list {
   width: 100%;
   margin-right: 25px;

data/app/assets/stylesheets/govuk_publishing_components/components/_layout-for-public.scss

@@ -9,6 +9,10 @@
   height: govuk-spacing(2);
 }
 
+.gem-c-layout-for-public__blue-bar-wrapper--browse {
+  background-color: #263135;
+}
+
 .js-enabled .gem-c-layout-for-public__global-banner-wrapper {
   margin-top: - govuk-spacing(2);
   min-height: govuk-spacing(2);

data/app/views/govuk_publishing_components/audit/show.html.erb

@@ -1,6 +1,7 @@
-<% 
+<%
   add_gem_component_stylesheet("table")
   add_gem_component_stylesheet("select")
+  add_gem_component_stylesheet("summary-list")
 %>
 
 <% content_for :title, "Component audit" %>

data/app/views/govuk_publishing_components/components/_accordion.html.erb

@@ -40,11 +40,12 @@
         ga4_link_data_attributes ||= nil
 
         if ga4_tracking
+          heading_text = Nokogiri::HTML(item[:heading][:text]).text
           item[:data_attributes] ||= {}
           item[:data_attributes][:ga4_event] = {
             event_name: "select_content",
             type: "accordion",
-            text: item[:heading][:text],
+            text: heading_text,
             index: {
               index_section: index,
               index_section_count: items.length,
@@ -56,12 +57,12 @@
           # tracking attributes
           ga4_link_data_attributes = {}
           ga4_link_data_attributes[:module] = "ga4-link-tracker"
-          ga4_link_data_attributes[:ga4_tracks_links_only] = ""
+          ga4_link_data_attributes[:ga4_track_links_only] = ""
           ga4_link_data_attributes[:ga4_set_indexes] = ""
           ga4_link_data_attributes[:ga4_link] = {
             event_name: "navigation",
             type: "accordion",
-            section: item[:heading][:text],
+            section: heading_text,
             index: {
               index_section: index,
               index_section_count: (items.length),

data/app/views/govuk_publishing_components/components/_document_list.html.erb

@@ -1,14 +1,15 @@
 <%
   add_gem_component_stylesheet("document-list")
 
+  local_assigns[:margin_bottom] ||= 5
+  shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
   items ||= []
 
-  classes = "gem-c-document-list"
-  classes << " gem-c-document-list--top-margin" if local_assigns[:margin_top]
-  classes << " gem-c-document-list--bottom-margin" if local_assigns[:margin_bottom]
-  classes << " gem-c-document-list--no-underline" if local_assigns[:remove_underline]
-  classes << " gem-c-document-list--no-top-border" if local_assigns[:remove_top_border]
-  classes << " gem-c-document-list--no-top-border-first-child" if local_assigns[:remove_top_border_from_first_child]
+  classes = %w[gem-c-document-list]
+  classes << "gem-c-document-list--no-underline" if local_assigns[:remove_underline]
+  classes << "gem-c-document-list--no-top-border" if local_assigns[:remove_top_border]
+  classes << "gem-c-document-list--no-top-border-first-child" if local_assigns[:remove_top_border_from_first_child]
+  classes << shared_helper.get_margin_bottom
 
   within_multitype_list ||= false
   within_multitype_list_class = " gem-c-document-list__multi-list" if within_multitype_list
@@ -19,7 +20,7 @@
 %>
 <% if items.any? %>
   <% unless within_multitype_list %>
-    <ul class="<%= classes %>">
+    <ul class="<%= classes.join(" ") %>">
   <% end %>
     <% items.each do |item| %>
       <% highlight_class = " gem-c-document-list__item--highlight" if item[:highlight] %>

data/app/views/govuk_publishing_components/components/_layout_for_public.html.erb

@@ -3,9 +3,11 @@
 
   emergency_banner ||= nil
   full_width ||= false
+  blue_bar ||= local_assigns.include?(:blue_bar) ? local_assigns[:blue_bar] : !full_width
   global_bar ||= nil
   html_lang ||= "en"
   layout_helper = GovukPublishingComponents::Presenters::PublicLayoutHelper.new(local_assigns)
+  blue_bar_background_colour = layout_helper.blue_bar_background_colours.include?(blue_bar_background_colour) ? blue_bar_background_colour : nil
   logo_link ||= "/"
   navigation_items ||= []
   omit_feedback_form ||= false
@@ -44,6 +46,9 @@
   blue_bar_dedupe = !full_width && global_bar.present?
   body_css_classes = %w(gem-c-layout-for-public govuk-template__body)
   body_css_classes << "draft" if draft_watermark
+
+  blue_bar_wrapper_classes = %w()
+  blue_bar_wrapper_classes << "gem-c-layout-for-public__blue-bar-wrapper--#{blue_bar_background_colour}" if blue_bar_background_colour
 -%>
 <!DOCTYPE html>
   <!--[if lt IE 9]><html class="lte-ie8 govuk-template" lang="<%= html_lang %>"><![endif]-->
@@ -117,8 +122,10 @@
 
     <%= raw(emergency_banner) %>
 
-    <% unless full_width %>
-      <div class="gem-c-layout-for-public__blue-bar govuk-width-container"></div>
+    <% if (blue_bar && !global_bar.present?) || (blue_bar_dedupe) %>
+      <%= content_tag(:div, class: blue_bar_wrapper_classes) do %>
+        <div class="gem-c-layout-for-public__blue-bar govuk-width-container"></div>
+      <% end %>
     <% end %>
 
     <% if global_bar.present? %>

data/app/views/govuk_publishing_components/components/_metadata.html.erb

@@ -20,6 +20,11 @@
   classes << shared_helper.get_margin_bottom if local_assigns[:margin_bottom]
 
   ga4_tracking ||= false
+  ga4_object = {
+    event_name: "navigation",
+    type: "content",
+    section: "Top"
+  }.to_json
 %>
 <%= content_tag :div, class: classes, data: { module: "gem-toggle metadata" } do %>
   <dl class="gem-c-metadata__list" data-module="gem-track-click">
@@ -48,19 +53,15 @@
       <dd class="gem-c-metadata__definition">
         <%= last_updated %>
         <% if local_assigns.include?(:see_updates_link) %>
-          &#8212; <a href="#full-publication-update-history" class="gem-c-metadata__definition-link govuk-!-display-none-print js-see-all-updates-link"
-                             data-track-category="content-history"
-                             data-track-action="see-all-updates-link-clicked"
-                             data-track-label="history"
-                             <% if ga4_tracking %>
-                              data-module="ga4-link-tracker"
-                              data-ga4-link="<%= {
-                                event_name: "navigation",
-                                type: "content",
-                                section: "Top"
-                              }.to_json %>"
-                             <% end%>
-                             >
+          &#8212; <a href="#full-publication-update-history"
+                    class="gem-c-metadata__definition-link govuk-!-display-none-print js-see-all-updates-link"
+                    data-track-category="content-history"
+                    data-track-action="see-all-updates-link-clicked"
+                    data-track-label="history"
+                    <% if ga4_tracking %>
+                      data-module="ga4-link-tracker"
+                      data-ga4-link="<%= ga4_object %>"
+                    <% end%>>
             <%= t("components.metadata.see_all_updates") %>
           </a>
         <% end %>
@@ -74,7 +75,12 @@
         %>
         <% if definition.any? %>
           <dt class="gem-c-metadata__term"><%= title %>:</dt>
-          <dd class="gem-c-metadata__definition">
+          <dd class="gem-c-metadata__definition"
+              <% if ga4_tracking %>
+                data-module="ga4-link-tracker"
+                data-ga4-track-links-only
+                data-ga4-link="<%= ga4_object %>"
+              <% end%>>
             <%= render 'govuk_publishing_components/components/metadata/sentence', items: definition, toggle_id: "#{index}-#{SecureRandom.hex(4)}" %>
           </dd>
         <% end %>

data/app/views/govuk_publishing_components/components/_single_page_notification_button.html.erb

@@ -1,25 +1,37 @@
 <%
   add_gem_component_stylesheet("single-page-notification-button")
 
-  component_helper = GovukPublishingComponents::Presenters::SinglePageNotificationButtonHelper.new(local_assigns)
+  spnb_helper = GovukPublishingComponents::Presenters::SinglePageNotificationButtonHelper.new(local_assigns)
   shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
+  component_helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
 
   wrapper_classes = %w(govuk-!-display-none-print)
   wrapper_classes << shared_helper.get_margin_bottom
+
+  ga4_data_attributes = ga4_data_attributes ||= nil
+  ga4_link_data_attributes = ga4_data_attributes[:ga4_link] if ga4_data_attributes
+  ga4_link_data_attributes[:url] = spnb_helper.form_action if ga4_link_data_attributes
+
+  component_helper.add_class(wrapper_classes.join(" "))
+  component_helper.add_data_attribute({ module: "gem-track-click" })
+  component_helper.add_data_attribute({ module: ga4_data_attributes[:module] }) if ga4_data_attributes
 %>
 <% button_text = capture do %>
-  <svg class="gem-c-single-page-notification-button__icon" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 459.334 459.334"><path fill="currentColor" d="M177.216 404.514c-.001.12-.009.239-.009.359 0 30.078 24.383 54.461 54.461 54.461s54.461-24.383 54.461-54.461c0-.12-.008-.239-.009-.359H175.216zM403.549 336.438l-49.015-72.002v-89.83c0-60.581-43.144-111.079-100.381-122.459V24.485C254.152 10.963 243.19 0 229.667 0s-24.485 10.963-24.485 24.485v27.663c-57.237 11.381-100.381 61.879-100.381 122.459v89.83l-49.015 72.002a24.76 24.76 0 0 0 20.468 38.693H383.08a24.761 24.761 0 0 0 20.469-38.694z"/></svg><span class="gem-c-single-page-notication-button__text"><%= component_helper.button_text %></span>
+  <svg class="gem-c-single-page-notification-button__icon" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 459.334 459.334"><path fill="currentColor" d="M177.216 404.514c-.001.12-.009.239-.009.359 0 30.078 24.383 54.461 54.461 54.461s54.461-24.383 54.461-54.461c0-.12-.008-.239-.009-.359H175.216zM403.549 336.438l-49.015-72.002v-89.83c0-60.581-43.144-111.079-100.381-122.459V24.485C254.152 10.963 243.19 0 229.667 0s-24.485 10.963-24.485 24.485v27.663c-57.237 11.381-100.381 61.879-100.381 122.459v89.83l-49.015 72.002a24.76 24.76 0 0 0 20.468 38.693H383.08a24.761 24.761 0 0 0 20.469-38.694z"/></svg><span class="gem-c-single-page-notication-button__text"><%= spnb_helper.button_text %></span>
 <% end %>
-<%= tag.div class: wrapper_classes, data: { module: "gem-track-click"} do %>
-  <%= tag.form class: component_helper.classes, action: component_helper.form_action, method: "POST", data: component_helper.data do %>
-    <input type="hidden" name="base_path" value="<%= component_helper.base_path %>">
-    <% if component_helper.skip_account %>
-      <input type="hidden" name="<%= component_helper.skip_account_param %>" value="true">
-      <input type="hidden" name="link" value="<%= component_helper.base_path %>">
+<%= tag.div(**component_helper.all_attributes) do %>
+  <%= tag.form class: spnb_helper.classes, action: spnb_helper.form_action, method: "POST", data: spnb_helper.data do %>
+    <input type="hidden" name="base_path" value="<%= spnb_helper.base_path %>">
+    <% if spnb_helper.skip_the_gov_uk_account? %>
+      <input type="hidden" name="<%= spnb_helper.skip_account_param %>" value="true">
+      <input type="hidden" name="link" value="<%= spnb_helper.base_path %>">
     <% end %>
     <%= content_tag(:button, button_text, {
       class: "govuk-body-s gem-c-single-page-notification-button__submit",
       type: "submit",
+      data: {
+        ga4_link: ga4_link_data_attributes
+      }
     }) %>
   <% end %>
-<% end if component_helper.base_path %>
+<% end if spnb_helper.base_path %>

data/app/views/govuk_publishing_components/components/_step_by_step_nav_related.html.erb

@@ -26,7 +26,7 @@
             <% if ga4_tracking 
               ga4_attributes = {
                 event_name: "navigation",
-                type: "related content",
+                type: "part of",
                 index:{
                   "index_link": "1"
                 },
@@ -56,7 +56,7 @@
                 <% if ga4_tracking 
                   ga4_attributes = {
                     event_name: "navigation",
-                    type: "related content",
+                    type: "part of",
                     index:{
                       "index_link": (index + 1).to_s
                     },

data/app/views/govuk_publishing_components/components/docs/document_list.yml

@@ -37,6 +37,23 @@ examples:
         metadata:
           public_updated_at: 2016-09-05 16:48:27
           document_type: 'Statutory guidance'
+  with_margin:
+    description: The component accepts a number for margin bottom from `0` to `9` (`0px` to `60px`) using the [GOV.UK Frontend spacing scale](https://design-system.service.gov.uk/styles/spacing/#the-responsive-spacing-scale). It defaults to having a margin bottom of 5 (25px).
+    data:
+      margin_bottom: 9
+      items:
+      - link:
+          text: 'Alternative provision'
+          path: '/government/publications/alternative-provision'
+        metadata:
+          public_updated_at: 2016-06-27 10:29:44
+          document_type: 'Statutory guidance'
+      - link:
+          text: 'Behaviour and discipline in schools: guide for governing bodies'
+          path: '/government/publications/behaviour-and-discipline-in-schools-guidance-for-governing-bodies'
+        metadata:
+          public_updated_at: 2015-09-24 16:42:48
+          document_type: 'Statutory guidance'
   without_links:
     data:
       items:

data/app/views/govuk_publishing_components/components/docs/layout_for_public.yml

@@ -27,6 +27,12 @@ examples:
     description: This allows the header to be omitted which is currently used when rendering CSV previews from Whitehall
     data:
       omit_header: true
+  blue_bar_background:
+    description: For use when a page has a heading component with a background colour.
+    data:
+      full_width: true
+      blue_bar: true
+      blue_bar_background_colour: "no"
   omit_feedback:
     description: This allows the feedback form to be omitted
     data:

data/app/views/govuk_publishing_components/components/docs/notice.yml

@@ -35,7 +35,7 @@ examples:
       title: 'Advisory Committee on Novel Foods and Processes has a <a href="http://www.food.gov.uk/acnfp">separate website</a>'
   without_title:
     data:
-      description_govspeak: '<p>Scheduled to publish at 8am on 25 April 2019<br/><a href="change-date">Change date</a><br/><a href="stop-scheduled-publishing">Stop scheduled publishing</a></p>'
+      description_govspeak: '<p>Scheduled to publish at 8am on 25 April 2019</p><ul><li><a href="change-date">Change date</a></li><li><a href="stop-scheduled-publishing">Stop scheduled publishing</a></li></ul>'
   with_aria_live:
     description: Passing the aria live flag to the notice component will read the notice out to users if the notice changes, e.g on form submission the notice may go from hidden to visible.
     data:

data/app/views/govuk_publishing_components/components/docs/single_page_notification_button.yml

@@ -25,6 +25,19 @@ examples:
       base_path: '/current-page-path'
       data_attributes:
         test_attribute: "testing"
+  with_ga4_tracking:
+    description: To add GA4 tracking, pass a `ga4_data_attributes` object with the necessary properties to the component. For example:-
+    data:
+      base_path: '/current-page-path'
+      ga4_data_attributes:
+        module: "ga4-link-tracker"
+        ga4_link:
+          event_name: "navigation"
+          type: "subscribe"
+          index:
+            index_link: 1
+          index_total: 1
+          section: "Top"
   with_margin_bottom:
     description: |
       The component accepts a number for margin bottom from `0` to `9` (`0px` to `60px`) using the [GOV.UK Frontend spacing scale](https://design-system.service.gov.uk/styles/spacing/#the-responsive-spacing-scale). It defaults to having a margin bottom of 15px.

data/lib/govuk_publishing_components/app_helpers/asset_helper.rb

@@ -87,7 +87,7 @@ module GovukPublishingComponents
       end
 
       def viewing_component_guide?
-        request.path.include?("/component-guide")
+        request&.path&.include?("/component-guide")
       end
     end
   end

data/lib/govuk_publishing_components/presenters/public_layout_helper.rb

@@ -1,6 +1,7 @@
 module GovukPublishingComponents
   module Presenters
     class PublicLayoutHelper
+      BLUE_BAR_BACKGROUND_COLOURS = %w[browse].freeze
       FOOTER_NAVIGATION_COLUMNS = [2, 1].freeze
       FOOTER_TRACK_ACTIONS = %w[topicsLink governmentactivityLink].freeze
       FOOTER_META = {
@@ -69,6 +70,10 @@ module GovukPublishingComponents
         FOOTER_TRACK_ACTIONS
       end
 
+      def blue_bar_background_colours
+        BLUE_BAR_BACKGROUND_COLOURS
+      end
+
       def generate_data_attribute(link, track_action)
         {
           track_category: "footerClicked",

data/lib/govuk_publishing_components/presenters/single_page_notification_button_helper.rb

@@ -61,7 +61,11 @@ module GovukPublishingComponents
       end
 
       def form_action
-        @skip_account ? email_alert_frontend_endpoint_no_account : email_alert_frontend_endpoint_enforce_account
+        if skip_the_gov_uk_account?
+          email_alert_frontend_endpoint_no_account
+        else
+          email_alert_frontend_endpoint_enforce_account
+        end
       end
 
       def email_alert_frontend_endpoint_enforce_account
@@ -75,6 +79,10 @@ module GovukPublishingComponents
       def skip_account_param
         "single_page_subscription"
       end
+
+      def skip_the_gov_uk_account?
+        @skip_account == "true"
+      end
     end
   end
 end

data/lib/govuk_publishing_components/version.rb

@@ -1,3 +1,3 @@
 module GovukPublishingComponents
-  VERSION = "35.7.0".freeze
+  VERSION = "35.9.0".freeze
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: govuk_publishing_components
 version: !ruby/object:Gem::Version
-  version: 35.7.0
+  version: 35.9.0
 platform: ruby
 authors:
 - GOV.UK Dev
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2023-06-14 00:00:00.000000000 Z
+date: 2023-07-03 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: govuk_app_config
@@ -1455,7 +1455,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.4.14
+rubygems_version: 3.4.15
 signing_key: 
 specification_version: 4
 summary: A gem to document components in GOV.UK frontend applications