mirror of
https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz
synced 2025-08-12 22:29:02 +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}`}>
|
||||
<SpanWrapper>
|
||||
<Span ellipsis>{name}</Span>
|
||||
<Service>{serviceName}</Service>
|
||||
<Service ellipsis>{serviceName}</Service>
|
||||
</SpanWrapper>
|
||||
</Container>
|
||||
);
|
||||
|
||||
@ -9,7 +9,7 @@ export const Span = styled(Typography.Paragraph)`
|
||||
}
|
||||
`;
|
||||
|
||||
export const Service = styled(Typography)`
|
||||
export const Service = styled(Typography.Paragraph)`
|
||||
&&& {
|
||||
color: #acacac;
|
||||
font-size: 0.75rem;
|
||||
|
||||
@ -41,8 +41,9 @@ export const CardContainer = styled.li<{ isMissing?: boolean }>`
|
||||
width: 100%;
|
||||
cursor: pointer;
|
||||
border-radius: 0.25rem;
|
||||
z-index: 2;
|
||||
${({ isMissing }): string =>
|
||||
isMissing ? `border: 1px dashed ${volcano[6]};` : ''}
|
||||
isMissing ? `border: 1px dashed ${volcano[6]} !important;` : ''}
|
||||
`;
|
||||
|
||||
interface Props {
|
||||
|
||||
@ -28,11 +28,10 @@ function MissingSpansMessage(): JSX.Element {
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
margin: '1rem 0',
|
||||
fontSize: '0.8rem',
|
||||
}}
|
||||
>
|
||||
<InfoCircleOutlined
|
||||
style={{ color: volcano[6], fontSize: '1.4rem', marginRight: '0.3rem' }}
|
||||
/>{' '}
|
||||
<InfoCircleOutlined style={{ color: volcano[6], marginRight: '0.3rem' }} />{' '}
|
||||
This trace has missing spans
|
||||
</div>
|
||||
</Popover>
|
||||
|
||||
@ -18,10 +18,10 @@ export type Span = [
|
||||
string,
|
||||
string,
|
||||
string,
|
||||
string | string[],
|
||||
string | string[],
|
||||
string | string[],
|
||||
Record<string, unknown>[],
|
||||
string[],
|
||||
string[],
|
||||
string[],
|
||||
string[],
|
||||
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 referencedTraceIds: string[] = Array.from(traceIdSet);
|
||||
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) {
|
||||
if (traceId.includes(spanId)) {
|
||||
spanTree.push(spanMap[spanId]);
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user