@financial-times/cp-content-pipeline-ui 6.13.0-beta.0 → 6.13.0

package/lib/components/Topper/client/flourish-tracking.d.ts

@@ -1,14 +0,0 @@
-declare class FlourishTopperTracker {
-    private startTime;
-    private totalVisibleTime;
-    private timeElapsedSeconds;
-    private component;
-    private id;
-    private observer;
-    constructor();
-    init(): void;
-    private dispatchEvent;
-    private onChange;
-    disconnect(): void;
-}
-export { FlourishTopperTracker };

package/lib/components/Topper/client/flourish-tracking.js

@@ -1,69 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FlourishTopperTracker = void 0;
-class FlourishTopperTracker {
-    constructor() {
-        this.startTime = 0;
-        this.totalVisibleTime = 0;
-        this.timeElapsedSeconds = null;
-        this.component = document.querySelector('[data-component-type="flourish-topper"]');
-        this.id = this.component?.getAttribute('data-component-id') || null;
-        this.observer = null;
-    }
-    init() {
-        if (!window.IntersectionObserver || !this.component) {
-            return;
-        }
-        if (this.component) {
-            this.dispatchEvent('mount');
-        }
-        this.observer = new IntersectionObserver(this.onChange.bind(this), {
-            threshold: [1.0],
-        });
-        this.observer.observe(this.component);
-    }
-    dispatchEvent(action) {
-        let component = {
-            name: 'flourish-topper',
-            id: this.id,
-        };
-        if (this.timeElapsedSeconds) {
-            component = { ...component, timeElapsedSeconds: this.timeElapsedSeconds };
-        }
-        const event = new CustomEvent('oTracking.event', {
-            detail: {
-                category: 'component',
-                action: action,
-                component,
-            },
-            bubbles: true,
-        });
-        document.body.dispatchEvent(event);
-    }
-    onChange(changes) {
-        changes.forEach((change) => {
-            if (change.target !== this.component) {
-                return;
-            }
-            if (change.isIntersecting || change.intersectionRatio >= 1) {
-                this.dispatchEvent('view');
-                this.startTime = performance.now();
-            }
-            if (!change.isIntersecting || change.intersectionRatio === 0) {
-                this.totalVisibleTime = performance.now() - this.startTime;
-                this.timeElapsedSeconds = parseFloat((this.totalVisibleTime / 1000).toFixed(2));
-                this.dispatchEvent('stop-view');
-                this.totalVisibleTime = 0;
-                this.timeElapsedSeconds = null;
-            }
-        });
-    }
-    disconnect() {
-        if (this.observer && this.component) {
-            this.observer.unobserve(this.component);
-            this.observer.disconnect();
-        }
-    }
-}
-exports.FlourishTopperTracker = FlourishTopperTracker;
-//# sourceMappingURL=flourish-tracking.js.map

package/lib/components/Topper/client/flourish-tracking.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"flourish-tracking.js","sourceRoot":"","sources":["../../../../src/components/Topper/client/flourish-tracking.ts"],"names":[],"mappings":"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"}

package/lib/components/Topper/client/index.d.ts

@@ -1,2 +0,0 @@
-import { FlourishTopperTracker } from './flourish-tracking';
-export { FlourishTopperTracker };

package/lib/components/Topper/client/index.js

@@ -1,6 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FlourishTopperTracker = void 0;
-const flourish_tracking_1 = require("./flourish-tracking");
-Object.defineProperty(exports, "FlourishTopperTracker", { enumerable: true, get: function () { return flourish_tracking_1.FlourishTopperTracker; } });
-//# sourceMappingURL=index.js.map

package/lib/components/Topper/client/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Topper/client/index.ts"],"names":[],"mappings":";;;AAAA,2DAA2D;AAElD,sGAFA,yCAAqB,OAEA"}

package/lib/components/Topper/test/client/flourish-tracking.spec.d.ts

@@ -1 +0,0 @@
-export {};

