1import React from 'react'; 2import { render, screen } from '@testing-library/react'; 3import { UnconnectedNodeGraphContainer } from './NodeGraphContainer'; 4import { getDefaultTimeRange, MutableDataFrame } from '@grafana/data'; 5import { ExploreId } from '../../types'; 6 7describe('NodeGraphContainer', () => { 8 it('is collapsed if shown with traces', () => { 9 const { container } = render( 10 <UnconnectedNodeGraphContainer 11 dataFrames={[emptyFrame]} 12 exploreId={ExploreId.left} 13 range={getDefaultTimeRange()} 14 splitOpen={(() => {}) as any} 15 withTraceView={true} 16 /> 17 ); 18 19 // Make sure we only show header in the collapsible 20 expect(container.firstChild?.childNodes.length).toBe(1); 21 }); 22 23 it('shows the graph if not with trace view', async () => { 24 const { container } = render( 25 <UnconnectedNodeGraphContainer 26 dataFrames={[nodes]} 27 exploreId={ExploreId.left} 28 range={getDefaultTimeRange()} 29 splitOpen={(() => {}) as any} 30 /> 31 ); 32 33 expect(container.firstChild?.childNodes.length).toBe(2); 34 expect(container.querySelector('svg')).toBeInTheDocument(); 35 await screen.findByLabelText(/Node: tempo-querier/); 36 }); 37}); 38 39const emptyFrame = new MutableDataFrame(); 40 41const nodes = new MutableDataFrame({ 42 fields: toFields([ 43 ['id', ['3fa414edcef6ad90']], 44 ['title', ['tempo-querier']], 45 ['subTitle', ['HTTP GET - api_traces_traceid']], 46 ['mainStat', ['1049.14ms (100%)']], 47 ['secondaryStat', ['1047.29ms (99.82%)']], 48 ['color', [0.9982395121342127]], 49 ]), 50}); 51 52function toFields(fields: Array<[string, any[]]>) { 53 return fields.map(([name, values]) => { 54 return { name, values }; 55 }); 56} 57