mirror of
https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz
synced 2025-08-14 06:05:58 +08:00
chore: tests for span to trace tree with missing spans support (#1368)
* chore: tests for span to trace tree with missing spans support
This commit is contained in:
Pranshu Chittora
GitHub
parent
a84754e8a8
commit
0b08c80038
@ -10,7 +10,7 @@ function SpanNameComponent({
|
|||||||
<Container title={`${name} ${serviceName}`}>
|
<Container title={`${name} ${serviceName}`}>
|
||||||
<SpanWrapper>
|
<SpanWrapper>
|
||||||
<Span ellipsis>{name}</Span>
|
<Span ellipsis>{name}</Span>
|
||||||
<Service>{serviceName}</Service>
|
<Service ellipsis>{serviceName}</Service>
|
||||||
</SpanWrapper>
|
</SpanWrapper>
|
||||||
</Container>
|
</Container>
|
||||||
);
|
);
|
||||||
|
|||||||
@ -9,7 +9,7 @@ export const Span = styled(Typography.Paragraph)`
|
|||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
export const Service = styled(Typography)`
|
export const Service = styled(Typography.Paragraph)`
|
||||||
&&& {
|
&&& {
|
||||||
color: #acacac;
|
color: #acacac;
|
||||||
font-size: 0.75rem;
|
font-size: 0.75rem;
|
||||||
|
|||||||
@ -41,8 +41,9 @@ export const CardContainer = styled.li<{ isMissing?: boolean }>`
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
border-radius: 0.25rem;
|
border-radius: 0.25rem;
|
||||||
|
z-index: 2;
|
||||||
${({ isMissing }): string =>
|
${({ isMissing }): string =>
|
||||||
isMissing ? `border: 1px dashed ${volcano[6]};` : ''}
|
isMissing ? `border: 1px dashed ${volcano[6]} !important;` : ''}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
|
|||||||
@ -28,11 +28,10 @@ function MissingSpansMessage(): JSX.Element {
|
|||||||
justifyContent: 'center',
|
justifyContent: 'center',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
margin: '1rem 0',
|
margin: '1rem 0',
|
||||||
|
fontSize: '0.8rem',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<InfoCircleOutlined
|
<InfoCircleOutlined style={{ color: volcano[6], marginRight: '0.3rem' }} />{' '}
|
||||||
style={{ color: volcano[6], fontSize: '1.4rem', marginRight: '0.3rem' }}
|
|
||||||
/>{' '}
|
|
||||||
This trace has missing spans
|
This trace has missing spans
|
||||||
</div>
|
</div>
|
||||||
</Popover>
|
</Popover>
|
||||||
|
|||||||
@ -18,10 +18,10 @@ export type Span = [
|
|||||||
string,
|
string,
|
||||||
string,
|
string,
|
||||||
string,
|
string,
|
||||||
string | string[],
|
string[],
|
||||||
string | string[],
|
string[],
|
||||||
string | string[],
|
string[],
|
||||||
Record<string, unknown>[],
|
string[],
|
||||||
boolean,
|
boolean,
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|||||||
@ -0,0 +1,211 @@
|
|||||||
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||||
|
|
||||||
|
exports[`utils/spanToTree should return a single tree on valid trace data 1`] = `
|
||||||
|
Object {
|
||||||
|
"missingSpanTree": Array [],
|
||||||
|
"spanTree": Array [
|
||||||
|
Object {
|
||||||
|
"children": Array [
|
||||||
|
Object {
|
||||||
|
"children": Array [
|
||||||
|
Object {
|
||||||
|
"children": Array [],
|
||||||
|
"event": Array [
|
||||||
|
Object {
|
||||||
|
"attributeMap": Object {
|
||||||
|
"event": "HTTP request received S3",
|
||||||
|
"level": "info",
|
||||||
|
"method": "GET",
|
||||||
|
"url": "/dispatch?customer=392&nonse=0.015296363321630757",
|
||||||
|
},
|
||||||
|
"timeUnixNano": 1657275433246142000,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"hasError": false,
|
||||||
|
"id": "span_3",
|
||||||
|
"isProcessed": true,
|
||||||
|
"name": "HTTP GET SPAN 3",
|
||||||
|
"references": Array [
|
||||||
|
Object {
|
||||||
|
"RefType": "CHILD_OF",
|
||||||
|
"SpanId": "span_2",
|
||||||
|
"TraceId": "0000000000000000span_1",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"serviceColour": "",
|
||||||
|
"serviceName": "frontend",
|
||||||
|
"startTime": 1657275433246,
|
||||||
|
"tags": Array [
|
||||||
|
Object {
|
||||||
|
"key": "host.name.span3",
|
||||||
|
"value": "span_3",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"time": 683273000,
|
||||||
|
"value": 683273000,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"event": Array [
|
||||||
|
Object {
|
||||||
|
"attributeMap": Object {
|
||||||
|
"event": "HTTP request received S2",
|
||||||
|
"level": "info",
|
||||||
|
"method": "GET",
|
||||||
|
"url": "/dispatch?customer=392&nonse=0.015296363321630757",
|
||||||
|
},
|
||||||
|
"timeUnixNano": 1657275433246142000,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"hasError": false,
|
||||||
|
"id": "span_2",
|
||||||
|
"isProcessed": true,
|
||||||
|
"name": "HTTP GET SPAN 2",
|
||||||
|
"references": Array [
|
||||||
|
Object {
|
||||||
|
"RefType": "CHILD_OF",
|
||||||
|
"SpanId": "span_1",
|
||||||
|
"TraceId": "0000000000000000span_1",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"serviceColour": "",
|
||||||
|
"serviceName": "frontend",
|
||||||
|
"startTime": 1657275433246,
|
||||||
|
"tags": Array [
|
||||||
|
Object {
|
||||||
|
"key": "host.name.span2",
|
||||||
|
"value": "span_2",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"time": 683273000,
|
||||||
|
"value": 683273000,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"event": Array [
|
||||||
|
Object {
|
||||||
|
"attributeMap": Object {
|
||||||
|
"event": "HTTP request received S1",
|
||||||
|
"level": "info",
|
||||||
|
"method": "GET",
|
||||||
|
"url": "/dispatch?customer=392&nonse=0.015296363321630757",
|
||||||
|
},
|
||||||
|
"timeUnixNano": 1657275433246142000,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"hasError": false,
|
||||||
|
"id": "span_1",
|
||||||
|
"name": "HTTP GET SPAN 1",
|
||||||
|
"references": Array [
|
||||||
|
Object {
|
||||||
|
"RefType": "CHILD_OF",
|
||||||
|
"SpanId": "",
|
||||||
|
"TraceId": "0000000000000000span_1",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"serviceColour": "",
|
||||||
|
"serviceName": "frontend",
|
||||||
|
"startTime": 1657275433246,
|
||||||
|
"tags": Array [
|
||||||
|
Object {
|
||||||
|
"key": "host.name.span1",
|
||||||
|
"value": "span_1",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"time": 683273000,
|
||||||
|
"value": 683273000,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
}
|
||||||
|
`;
|
||||||
|
|
||||||
|
exports[`utils/spanToTree should return a single tree on valid trace data 2`] = `
|
||||||
|
Object {
|
||||||
|
"missingSpanTree": Array [
|
||||||
|
Object {
|
||||||
|
"children": Array [
|
||||||
|
Object {
|
||||||
|
"children": Array [],
|
||||||
|
"event": Array [
|
||||||
|
Object {
|
||||||
|
"attributeMap": Object {
|
||||||
|
"event": "HTTP request received S3",
|
||||||
|
"level": "info",
|
||||||
|
"method": "GET",
|
||||||
|
"url": "/dispatch?customer=392&nonse=0.015296363321630757",
|
||||||
|
},
|
||||||
|
"timeUnixNano": 1657275433246142000,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"hasError": false,
|
||||||
|
"id": "span_3",
|
||||||
|
"isProcessed": true,
|
||||||
|
"name": "HTTP GET SPAN 3",
|
||||||
|
"references": Array [
|
||||||
|
Object {
|
||||||
|
"RefType": "CHILD_OF",
|
||||||
|
"SpanId": "span_2",
|
||||||
|
"TraceId": "0000000000000000span_1",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"serviceColour": "",
|
||||||
|
"serviceName": "frontend",
|
||||||
|
"startTime": 1657275433246,
|
||||||
|
"tags": Array [
|
||||||
|
Object {
|
||||||
|
"key": "host.name.span3",
|
||||||
|
"value": "span_3",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"time": 683273000,
|
||||||
|
"value": 683273000,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"id": "span_2",
|
||||||
|
"isMissing": true,
|
||||||
|
"name": "Missing Span (span_2)",
|
||||||
|
"serviceColour": "",
|
||||||
|
"serviceName": "",
|
||||||
|
"startTime": null,
|
||||||
|
"tags": Array [],
|
||||||
|
"time": null,
|
||||||
|
"value": null,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"spanTree": Array [
|
||||||
|
Object {
|
||||||
|
"children": Array [],
|
||||||
|
"event": Array [
|
||||||
|
Object {
|
||||||
|
"attributeMap": Object {
|
||||||
|
"event": "HTTP request received S1",
|
||||||
|
"level": "info",
|
||||||
|
"method": "GET",
|
||||||
|
"url": "/dispatch?customer=392&nonse=0.015296363321630757",
|
||||||
|
},
|
||||||
|
"timeUnixNano": 1657275433246142000,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"hasError": false,
|
||||||
|
"id": "span_1",
|
||||||
|
"name": "HTTP GET SPAN 1",
|
||||||
|
"references": Array [
|
||||||
|
Object {
|
||||||
|
"RefType": "CHILD_OF",
|
||||||
|
"SpanId": "",
|
||||||
|
"TraceId": "0000000000000000span_1",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"serviceColour": "",
|
||||||
|
"serviceName": "frontend",
|
||||||
|
"startTime": 1657275433246,
|
||||||
|
"tags": Array [
|
||||||
|
Object {
|
||||||
|
"key": "host.name.span1",
|
||||||
|
"value": "span_1",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
"time": 683273000,
|
||||||
|
"value": 683273000,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
}
|
||||||
|
`;
|
||||||
21
frontend/src/utils/__tests__/spanToTree.test.ts
Normal file
21
frontend/src/utils/__tests__/spanToTree.test.ts
Normal file
@ -0,0 +1,21 @@
|
|||||||
|
import { TraceData } from '../fixtures/TraceData';
|
||||||
|
import { spanToTreeUtil } from '../spanToTree';
|
||||||
|
|
||||||
|
describe('utils/spanToTree', () => {
|
||||||
|
test('should return a single tree on valid trace data', () => {
|
||||||
|
const spanTree = spanToTreeUtil(TraceData);
|
||||||
|
expect(spanTree.spanTree.length).toBe(1);
|
||||||
|
expect(spanTree.missingSpanTree.length).toBe(0);
|
||||||
|
expect(spanTree).toMatchSnapshot();
|
||||||
|
});
|
||||||
|
test('should return a single tree on valid trace data', () => {
|
||||||
|
const MissingTraceData = [...TraceData];
|
||||||
|
MissingTraceData.splice(1, 1);
|
||||||
|
|
||||||
|
const spanTree = spanToTreeUtil(MissingTraceData);
|
||||||
|
|
||||||
|
expect(spanTree.spanTree.length).toBe(1);
|
||||||
|
expect(spanTree.missingSpanTree.length).toBe(1);
|
||||||
|
expect(spanTree).toMatchSnapshot();
|
||||||
|
});
|
||||||
|
});
|
||||||
52
frontend/src/utils/fixtures/TraceData.ts
Normal file
52
frontend/src/utils/fixtures/TraceData.ts
Normal file
@ -0,0 +1,52 @@
|
|||||||
|
import { Span } from 'types/api/trace/getTraceItem';
|
||||||
|
|
||||||
|
export const TraceData: Span[] = [
|
||||||
|
[
|
||||||
|
1657275433246,
|
||||||
|
'span_1',
|
||||||
|
'0000000000000000span_1',
|
||||||
|
'frontend',
|
||||||
|
'HTTP GET SPAN 1',
|
||||||
|
'2',
|
||||||
|
'683273000',
|
||||||
|
['host.name.span1'],
|
||||||
|
['span_1'],
|
||||||
|
['{TraceId=0000000000000000span_1, SpanId=, RefType=CHILD_OF}'],
|
||||||
|
[
|
||||||
|
'{"timeUnixNano":1657275433246142000,"attributeMap":{"event":"HTTP request received S1","level":"info","method":"GET","url":"/dispatch?customer=392\\u0026nonse=0.015296363321630757"}}',
|
||||||
|
],
|
||||||
|
false,
|
||||||
|
],
|
||||||
|
[
|
||||||
|
1657275433246,
|
||||||
|
'span_2',
|
||||||
|
'0000000000000000span_1',
|
||||||
|
'frontend',
|
||||||
|
'HTTP GET SPAN 2',
|
||||||
|
'2',
|
||||||
|
'683273000',
|
||||||
|
['host.name.span2'],
|
||||||
|
['span_2'],
|
||||||
|
['{TraceId=0000000000000000span_1, SpanId=span_1, RefType=CHILD_OF}'],
|
||||||
|
[
|
||||||
|
'{"timeUnixNano":1657275433246142000,"attributeMap":{"event":"HTTP request received S2","level":"info","method":"GET","url":"/dispatch?customer=392\\u0026nonse=0.015296363321630757"}}',
|
||||||
|
],
|
||||||
|
false,
|
||||||
|
],
|
||||||
|
[
|
||||||
|
1657275433246,
|
||||||
|
'span_3',
|
||||||
|
'0000000000000000span_1',
|
||||||
|
'frontend',
|
||||||
|
'HTTP GET SPAN 3',
|
||||||
|
'2',
|
||||||
|
'683273000',
|
||||||
|
['host.name.span3'],
|
||||||
|
['span_3'],
|
||||||
|
['{TraceId=0000000000000000span_1, SpanId=span_2, RefType=CHILD_OF}'],
|
||||||
|
[
|
||||||
|
'{"timeUnixNano":1657275433246142000,"attributeMap":{"event":"HTTP request received S3","level":"info","method":"GET","url":"/dispatch?customer=392\\u0026nonse=0.015296363321630757"}}',
|
||||||
|
],
|
||||||
|
false,
|
||||||
|
],
|
||||||
|
];
|
||||||
@ -109,6 +109,12 @@ export const spanToTreeUtil = (inputSpanList: Span[]): ITraceForest => {
|
|||||||
const missingSpanTree: ITraceTree[] = [];
|
const missingSpanTree: ITraceTree[] = [];
|
||||||
const referencedTraceIds: string[] = Array.from(traceIdSet);
|
const referencedTraceIds: string[] = Array.from(traceIdSet);
|
||||||
Object.keys(spanMap).forEach((spanId) => {
|
Object.keys(spanMap).forEach((spanId) => {
|
||||||
|
const isRoot = spanMap[spanId].references?.some((refs) => refs.SpanId === '');
|
||||||
|
if (isRoot) {
|
||||||
|
spanTree.push(spanMap[spanId]);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
for (const traceId of referencedTraceIds) {
|
for (const traceId of referencedTraceIds) {
|
||||||
if (traceId.includes(spanId)) {
|
if (traceId.includes(spanId)) {
|
||||||
spanTree.push(spanMap[spanId]);
|
spanTree.push(spanMap[spanId]);
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user