package/lib/components/Topper/test/client/flourish-tracking.spec.js

@@ -1,117 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const client_1 = require("../../client");
-// const CustomEventMock = jest.fn()
-// global.CustomEvent = CustomEventMock
-describe('FlourishTopperTracker', () => {
-    let mockIntersectionObserver;
-    let mockObserve;
-    let mockUnobserve;
-    let mockDisconnect;
-    let mockComponent;
-    let dispatchEventSpy;
-    beforeEach(() => {
-        mockObserve = jest.fn();
-        mockUnobserve = jest.fn();
-        mockDisconnect = jest.fn();
-        mockIntersectionObserver = jest.fn(() => {
-            return {
-                observe: mockObserve,
-                unobserve: mockUnobserve,
-                disconnect: mockDisconnect,
-            };
-        });
-        window.IntersectionObserver = mockIntersectionObserver;
-        mockComponent = document.createElement('div');
-        mockComponent.setAttribute('data-component-type', 'flourish-topper');
-        mockComponent.setAttribute('data-component-id', 'test-id');
-        document.body.appendChild(mockComponent);
-        jest.spyOn(document, 'querySelector').mockReturnValue(mockComponent);
-        jest
-            .spyOn(performance, 'now')
-            .mockImplementationOnce(() => 1)
-            .mockImplementationOnce(() => 12344);
-        dispatchEventSpy = jest.spyOn(document.body, 'dispatchEvent');
-    });
-    afterEach(() => {
-        jest.clearAllMocks();
-        document.body.removeChild(mockComponent);
-    });
-    it('should initialise and observe the component', () => {
-        const tracker = new client_1.FlourishTopperTracker();
-        tracker.init();
-        expect(mockIntersectionObserver).toHaveBeenCalled();
-        expect(mockObserve).toHaveBeenCalledWith(mockComponent);
-    });
-    it('should dispatch a mount event on intialisation', () => {
-        const tracker = new client_1.FlourishTopperTracker();
-        tracker.init();
-        const mountEvent = dispatchEventSpy.mock.calls[0][0];
-        expect(mountEvent.type).toBe('oTracking.event');
-        expect(mountEvent.detail).toEqual({
-            category: 'component',
-            action: 'mount',
-            component: {
-                name: 'flourish-topper',
-                id: 'test-id',
-            },
-        });
-    });
-    it('should handle component visibility changes', () => {
-        const tracker = new client_1.FlourishTopperTracker();
-        tracker.init();
-        const mockChanges = [
-            {
-                target: mockComponent,
-                isIntersecting: true,
-                intersectionRatio: 1.0,
-                boundingClientRect: {},
-                intersectionRect: {},
-                rootBounds: null,
-                time: 1,
-            },
-        ];
-        tracker['onChange'](mockChanges);
-        const viewEvent = dispatchEventSpy.mock.calls[1][0];
-        expect(viewEvent.type).toBe('oTracking.event');
-        expect(viewEvent.detail).toEqual({
-            category: 'component',
-            action: 'view',
-            component: {
-                name: 'flourish-topper',
-                id: 'test-id',
-            },
-        });
-        const mockChangesAfter = [
-            {
-                target: mockComponent,
-                isIntersecting: false,
-                intersectionRatio: 0.0,
-                boundingClientRect: {},
-                intersectionRect: {},
-                rootBounds: null,
-                time: 12.3444,
-            },
-        ];
-        tracker['onChange'](mockChangesAfter);
-        const stopViewEvent = dispatchEventSpy.mock.calls[2][0];
-        expect(stopViewEvent.type).toBe('oTracking.event');
-        expect(stopViewEvent.detail).toEqual({
-            category: 'component',
-            action: 'stop-view',
-            component: {
-                name: 'flourish-topper',
-                id: 'test-id',
-                timeElapsedSeconds: 12.34,
-            },
-        });
-    });
-    it('should disconnect the observer', () => {
-        const tracker = new client_1.FlourishTopperTracker();
-        tracker.init();
-        tracker.disconnect();
-        expect(mockUnobserve).toHaveBeenCalledWith(mockComponent);
-        expect(mockDisconnect).toHaveBeenCalled();
-    });
-});
-//# sourceMappingURL=flourish-tracking.spec.js.map

