@zendesk/react-measure-timing-hooks
Version:
react hooks for measuring time to interactive and time to render of components
132 lines • 5.65 kB
JavaScript
Object.defineProperty(exports, "__esModule", { value: true });
const vitest_1 = require("vitest");
const convertToRum_1 = require("./convertToRum");
const recordingComputeUtils_1 = require("./recordingComputeUtils");
const createMockFactory_1 = require("./testUtility/createMockFactory");
(0, vitest_1.describe)('convertTraceToRUM', () => {
(0, vitest_1.it)('should round all numeric values in the trace recording', () => {
const definition = {
name: 'test-trace',
relationSchemaName: 'ticket',
relationSchema: { ticketId: String },
requiredSpans: [() => true],
computedSpanDefinitions: {},
computedValueDefinitions: {},
variants: {
origin: { timeout: 45_000 },
},
};
const input = {
id: 'test',
startTime: (0, createMockFactory_1.createTimestamp)(0),
relatedTo: { ticketId: '74' },
variant: 'origin',
};
const recordedItems = new Set([
(0, createMockFactory_1.createMockSpanAndAnnotation)(100.501, {
name: 'test-component',
type: 'component-render',
relatedTo: {},
duration: 50.499,
isIdle: false,
renderCount: 1,
renderedOutput: 'loading',
}),
(0, createMockFactory_1.createMockSpanAndAnnotation)(200.001, {
name: 'test-component',
type: 'component-render',
relatedTo: {},
duration: 50.999,
isIdle: true,
renderCount: 2,
renderedOutput: 'content',
}, { occurrence: 2 }),
]);
const traceRecording = (0, recordingComputeUtils_1.createTraceRecording)({
definition,
input,
recordedItemsByLabel: {},
recordedItems,
}, { transitionFromState: 'active' });
const context = {
definition,
input,
recordedItemsByLabel: {},
recordedItems,
};
const result = (0, convertToRum_1.convertTraceToRUM)(traceRecording, context);
// Check rounded values in embeddedSpans
const embeddedSpan = result.embeddedSpans['component-render|test-component'];
if (embeddedSpan) {
(0, vitest_1.expect)(Number.isInteger(embeddedSpan.totalDuration)).toBe(true);
(0, vitest_1.expect)(Number.isInteger(embeddedSpan.spans[0].startOffset)).toBe(true);
(0, vitest_1.expect)(Number.isInteger(embeddedSpan.spans[0].duration)).toBe(true);
(0, vitest_1.expect)(Number.isInteger(embeddedSpan.spans[1].startOffset)).toBe(true);
(0, vitest_1.expect)(Number.isInteger(embeddedSpan.spans[1].duration)).toBe(true);
// Check specific rounded values
(0, vitest_1.expect)(embeddedSpan.spans[0].startOffset).toBe(101); // 100.501 rounded
(0, vitest_1.expect)(embeddedSpan.spans[0].duration).toBe(50); // 50.499 rounded
(0, vitest_1.expect)(embeddedSpan.spans[1].startOffset).toBe(200); // 200.001 rounded
(0, vitest_1.expect)(embeddedSpan.spans[1].duration).toBe(51); // 50.999 rounded
(0, vitest_1.expect)(result.nonEmbeddedSpans).toEqual([]);
}
});
(0, vitest_1.it)('should return correct non embedded spans', () => {
const definition = {
name: 'test-trace',
relationSchemaName: 'ticket',
relationSchema: { ticketId: String },
requiredSpans: [() => true],
computedSpanDefinitions: {},
computedValueDefinitions: {},
variants: {
origin: { timeout: 45_000 },
},
};
const input = {
id: 'test',
startTime: (0, createMockFactory_1.createTimestamp)(0),
relatedTo: { ticketId: '74' },
variant: 'origin',
};
const recordedItems = new Set([
(0, createMockFactory_1.createMockSpanAndAnnotation)(100.501, {
name: 'test-component',
type: 'component-render',
relatedTo: {},
duration: 50.499,
isIdle: false,
renderCount: 1,
renderedOutput: 'loading',
}),
(0, createMockFactory_1.createMockSpanAndAnnotation)(200.001, {
name: 'test-component',
type: 'component-render',
relatedTo: {},
duration: 50.999,
isIdle: true,
renderCount: 2,
renderedOutput: 'content',
}, { occurrence: 2 }),
]);
const traceRecording = (0, recordingComputeUtils_1.createTraceRecording)({
definition,
input,
recordedItemsByLabel: {},
recordedItems,
}, { transitionFromState: 'active' });
const context = {
definition,
input,
recordedItemsByLabel: {},
recordedItems,
};
// we dont want to return any embedded spans
const result = (0, convertToRum_1.convertTraceToRUM)(traceRecording, context, () => false);
(0, vitest_1.expect)(Object.keys(result.embeddedSpans)).toHaveLength(0);
(0, vitest_1.expect)(result.nonEmbeddedSpans).toEqual(['component-render|test-component']);
(0, vitest_1.expect)(result.nonEmbeddedSpans).toHaveLength(1);
});
});
//# sourceMappingURL=convertToRum.test.js.map
;