Skip to content

Commit

Permalink
Update test.
Browse files Browse the repository at this point in the history
  • Loading branch information
@wolfgangcodes
wolfgangcodes committed Sep 26, 2024
1 parent ca84821 commit 56a9c13
Show file tree
Hide file tree
Showing 2 changed files with 63 additions and 52 deletions.
8 changes: 4 additions & 4 deletions packages/honeycomb-opentelemetry-web/src/web-vitals-autoinstrumentation.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -92,14 +92,14 @@ interface LcpVitalOpts extends VitalOpts {
/**
* Will send the values of these data attributes if they appear on an LCP event
*/
dataAttributes: string[];
dataAttributes?: string[];
}

interface InpVitalOpts extends VitalOpts {
/**
* if this is true it will create spans from the PerformanceLongAnimationFrameTiming frames
*/
includeTimingsAsSpans: boolean;
includeTimingsAsSpans?: boolean;
}

// To avoid importing InstrumentationAbstract from:
Expand Down Expand Up @@ -484,8 +484,8 @@ export class WebVitalsInstrumentation extends InstrumentationAbstract {
[`${attrPrefix}.resource_load_time`]: resourceLoadDuration,
});

if (dataAttributes.length >= 0) {
dataAttributes.forEach((dataAttr) => {
if (dataAttributes && dataAttributes.length >= 0) {
dataAttributes?.forEach((dataAttr) => {
const value = lcpEntry?.element?.getAttribute(dataAttr);
if (value !== null && value !== undefined) {
span.setAttribute(`${attrPrefix}.element.${dataAttr}`, value);
Expand Down
107 changes: 59 additions & 48 deletions packages/honeycomb-opentelemetry-web/test/web-vitals-instrumentation.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -303,11 +303,13 @@ describe('Web Vitals Instrumentation Tests', () => {
describe('CLS', () => {
it('should create a span when enabled', () => {
const webVitalsInstr = new WebVitalsInstrumentation();
webVitalsInstr.onReportCLS(CLS, (cls, span) => {
span.setAttributes({
'cls.entries': cls.entries.toString(),
'cls.my_custom_attr': 'custom_attr',
});
webVitalsInstr.onReportCLS(CLS, {
applyCustomAttributes: (cls, span) => {
span.setAttributes({
'cls.entries': cls.entries.toString(),
'cls.my_custom_attr': 'custom_attr',
});
},
});

const span = exporter.getFinishedSpans()[0];
Expand All @@ -323,11 +325,11 @@ describe('Web Vitals Instrumentation Tests', () => {
vitalsToTrack: ['CLS'],
});
instr.disable();
instr.onReportCLS(CLS, () => {});
instr.onReportCLS(CLS, { applyCustomAttributes: () => {} });

expect(exporter.getFinishedSpans().length).toEqual(0);
instr.enable();
instr.onReportCLS(CLS, () => {});
instr.onReportCLS(CLS, { applyCustomAttributes: () => {} });

expect(exporter.getFinishedSpans().length).toEqual(1);
expect(exporter.getFinishedSpans()[0].name).toEqual('CLS');
Expand All @@ -337,11 +339,14 @@ describe('Web Vitals Instrumentation Tests', () => {
describe('LCP', () => {
it('should create a span when enabled', () => {
const webVitalsInstr = new WebVitalsInstrumentation();
webVitalsInstr.onReportLCP(LCP, (lcp, span) => {
span.setAttributes({
'lcp.entries': lcp.entries.toString(),
'lcp.my_custom_attr': 'custom_attr',
});
webVitalsInstr.onReportLCP(LCP, {
dataAttributes: [],
applyCustomAttributes: (lcp, span) => {
span.setAttributes({
'lcp.entries': lcp.entries.toString(),
'lcp.my_custom_attr': 'custom_attr',
});
},
});

const span = exporter.getFinishedSpans()[0];
Expand All @@ -357,11 +362,11 @@ describe('Web Vitals Instrumentation Tests', () => {
vitalsToTrack: ['LCP'],
});
instr.disable();
instr.onReportLCP(LCP, () => {});
instr.onReportLCP(LCP, { applyCustomAttributes: () => {} });

expect(exporter.getFinishedSpans().length).toEqual(0);
instr.enable();
instr.onReportLCP(LCP, () => {});
instr.onReportLCP(LCP, { applyCustomAttributes: () => {} });

expect(exporter.getFinishedSpans().length).toEqual(1);
expect(exporter.getFinishedSpans()[0].name).toEqual('LCP');
Expand All @@ -371,11 +376,13 @@ describe('Web Vitals Instrumentation Tests', () => {
describe('INP', () => {
it('should create a span when enabled', () => {
const webVitalsInstr = new WebVitalsInstrumentation();
webVitalsInstr.onReportINP(INP, (inp, span) => {
span.setAttributes({
'inp.entries': inp.entries.toString(),
'inp.my_custom_attr': 'custom_attr',
});
webVitalsInstr.onReportINP(INP, {
applyCustomAttributes: (inp, span) => {
span.setAttributes({
'inp.entries': inp.entries.toString(),
'inp.my_custom_attr': 'custom_attr',
});
},
});

const span = exporter.getFinishedSpans()[0];
Expand All @@ -388,20 +395,18 @@ describe('Web Vitals Instrumentation Tests', () => {

it('should create a include timings when enabled', () => {
const webVitalsInstr = new WebVitalsInstrumentation();
webVitalsInstr.onReportINP(
INPWithTimings,
(inp, span) => {
webVitalsInstr.onReportINP(INPWithTimings, {
applyCustomAttributes: (inp, span) => {
span.setAttributes({
'inp.entries': inp.entries.toString(),
'inp.my_custom_attr': 'custom_attr',
});
},
true,
);
includeTimingsAsSpans: true,
});

const [scriptTimingSpan, timingSpan, inpSpan] =
exporter.getFinishedSpans();
console.log({ timingSpan });
expect(inpSpan.name).toBe('INP');
expect(inpSpan.instrumentationLibrary.name).toBe(
'@honeycombio/instrumentation-web-vitals',
Expand Down Expand Up @@ -433,11 +438,11 @@ describe('Web Vitals Instrumentation Tests', () => {
vitalsToTrack: ['INP'],
});
instr.disable();
instr.onReportINP(INP, () => {});
instr.onReportINP(INP, { applyCustomAttributes: () => {} });

expect(exporter.getFinishedSpans().length).toEqual(0);
instr.enable();
instr.onReportINP(INP, () => {});
instr.onReportINP(INP, { applyCustomAttributes: () => {} });

expect(exporter.getFinishedSpans().length).toEqual(1);
expect(exporter.getFinishedSpans()[0].name).toEqual('INP');
Expand All @@ -447,11 +452,13 @@ describe('Web Vitals Instrumentation Tests', () => {
describe('FCP', () => {
it('should create a span when enabled', () => {
const webVitalsInstr = new WebVitalsInstrumentation();
webVitalsInstr.onReportFCP(FCP, (fcp, span) => {
span.setAttributes({
'fcp.entries': fcp.entries.toString(),
'fcp.my_custom_attr': 'custom_attr',
});
webVitalsInstr.onReportFCP(FCP, {
applyCustomAttributes: (fcp, span) => {
span.setAttributes({
'fcp.entries': fcp.entries.toString(),
'fcp.my_custom_attr': 'custom_attr',
});
},
});
const span = exporter.getFinishedSpans()[0];
expect(span.name).toBe('FCP');
Expand All @@ -466,11 +473,11 @@ describe('Web Vitals Instrumentation Tests', () => {
vitalsToTrack: ['FCP'],
});
instr.disable();
instr.onReportFCP(FCP, () => {});
instr.onReportFCP(FCP, { applyCustomAttributes: () => {} });

expect(exporter.getFinishedSpans().length).toEqual(0);
instr.enable();
instr.onReportFCP(FCP, () => {});
instr.onReportFCP(FCP, { applyCustomAttributes: () => {} });

expect(exporter.getFinishedSpans().length).toEqual(1);
expect(exporter.getFinishedSpans()[0].name).toEqual('FCP');
Expand All @@ -480,11 +487,13 @@ describe('Web Vitals Instrumentation Tests', () => {
describe('TTFB', () => {
it('should create a span when enabled', () => {
const webVitalsInstr = new WebVitalsInstrumentation();
webVitalsInstr.onReportTTFB(TTFB, (ttfb, span) => {
span.setAttributes({
'ttfb.entries': ttfb.entries.toString(),
'ttfb.my_custom_attr': 'custom_attr',
});
webVitalsInstr.onReportTTFB(TTFB, {
applyCustomAttributes: (ttfb, span) => {
span.setAttributes({
'ttfb.entries': ttfb.entries.toString(),
'ttfb.my_custom_attr': 'custom_attr',
});
},
});

const span = exporter.getFinishedSpans()[0];
Expand All @@ -500,11 +509,11 @@ describe('Web Vitals Instrumentation Tests', () => {
vitalsToTrack: ['TTFB'],
});
instr.disable();
instr.onReportTTFB(TTFB, () => {});
instr.onReportTTFB(TTFB, { applyCustomAttributes: () => {} });

expect(exporter.getFinishedSpans().length).toEqual(0);
instr.enable();
instr.onReportTTFB(TTFB, () => {});
instr.onReportTTFB(TTFB, { applyCustomAttributes: () => {} });

expect(exporter.getFinishedSpans().length).toEqual(1);
expect(exporter.getFinishedSpans()[0].name).toEqual('TTFB');
Expand All @@ -514,11 +523,13 @@ describe('Web Vitals Instrumentation Tests', () => {
describe('FID', () => {
it('should create a span when enabled', () => {
const webVitalsInstr = new WebVitalsInstrumentation();
webVitalsInstr.onReportFID(FID, (fid, span) => {
span.setAttributes({
'fid.entries': fid.entries.toString(),
'fid.my_custom_attr': 'custom_attr',
});
webVitalsInstr.onReportFID(FID, {
applyCustomAttributes: (fid, span) => {
span.setAttributes({
'fid.entries': fid.entries.toString(),
'fid.my_custom_attr': 'custom_attr',
});
},
});

const span = exporter.getFinishedSpans()[0];
Expand All @@ -534,11 +545,11 @@ describe('Web Vitals Instrumentation Tests', () => {
vitalsToTrack: ['FID'],
});
instr.disable();
instr.onReportFID(FID, () => {});
instr.onReportFID(FID, { applyCustomAttributes: () => {} });

expect(exporter.getFinishedSpans().length).toEqual(0);
instr.enable();
instr.onReportFID(FID, () => {});
instr.onReportFID(FID, { applyCustomAttributes: () => {} });

expect(exporter.getFinishedSpans().length).toEqual(1);
expect(exporter.getFinishedSpans()[0].name).toEqual('FID');
Expand Down

0 comments on commit 56a9c13

Please sign in to comment.