@zendesk/retrace
Version:
define and capture Product Operation Traces along with computed metrics with an optional friendly React beacon API
170 lines • 5.94 kB
JavaScript
"use strict";
/**
* Copyright Zendesk, Inc.
*
* Use of this source code is governed under the Apache License, Version 2.0
* found at http://www.apache.org/licenses/LICENSE-2.0.
*/
Object.defineProperty(exports, "__esModule", { value: true });
const constants_1 = require("./constants");
const actionsFixture_1 = require("./fixtures/actionsFixture");
const generateReport_1 = require("./generateReport");
jest.mock('./utilities', () => ({
...jest.requireActual('./utilities'),
getCurrentBrowserSupportForNonResponsiveStateDetection: jest.fn(() => true),
}));
describe('generateReport', () => {
const originalTimeOrigin = performance.timeOrigin;
beforeEach(() => {
Object.defineProperty(performance, 'timeOrigin', {
configurable: true,
enumerable: true,
get() {
return 0;
},
});
});
afterEach(() => {
Object.defineProperty(performance, 'timeOrigin', {
configurable: true,
enumerable: true,
get() {
return originalTimeOrigin;
},
});
});
it('correctly generates a report', () => {
const expectedBeaconRenderCount = 2;
const timeIncrement = 100;
const isFirstLoad = true;
const ttr = timeIncrement * expectedBeaconRenderCount;
const noLagDuration = 200;
const lagDuration = 300;
const tti = ttr + timeIncrement + noLagDuration + lagDuration;
const data = { mountedPlacements: actionsFixture_1.mountedPlacements, timingId: 'test' };
const expectedReport = {
id: actionsFixture_1.id,
isFirstLoad,
tti,
ttr,
lastStage: constants_1.DEFAULT_STAGES.READY,
flushReason: 'test',
counts: {
beacon: expectedBeaconRenderCount,
observer: 1,
},
durations: {
beacon: [timeIncrement, timeIncrement],
observer: [lagDuration],
},
timeSpent: {
beacon: ttr,
observer: lagDuration,
},
loadingStagesDuration: timeIncrement,
spans: [
{
type: 'render',
description: '<beacon> (1)',
startTime: 100,
endTime: 200,
relativeEndTime: 100,
data: {
...data,
source: 'beacon',
metadata: {},
stage: 'loading',
},
},
{
type: 'render',
description: '<beacon> (2)',
startTime: 200,
endTime: 300,
relativeEndTime: 200,
data: {
...data,
source: 'beacon',
metadata: {},
stage: 'ready',
},
},
{
type: 'unresponsive',
description: 'unresponsive',
startTime: 600,
endTime: 900,
relativeEndTime: 800,
data: {
...data,
source: 'observer',
metadata: {},
stage: 'ready',
},
},
{
type: 'stage-change',
description: 'loading to ready',
startTime: 100,
endTime: 200,
relativeEndTime: 100,
data: {
...data,
source: 'beacon',
metadata: {},
previousStage: 'loading',
stage: 'ready',
timeToStage: 100,
dependencyChanges: 0,
},
},
{
type: 'ttr',
description: 'render',
startTime: 100,
endTime: 300,
relativeEndTime: 200,
data: {
...data,
previousStage: 'ready',
stage: 'rendered',
timeToStage: 100,
dependencyChanges: 0,
},
},
{
type: 'tti',
description: 'interactive',
startTime: 100,
endTime: 900,
relativeEndTime: 800,
data: {
...data,
previousStage: 'rendered',
stage: 'interactive',
timeToStage: 600,
dependencyChanges: 0,
},
},
],
includedStages: [constants_1.DEFAULT_STAGES.LOADING, constants_1.DEFAULT_STAGES.READY],
hadError: false,
handled: true,
};
const report = (0, generateReport_1.generateReport)({
actions: actionsFixture_1.actionsFixture,
timingId: actionsFixture_1.id,
isFirstLoad,
immediateSendReportStages: [],
loadingStages: constants_1.DEFAULT_LOADING_STAGES,
metadata: {},
finalStages: [],
flushReason: 'test',
maximumActiveBeaconsCount: 1,
minimumExpectedSimultaneousBeacons: 1,
measures: {},
});
expect(report).toStrictEqual(expectedReport);
});
});
//# sourceMappingURL=generateReport.test.js.map