package/lib/components/Topper/test/client/flourish-tracking.spec.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"flourish-tracking.spec.js","sourceRoot":"","sources":["../../../../../src/components/Topper/test/client/flourish-tracking.spec.ts"],"names":[],"mappings":"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"}

package/src/components/Topper/client/flourish-tracking.ts

@@ -1,83 +0,0 @@
-class FlourishTopperTracker {
-  private startTime: number
-  private totalVisibleTime: number
-  private timeElapsedSeconds: number | null
-  private component: Element | null
-  private id: string | null
-  private observer: IntersectionObserver | null
-
-  constructor() {
-    this.startTime = 0
-    this.totalVisibleTime = 0
-    this.timeElapsedSeconds = null
-    this.component = document.querySelector(
-      '[data-component-type="flourish-topper"]'
-    )
-    this.id = this.component?.getAttribute('data-component-id') || null
-    this.observer = null
-  }
-
-  init(): void {
-    if (!window.IntersectionObserver || !this.component) {
-      return
-    }
-
-    if (this.component) {
-      this.dispatchEvent('mount')
-    }
-
-    this.observer = new IntersectionObserver(this.onChange.bind(this), {
-      threshold: [1.0],
-    })
-    this.observer.observe(this.component)
-  }
-
-  private dispatchEvent(action: string): void {
-    let component: object = {
-      name: 'flourish-topper',
-      id: this.id,
-    }
-    if (this.timeElapsedSeconds) {
-      component = { ...component, timeElapsedSeconds: this.timeElapsedSeconds }
-    }
-    const event = new CustomEvent('oTracking.event', {
-      detail: {
-        category: 'component',
-        action: action,
-        component,
-      },
-      bubbles: true,
-    })
-    document.body.dispatchEvent(event)
-  }
-
-  private onChange(changes: IntersectionObserverEntry[]): void {
-    changes.forEach((change) => {
-      if (change.target !== this.component) {
-        return
-      }
-      if (change.isIntersecting || change.intersectionRatio >= 1) {
-        this.dispatchEvent('view')
-        this.startTime = performance.now()
-      }
-      if (!change.isIntersecting || change.intersectionRatio === 0) {
-        this.totalVisibleTime = performance.now() - this.startTime
-        this.timeElapsedSeconds = parseFloat(
-          (this.totalVisibleTime / 1000).toFixed(2)
-        )
-        this.dispatchEvent('stop-view')
-        this.totalVisibleTime = 0
-        this.timeElapsedSeconds = null
-      }
-    })
-  }
-
-  disconnect(): void {
-    if (this.observer && this.component) {
-      this.observer.unobserve(this.component)
-      this.observer.disconnect()
-    }
-  }
-}
-
-export { FlourishTopperTracker }

package/src/components/Topper/client/index.ts

@@ -1,3 +0,0 @@
-import { FlourishTopperTracker } from './flourish-tracking'
-
-export { FlourishTopperTracker }

package/src/components/Topper/test/client/flourish-tracking.spec.ts

