@financial-times/custom-code-component - npm Package Compare versions

Comparing version 2.1.7 to 2.2.0

dist/client-metrics-adaptor.d.ts

@@ -31,3 +31,3 @@ declare class CCCEvent extends Event {
 
-export declare const DEFAULT_VALUE = "uknown";
+export declare const DEFAULT_VALUE = "unknown";
 
@@ -61,6 +61,8 @@ export declare const EVENT_TYPES: Record<string, EventType>;
  * If there's any pending event, it'll send them to the Metrics server
- * @param _metricsClient MetricClient instance
+ * @param _metricsClient MetricsClient instance
  * @param _options Options to configure adaptor
+ * @param _newMetricsClient NewMetricsClient instance. We keep it optional so it wont break if host apps are not passing the new MetricsClient yet
+ * After complete migration, we want to revert back to only one MetricsClient instance
  */
-export declare function init(_metricsClient: MetricsClient, _options?: Options): void;
+export declare function init(_metricsClient: MetricsClient, _options?: Options, _newMetricsClient?: MetricsClient): void;
 
@@ -67,0 +69,0 @@ export declare const MAX_PENDING_EVENTS = 50;

dist/client-metrics-adaptor.js

@@ -1,19 +0,19 @@
-const f = Object.freeze({
+const g = Object.freeze({
   "ccc:ready": {
     namespace: "ccc.success",
-    payloadFn: y
+    payloadFn: o
   },
   "ccc:error": {
     namespace: "ccc.failure",
-    payloadFn: w
+    payloadFn: v
   }
-}), i = "uknown", t = [], g = 50;
-let s, r, a = !1;
+}), i = "unknown", t = [], y = 50;
+let a, r, s = !1, u;
 function h() {
-  a || (window.addEventListener("ccc:error", u), window.addEventListener("ccc:ready", u)), a = !0;
+  s || (window.addEventListener("ccc:error", d), window.addEventListener("ccc:ready", d)), s = !0;
 }
-function o() {
-  a && (window.removeEventListener("ccc:error", u), window.removeEventListener("ccc:ready", u)), a = !1, t.length = 0, s = null, r = {};
+function L() {
+  s && (window.removeEventListener("ccc:error", d), window.removeEventListener("ccc:ready", d)), s = !1, t.length = 0, a = null, u = null, r = {};
 }
-function v(e, c) {
+function A(e, c, n) {
   if (!e || typeof e.recordEvent != "function") {
@@ -23,5 +23,5 @@ console.warn("CCC Can't initialise MetricsClientAdaptor");
   }
-  s = e, r = {}, typeof (c == null ? void 0 : c.shouldIgnoreEventCb) == "function" && (r.shouldIgnoreEventCb = c.shouldIgnoreEventCb), typeof (c == null ? void 0 : c.enrichEventCb) == "function" && (r.enrichEventCb = c.enrichEventCb), b(), h();
+  a = e, n && typeof n.recordEvent == "function" && (u = n), r = {}, typeof (c == null ? void 0 : c.shouldIgnoreEventCb) == "function" && (r.shouldIgnoreEventCb = c.shouldIgnoreEventCb), typeof (c == null ? void 0 : c.enrichEventCb) == "function" && (r.enrichEventCb = c.enrichEventCb), w(), h();
 }
-function d(e) {
+function l(e) {
   var c;
@@ -37,3 +37,3 @@ try {
 }
-function l(e) {
+function f(e) {
   return {
@@ -46,13 +46,13 @@ name: (e == null ? void 0 : e.name) || i,
 }
-function y(e) {
+function o(e) {
   return {
-    ...d(e),
-    component: l(e.component)
+    ...l(e),
+    component: f(e.component)
   };
 }
-function w(e) {
+function v(e) {
   const c = e, n = c.error;
   return {
-    ...d(e),
-    component: l(n == null ? void 0 : n.component),
+    ...l(e),
+    component: f(n == null ? void 0 : n.component),
     error: (n == null ? void 0 : n.name) || i,
@@ -65,7 +65,7 @@ errorMessage: c.message || (n == null ? void 0 : n.message) || i
     return;
-  if (!s) {
+  if (!a) {
     console.warn("CCC Couldn't process event: ClientMetrics not initialised");
     return;
   }
-  const c = f[e.type];
+  const c = g[e.type];
   if (!c) {
@@ -75,12 +75,17 @@ console.warn("CCC event.type not registered");
   }
-  s.recordEvent(c.namespace, c.payloadFn(e));
+  const n = c.payloadFn(e);
+  if (a.recordEvent(c.namespace, n), u)
+    try {
+      u.recordEvent(c.namespace, n);
+    } catch {
+    }
 }
-function u(e) {
+function d(e) {
   const c = e;
-  s ? E(c) : (t.push({ event: c, time: Date.now() }), t.splice(0, t.length - g));
+  a ? E(c) : (t.push({ event: c, time: Date.now() }), t.splice(0, t.length - y));
 }
-function b() {
+function w() {
   t.forEach(({ event: e }) => E(e)), t.length = 0;
 }
-function L() {
+function I() {
   return t;
@@ -90,16 +95,16 @@ }
   i as DEFAULT_VALUE,
-  f as EVENT_TYPES,
-  g as MAX_PENDING_EVENTS,
-  l as getComponentProps,
-  d as getEnrichEventProps,
-  w as getErrorPayload,
-  L as getPendingEventsQueue,
-  y as getSuccessPayload,
-  v as init,
-  u as onEventReceived,
+  g as EVENT_TYPES,
+  y as MAX_PENDING_EVENTS,
+  f as getComponentProps,
+  l as getEnrichEventProps,
+  v as getErrorPayload,
+  I as getPendingEventsQueue,
+  o as getSuccessPayload,
+  A as init,
+  d as onEventReceived,
   E as processEvent,
-  b as sendPendingEvents,
+  w as sendPendingEvents,
   h as startListeners,
-  o as stopListeners
+  L as stopListeners
 };
 //# sourceMappingURL=client-metrics-adaptor.js.map

dist/client-metrics-adaptor.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"client-metrics-adaptor.js","sources":["../src/client-metrics-adaptor.ts"],"sourcesContent":["// MetricsClient type from https://github.com/Financial-Times/dotcom-reliability-kit/tree/main/packages/client-metrics-web\n// We intentionally copied this type here to avoid having version conflicts between this module and it's client\nimport type { ComponentPathType } from './path'\nimport type { CCCEvent } from './events'\n\nexport type MetricsClient = {\n  recordEvent: (namespace: string, payload?: Record<string, unknown>) => void\n};\n\nexport type GenericCCCEvent = CCCEvent | ErrorEvent;\n\ntype Options = {\n  enrichEventCb?: (event: GenericCCCEvent) => Record<string, unknown> | void\n  shouldIgnoreEventCb?: (event: GenericCCCEvent) => boolean\n};\n\ntype PendingEvent = {\n  time: number\n  event: GenericCCCEvent\n};\n\ntype EventType = {\n  namespace: string\n  payloadFn: (event: GenericCCCEvent) => Record<string, unknown>\n};\n\nexport const EVENT_TYPES: Record<string, EventType> = Object.freeze({\n  'ccc:ready': {\n    namespace: 'ccc.success',\n    payloadFn: getSuccessPayload,\n  },\n  'ccc:error': {\n    namespace: 'ccc.failure',\n    payloadFn: getErrorPayload,\n  },\n});\n\nexport const DEFAULT_VALUE = 'uknown';\n\nconst pendingEvents: PendingEvent[] = [];\nexport const MAX_PENDING_EVENTS = 50;\nlet metricsClient: MetricsClient | null;\nlet options: Options;\nlet isRunning = false;\n\n/**\n * Start listening to CCC events\n * In case there's no MetricsClient registered, it'll store them until they can be sent\n */\nexport function startListeners() {\n  if (!isRunning) {\n    window.addEventListener('ccc:error', onEventReceived);\n    window.addEventListener('ccc:ready', onEventReceived);\n  }\n  isRunning = true;\n}\n\n/**\n * Stop listening CCC events\n */\nexport function stopListeners() {\n  if (isRunning) {\n    window.removeEventListener('ccc:error', onEventReceived);\n    window.removeEventListener('ccc:ready', onEventReceived);\n  }\n\n  isRunning = false;\n  pendingEvents.length = 0;\n  metricsClient = null;\n  options = {};\n}\n\n/**\n * Initialises the Adaptor with the provided configuration and starts listening to CCC events.\n * If there's any pending event, it'll send them to the Metrics server\n * @param _metricsClient MetricClient instance\n * @param _options Options to configure adaptor\n */\nexport function init(_metricsClient: MetricsClient, _options?: Options) {\n  if (!_metricsClient || typeof _metricsClient.recordEvent !== 'function') {\n    console.warn(\"CCC Can't initialise MetricsClientAdaptor\");\n    return;\n  }\n\n  metricsClient = _metricsClient;\n\n  options = {};\n  if (typeof _options?.shouldIgnoreEventCb === 'function') {\n    options.shouldIgnoreEventCb = _options.shouldIgnoreEventCb;\n  }\n  if (typeof _options?.enrichEventCb === 'function') {\n    options.enrichEventCb = _options.enrichEventCb;\n  }\n\n  sendPendingEvents();\n  startListeners();\n}\n\nexport function getEnrichEventProps(event: GenericCCCEvent) {\n  try {\n    const props = options?.enrichEventCb?.(event) || {};\n    if (typeof props !== 'object' || Array.isArray(props)) {\n      throw new TypeError('Enrich event callback returned invalid value');\n    }\n    return props;\n  } catch (error) {\n    console.error(\"CCC RUM event couldn't be enriched\", error);\n    return {};\n  }\n}\n\nexport function getComponentProps(eventComponentProp: ComponentPathType) {\n  return {\n    name: eventComponentProp?.name || DEFAULT_VALUE,\n    org: eventComponentProp?.org || DEFAULT_VALUE,\n    repo: eventComponentProp?.repo || DEFAULT_VALUE,\n    versionRange: eventComponentProp?.versionRange || DEFAULT_VALUE,\n  };\n}\n\nexport function getSuccessPayload(event: GenericCCCEvent): Record<string, unknown> {\n  return {\n    ...getEnrichEventProps(event),\n    component: getComponentProps((event as CCCEvent).component),\n  };\n}\n\nexport function getErrorPayload(event: GenericCCCEvent): Record<string, unknown> {\n  const errorEvent = (event as ErrorEvent);\n  const error = errorEvent.error;\n\n  return {\n    ...getEnrichEventProps(event),\n    component: getComponentProps(error?.component),\n    error: error?.name || DEFAULT_VALUE,\n    errorMessage: errorEvent.message || error?.message || DEFAULT_VALUE,\n  };\n}\n\nexport function processEvent(event: GenericCCCEvent) {\n  // Stop processing the event if we should ignore it\n  if (options.shouldIgnoreEventCb && options.shouldIgnoreEventCb(event)) {\n    return;\n  }\n\n  if (!metricsClient) {\n    console.warn(\"CCC Couldn't process event: ClientMetrics not initialised\");\n    return;\n  }\n\n  const eventType = EVENT_TYPES[event.type];\n  if (!eventType) {\n    console.warn('CCC event.type not registered');\n    return;\n  }\n\n  metricsClient.recordEvent(eventType.namespace, eventType.payloadFn(event));\n}\n\nexport function onEventReceived(_event: Event) {\n  // The Event object dispatched from the CCC has extra custom props\n  const event = _event as GenericCCCEvent\n\n  if (metricsClient) {\n    processEvent(event);\n  } else {\n    pendingEvents.push({ event: event, time: Date.now() });\n    // keep only the last MAX_PENDING_EVENTS events (FIFO)\n    pendingEvents.splice(0, pendingEvents.length - MAX_PENDING_EVENTS);\n  }\n}\n\n/**\n * Sends all pending events waiting to be processed\n *\n * Notes:\n * 1. All these events will be registered in RUM with the same time\n * (at this moment the MetricsClient API doesn't allow to override it)\n * 2. It's safe to process them in bulk since ClientMetrics will send them in bulk\n * (all in 1 request)\n */\nexport function sendPendingEvents() {\n  pendingEvents.forEach(({ event }) => processEvent(event));\n  pendingEvents.length = 0;\n}\n\nexport function getPendingEventsQueue() {\n  return pendingEvents;\n}\n"],"names":["EVENT_TYPES","getSuccessPayload","getErrorPayload","DEFAULT_VALUE","pendingEvents","MAX_PENDING_EVENTS","metricsClient","options","isRunning","startListeners","onEventReceived","stopListeners","init","_metricsClient","_options","sendPendingEvents","getEnrichEventProps","event","_a","props","error","getComponentProps","eventComponentProp","errorEvent","processEvent","eventType","_event","getPendingEventsQueue"],"mappings":"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"}
+{"version":3,"file":"client-metrics-adaptor.js","sources":["../src/client-metrics-adaptor.ts"],"sourcesContent":["// MetricsClient type from https://github.com/Financial-Times/dotcom-reliability-kit/tree/main/packages/client-metrics-web\n// We intentionally copied this type here to avoid having version conflicts between this module and its client\nimport type { ComponentPathType } from './path'\nimport type { CCCEvent } from './events'\n\nexport type MetricsClient = {\n  recordEvent: (namespace: string, payload?: Record<string, unknown>) => void\n};\n\nexport type GenericCCCEvent = CCCEvent | ErrorEvent;\n\ntype Options = {\n  enrichEventCb?: (event: GenericCCCEvent) => Record<string, unknown> | void\n  shouldIgnoreEventCb?: (event: GenericCCCEvent) => boolean\n};\n\ntype PendingEvent = {\n  time: number\n  event: GenericCCCEvent\n};\n\ntype EventType = {\n  namespace: string\n  payloadFn: (event: GenericCCCEvent) => Record<string, unknown>\n};\n\nexport const EVENT_TYPES: Record<string, EventType> = Object.freeze({\n  'ccc:ready': {\n    namespace: 'ccc.success',\n    payloadFn: getSuccessPayload,\n  },\n  'ccc:error': {\n    namespace: 'ccc.failure',\n    payloadFn: getErrorPayload,\n  },\n});\n\nexport const DEFAULT_VALUE = 'unknown';\n\nconst pendingEvents: PendingEvent[] = [];\nexport const MAX_PENDING_EVENTS = 50;\nlet metricsClient: MetricsClient | null;\nlet options: Options;\nlet isRunning = false;\n\n// We are adding the new MetricsClient (v2) in parallel to the old one to facilitate migration.\n// Once we know the new server receives the same events, and the dashboards have been replaced,\n// we can go back to passing and initialising only one MetricsClient\nlet newMetricsClient: MetricsClient | null;\n\n/**\n * Start listening to CCC events\n * In case there's no MetricsClient registered, it'll store them until they can be sent\n */\nexport function startListeners() {\n  if (!isRunning) {\n    window.addEventListener('ccc:error', onEventReceived);\n    window.addEventListener('ccc:ready', onEventReceived);\n  }\n  isRunning = true;\n}\n\n/**\n * Stop listening CCC events\n */\nexport function stopListeners() {\n  if (isRunning) {\n    window.removeEventListener('ccc:error', onEventReceived);\n    window.removeEventListener('ccc:ready', onEventReceived);\n  }\n\n  isRunning = false;\n  pendingEvents.length = 0;\n  metricsClient = null;\n  newMetricsClient = null;\n  options = {};\n}\n\n/**\n * Initialises the Adaptor with the provided configuration and starts listening to CCC events.\n * If there's any pending event, it'll send them to the Metrics server\n * @param _metricsClient MetricsClient instance\n * @param _options Options to configure adaptor\n * @param _newMetricsClient NewMetricsClient instance. We keep it optional so it wont break if host apps are not passing the new MetricsClient yet\n * After complete migration, we want to revert back to only one MetricsClient instance\n */\nexport function init(_metricsClient: MetricsClient, _options?: Options, _newMetricsClient?: MetricsClient) {\n  if (!_metricsClient || typeof _metricsClient.recordEvent !== 'function') {\n    console.warn(\"CCC Can't initialise MetricsClientAdaptor\");\n    return;\n  }\n\n  metricsClient = _metricsClient;\n\n  // As this is a temporary state to help migration, we first want to be as little intrusive as possible\n  // If a newMetricsClient is passed, we can initialise it, else, we don't do anything\n  if (_newMetricsClient && typeof _newMetricsClient.recordEvent === 'function') {\n    newMetricsClient = _newMetricsClient;\n  }\n\n  options = {};\n  if (typeof _options?.shouldIgnoreEventCb === 'function') {\n    options.shouldIgnoreEventCb = _options.shouldIgnoreEventCb;\n  }\n  if (typeof _options?.enrichEventCb === 'function') {\n    options.enrichEventCb = _options.enrichEventCb;\n  }\n\n  sendPendingEvents();\n  startListeners();\n}\n\nexport function getEnrichEventProps(event: GenericCCCEvent) {\n  try {\n    const props = options?.enrichEventCb?.(event) || {};\n    if (typeof props !== 'object' || Array.isArray(props)) {\n      throw new TypeError('Enrich event callback returned invalid value');\n    }\n    return props;\n  } catch (error) {\n    console.error(\"CCC RUM event couldn't be enriched\", error);\n    return {};\n  }\n}\n\nexport function getComponentProps(eventComponentProp: ComponentPathType) {\n  return {\n    name: eventComponentProp?.name || DEFAULT_VALUE,\n    org: eventComponentProp?.org || DEFAULT_VALUE,\n    repo: eventComponentProp?.repo || DEFAULT_VALUE,\n    versionRange: eventComponentProp?.versionRange || DEFAULT_VALUE,\n  };\n}\n\nexport function getSuccessPayload(event: GenericCCCEvent): Record<string, unknown> {\n  return {\n    ...getEnrichEventProps(event),\n    component: getComponentProps((event as CCCEvent).component),\n  };\n}\n\nexport function getErrorPayload(event: GenericCCCEvent): Record<string, unknown> {\n  const errorEvent = (event as ErrorEvent);\n  const error = errorEvent.error;\n\n  return {\n    ...getEnrichEventProps(event),\n    component: getComponentProps(error?.component),\n    error: error?.name || DEFAULT_VALUE,\n    errorMessage: errorEvent.message || error?.message || DEFAULT_VALUE,\n  };\n}\n\nexport function processEvent(event: GenericCCCEvent) {\n  // Stop processing the event if we should ignore it\n  if (options.shouldIgnoreEventCb && options.shouldIgnoreEventCb(event)) {\n    return;\n  }\n\n  if (!metricsClient) {\n    console.warn(\"CCC Couldn't process event: ClientMetrics not initialised\");\n    return;\n  }\n\n  const eventType = EVENT_TYPES[event.type];\n  if (!eventType) {\n    console.warn('CCC event.type not registered');\n    return;\n  }\n\n  const payload = eventType.payloadFn(event);\n\n  metricsClient.recordEvent(eventType.namespace, payload);\n\n  // As this is a temporary state to help migration, we first want to be as little intrusive as possible\n  // If we have a newMetricsClient we record the event. Else, we dont do anything\n  if (newMetricsClient) {\n    try {\n      newMetricsClient.recordEvent(eventType.namespace, payload);\n    } catch (_) {}\n  }\n}\n\nexport function onEventReceived(_event: Event) {\n  // The Event object dispatched from the CCC has extra custom props\n  const event = _event as GenericCCCEvent\n\n  if (metricsClient) {\n    processEvent(event);\n  } else {\n    pendingEvents.push({ event: event, time: Date.now() });\n    // keep only the last MAX_PENDING_EVENTS events (FIFO)\n    pendingEvents.splice(0, pendingEvents.length - MAX_PENDING_EVENTS);\n  }\n}\n\n/**\n * Sends all pending events waiting to be processed\n *\n * Notes:\n * 1. All these events will be registered in RUM with the same time\n * (at this moment the MetricsClient API doesn't allow to override it)\n * 2. It's safe to process them in bulk since ClientMetrics will send them in bulk\n * (all in 1 request)\n */\nexport function sendPendingEvents() {\n  pendingEvents.forEach(({ event }) => processEvent(event));\n  pendingEvents.length = 0;\n}\n\nexport function getPendingEventsQueue() {\n  return pendingEvents;\n}\n"],"names":["EVENT_TYPES","getSuccessPayload","getErrorPayload","DEFAULT_VALUE","pendingEvents","MAX_PENDING_EVENTS","metricsClient","options","isRunning","newMetricsClient","startListeners","onEventReceived","stopListeners","init","_metricsClient","_options","_newMetricsClient","sendPendingEvents","getEnrichEventProps","event","_a","props","error","getComponentProps","eventComponentProp","errorEvent","processEvent","eventType","payload","_event","getPendingEventsQueue"],"mappings":"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"}

package.json

 {
   "name": "@financial-times/custom-code-component",
-  "version": "2.1.7",
+  "version": "2.2.0",
   "type": "module",
@@ -5,0 +5,0 @@ "exports": {

src/client-metrics-adaptor.ts

 // MetricsClient type from https://github.com/Financial-Times/dotcom-reliability-kit/tree/main/packages/client-metrics-web
-// We intentionally copied this type here to avoid having version conflicts between this module and it's client
+// We intentionally copied this type here to avoid having version conflicts between this module and its client
 import type { ComponentPathType } from './path'
@@ -38,3 +38,3 @@ import type { CCCEvent } from './events'
 
-export const DEFAULT_VALUE = 'uknown';
+export const DEFAULT_VALUE = 'unknown';
 
@@ -47,2 +47,7 @@ const pendingEvents: PendingEvent[] = [];
 
+// We are adding the new MetricsClient (v2) in parallel to the old one to facilitate migration.
+// Once we know the new server receives the same events, and the dashboards have been replaced,
+// we can go back to passing and initialising only one MetricsClient
+let newMetricsClient: MetricsClient | null;
+
 /**
@@ -72,2 +77,3 @@ * Start listening to CCC events
   metricsClient = null;
+  newMetricsClient = null;
   options = {};
@@ -79,6 +85,8 @@ }
  * If there's any pending event, it'll send them to the Metrics server
- * @param _metricsClient MetricClient instance
+ * @param _metricsClient MetricsClient instance
  * @param _options Options to configure adaptor
+ * @param _newMetricsClient NewMetricsClient instance. We keep it optional so it wont break if host apps are not passing the new MetricsClient yet
+ * After complete migration, we want to revert back to only one MetricsClient instance
  */
-export function init(_metricsClient: MetricsClient, _options?: Options) {
+export function init(_metricsClient: MetricsClient, _options?: Options, _newMetricsClient?: MetricsClient) {
   if (!_metricsClient || typeof _metricsClient.recordEvent !== 'function') {
@@ -91,2 +99,8 @@ console.warn("CCC Can't initialise MetricsClientAdaptor");
 
+  // As this is a temporary state to help migration, we first want to be as little intrusive as possible
+  // If a newMetricsClient is passed, we can initialise it, else, we don't do anything
+  if (_newMetricsClient && typeof _newMetricsClient.recordEvent === 'function') {
+    newMetricsClient = _newMetricsClient;
+  }
+
   options = {};
@@ -162,3 +176,13 @@ if (typeof _options?.shouldIgnoreEventCb === 'function') {
 
-  metricsClient.recordEvent(eventType.namespace, eventType.payloadFn(event));
+  const payload = eventType.payloadFn(event);
+
+  metricsClient.recordEvent(eventType.namespace, payload);
+
+  // As this is a temporary state to help migration, we first want to be as little intrusive as possible
+  // If we have a newMetricsClient we record the event. Else, we dont do anything
+  if (newMetricsClient) {
+    try {
+      newMetricsClient.recordEvent(eventType.namespace, payload);
+    } catch (_) {}
+  }
 }
@@ -165,0 +189,0 @@

No alert changes

Improved metrics

Total package byte prevSize

192337

0.73%

Lines of code

2687

1.02%

No dependency changes