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