@@ -1,135 +0,0 @@
-import { FlourishTopperTracker } from '../../client'
-
-// const CustomEventMock = jest.fn()
-// global.CustomEvent = CustomEventMock
-
-describe('FlourishTopperTracker', () => {
-  let mockIntersectionObserver: jest.Mock
-  let mockObserve: jest.Mock
-  let mockUnobserve: jest.Mock
-  let mockDisconnect: jest.Mock
-  let mockComponent: HTMLElement
-  let dispatchEventSpy: jest.SpyInstance
-
-  beforeEach(() => {
-    mockObserve = jest.fn()
-    mockUnobserve = jest.fn()
-    mockDisconnect = jest.fn()
-
-    mockIntersectionObserver = jest.fn(() => {
-      return {
-        observe: mockObserve,
-        unobserve: mockUnobserve,
-        disconnect: mockDisconnect,
-      }
-    })
-
-    window.IntersectionObserver = mockIntersectionObserver
-
-    mockComponent = document.createElement('div')
-    mockComponent.setAttribute('data-component-type', 'flourish-topper')
-    mockComponent.setAttribute('data-component-id', 'test-id')
-    document.body.appendChild(mockComponent)
-
-    jest.spyOn(document, 'querySelector').mockReturnValue(mockComponent)
-    jest
-      .spyOn(performance, 'now')
-      .mockImplementationOnce(() => 1)
-      .mockImplementationOnce(() => 12344)
-    dispatchEventSpy = jest.spyOn(document.body, 'dispatchEvent')
-  })
-
-  afterEach(() => {
-    jest.clearAllMocks()
-    document.body.removeChild(mockComponent)
-  })
-
-  it('should initialise and observe the component', () => {
-    const tracker = new FlourishTopperTracker()
-    tracker.init()
-
-    expect(mockIntersectionObserver).toHaveBeenCalled()
-    expect(mockObserve).toHaveBeenCalledWith(mockComponent)
-  })
-
-  it('should dispatch a mount event on intialisation', () => {
-    const tracker = new FlourishTopperTracker()
-    tracker.init()
-
-    const mountEvent = dispatchEventSpy.mock.calls[0][0] as CustomEvent
-    expect(mountEvent.type).toBe('oTracking.event')
-    expect(mountEvent.detail).toEqual({
-      category: 'component',
-      action: 'mount',
-      component: {
-        name: 'flourish-topper',
-        id: 'test-id',
-      },
-    })
-  })
-
-  it('should handle component visibility changes', () => {
-    const tracker = new FlourishTopperTracker()
-    tracker.init()
-
-    const mockChanges: IntersectionObserverEntry[] = [
-      {
-        target: mockComponent,
-        isIntersecting: true,
-        intersectionRatio: 1.0,
-        boundingClientRect: {} as DOMRectReadOnly,
-        intersectionRect: {} as DOMRectReadOnly,
-        rootBounds: null,
-        time: 1,
-      },
-    ]
-
-    tracker['onChange'](mockChanges)
-
-    const viewEvent = dispatchEventSpy.mock.calls[1][0] as CustomEvent
-    expect(viewEvent.type).toBe('oTracking.event')
-    expect(viewEvent.detail).toEqual({
-      category: 'component',
-      action: 'view',
-      component: {
-        name: 'flourish-topper',
-        id: 'test-id',
-      },
-    })
-
-    const mockChangesAfter: IntersectionObserverEntry[] = [
-      {
-        target: mockComponent,
-        isIntersecting: false,
-        intersectionRatio: 0.0,
-        boundingClientRect: {} as DOMRectReadOnly,
-        intersectionRect: {} as DOMRectReadOnly,
-        rootBounds: null,
-        time: 12.3444,
-      },
-    ]
-
-    tracker['onChange'](mockChangesAfter)
-
-    const stopViewEvent = dispatchEventSpy.mock.calls[2][0] as CustomEvent
-    expect(stopViewEvent.type).toBe('oTracking.event')
-    expect(stopViewEvent.detail).toEqual({
-      category: 'component',
-      action: 'stop-view',
-      component: {
-        name: 'flourish-topper',
-        id: 'test-id',
-        timeElapsedSeconds: 12.34,
-      },
-    })
-  })
-
-  it('should disconnect the observer', () => {
-    const tracker = new FlourishTopperTracker()
-    tracker.init()
-    tracker.disconnect()
-
-    expect(mockUnobserve).toHaveBeenCalledWith(mockComponent)
-    expect(mockDisconnect).toHaveBeenCalled()
-  })
-})