prometheus

GraphHelpers.test.ts
225 строк · 8.0 Кб
Перенос по словам
1
import { formatValue, parseValue, getOptions } from './GraphHelpers';
2
import moment from 'moment';
3
require('../../vendor/flot/jquery.flot'); // need for $.colors
4

5
describe('GraphHelpers', () => {
6
  describe('formatValue', () => {
7
    it('formats tick values correctly', () => {
8
      [
9
        { input: null, output: 'null' },
10
        { input: 0, output: '0.00' },
11
        { input: 2e24, output: '2.00Y' },
12
        { input: 2e23, output: '200.00Z' },
13
        { input: 2e22, output: '20.00Z' },
14
        { input: 2e21, output: '2.00Z' },
15
        { input: 2e19, output: '20.00E' },
16
        { input: 2e18, output: '2.00E' },
17
        { input: 2e17, output: '200.00P' },
18
        { input: 2e16, output: '20.00P' },
19
        { input: 2e15, output: '2.00P' },
20
        { input: 1e15, output: '1.00P' },
21
        { input: 2e14, output: '200.00T' },
22
        { input: 2e13, output: '20.00T' },
23
        { input: 2e12, output: '2.00T' },
24
        { input: 2e11, output: '200.00G' },
25
        { input: 2e10, output: '20.00G' },
26
        { input: 2e9, output: '2.00G' },
27
        { input: 2e8, output: '200.00M' },
28
        { input: 2e7, output: '20.00M' },
29
        { input: 2e6, output: '2.00M' },
30
        { input: 2e5, output: '200.00k' },
31
        { input: 2e4, output: '20.00k' },
32
        { input: 2e3, output: '2.00k' },
33
        { input: 2e2, output: '200.00' },
34
        { input: 2e1, output: '20.00' },
35
        { input: 2, output: '2.00' },
36
        { input: 2e-1, output: '0.20' },
37
        { input: 2e-2, output: '0.02' },
38
        { input: 2e-3, output: '2.00m' },
39
        { input: 2e-4, output: '0.20m' },
40
        { input: 2e-5, output: '0.02m' },
41
        { input: 2e-6, output: '2.00µ' },
42
        { input: 2e-7, output: '0.20µ' },
43
        { input: 2e-8, output: '0.02µ' },
44
        { input: 2e-9, output: '2.00n' },
45
        { input: 2e-10, output: '0.20n' },
46
        { input: 2e-11, output: '0.02n' },
47
        { input: 2e-12, output: '2.00p' },
48
        { input: 2e-13, output: '0.20p' },
49
        { input: 2e-14, output: '0.02p' },
50
        { input: 2e-15, output: '2.00f' },
51
        { input: 2e-16, output: '0.20f' },
52
        { input: 2e-17, output: '0.02f' },
53
        { input: 2e-18, output: '2.00a' },
54
        { input: 2e-19, output: '0.20a' },
55
        { input: 2e-20, output: '0.02a' },
56
        { input: 1e-21, output: '1.00z' },
57
        { input: 2e-21, output: '2.00z' },
58
        { input: 2e-22, output: '0.20z' },
59
        { input: 2e-23, output: '0.02z' },
60
        { input: 2e-24, output: '2.00y' },
61
        { input: 2e-25, output: '0.20y' },
62
        { input: 2e-26, output: '0.02y' },
63
      ].map((t) => {
64
        expect(formatValue(t.input)).toBe(t.output);
65
      });
66
    });
67
    it('should throw error if no match', () => {
68
      expect(() => formatValue(undefined as any)).toThrowError("couldn't format a value, this is a bug");
69
    });
70
  });
71
  describe('parseValue', () => {
72
    it('should parse number properly', () => {
73
      expect(parseValue('12.3e')).toEqual(12.3);
74
    });
75
    it('should return 0 if value is NaN and stacked prop is true', () => {
76
      expect(parseValue('asd')).toEqual(null);
77
    });
78
    it('should return null if value is NaN and stacked prop is false', () => {
79
      expect(parseValue('asd')).toBeNull();
80
    });
81
  });
82
  describe('Plot options', () => {
83
    it('should configure options properly if stacked prop is true', () => {
84
      expect(getOptions(true, false)).toMatchObject({
85
        series: {
86
          stack: false,
87
          lines: { lineWidth: 1, steps: false, fill: true },
88
          shadowSize: 0,
89
        },
90
      });
91
    });
92
    it('should configure options properly if stacked prop is false', () => {
93
      expect(getOptions(false, false)).toMatchObject({
94
        series: {
95
          stack: false,
96
          lines: { lineWidth: 2, steps: false, fill: false },
97
          shadowSize: 0,
98
        },
99
      });
100
    });
101
    it('should configure options properly if useLocalTime prop is true', () => {
102
      expect(getOptions(true, true)).toMatchObject({
103
        xaxis: {
104
          mode: 'time',
105
          showTicks: true,
106
          showMinorTicks: true,
107
          timeBase: 'milliseconds',
108
          timezone: 'browser',
109
        },
110
      });
111
    });
112
    it('should configure options properly if useLocalTime prop is false', () => {
113
      expect(getOptions(false, false)).toMatchObject({
114
        xaxis: {
115
          mode: 'time',
116
          showTicks: true,
117
          showMinorTicks: true,
118
          timeBase: 'milliseconds',
119
        },
120
      });
121
    });
122
    it('should return proper tooltip html from options', () => {
123
      expect(
124
        getOptions(true, false).tooltip.content('', 1572128592, 1572128592, {
125
          series: { labels: { foo: '1', bar: '2' }, color: '' },
126
        } as any)
127
      ).toEqual(
128
        `
129
            <div class="date">1970-01-19 04:42:08 +00:00</div>
130
            <div>
131
              <span class="detail-swatch" style="background-color: "></span>
132
              <span>value: <strong>1572128592</strong></span>
133
            </div>
134
            <div class="mt-2 mb-1 font-weight-bold">Series:</div>
135
            
136
            <div class="labels">
137
              
138
              
139
              <div class="mb-1"><strong>foo</strong>: 1</div><div class="mb-1"><strong>bar</strong>: 2</div>
140
            </div>`
141
      );
142
    });
143
    it('should return proper tooltip html from options with local time', () => {
144
      moment.tz.setDefault('America/New_York');
145
      expect(
146
        getOptions(true, true).tooltip.content('', 1572128592, 1572128592, {
147
          series: { labels: { foo: '1', bar: '2' }, color: '' },
148
        } as any)
149
      ).toEqual(`
150
            <div class="date">1970-01-18 23:42:08 -05:00</div>
151
            <div>
152
              <span class="detail-swatch" style="background-color: "></span>
153
              <span>value: <strong>1572128592</strong></span>
154
            </div>
155
            <div class="mt-2 mb-1 font-weight-bold">Series:</div>
156
            
157
            <div class="labels">
158
              
159
              
160
              <div class="mb-1"><strong>foo</strong>: 1</div><div class="mb-1"><strong>bar</strong>: 2</div>
161
            </div>`);
162
    });
163
    it('should return proper tooltip for exemplar', () => {
164
      expect(
165
        getOptions(true, false).tooltip.content('', 1572128592, 1572128592, {
166
          series: { labels: { foo: '1', bar: '2' }, seriesLabels: { foo: '2', bar: '3' }, color: '' },
167
        } as any)
168
      ).toEqual(`
169
            <div class="date">1970-01-19 04:42:08 +00:00</div>
170
            <div>
171
              <span class="detail-swatch" style="background-color: "></span>
172
              <span>value: <strong>1572128592</strong></span>
173
            </div>
174
            <div class="mt-2 mb-1 font-weight-bold">Trace exemplar:</div>
175
            
176
            <div class="labels">
177
              
178
              
179
              <div class="mb-1"><strong>foo</strong>: 1</div><div class="mb-1"><strong>bar</strong>: 2</div>
180
            </div>
181
            
182
            <div class="mt-2 mb-1 font-weight-bold">Associated series:</div>
183
            <div class="labels">
184
              
185
              
186
              <div class="mb-1"><strong>foo</strong>: 2</div><div class="mb-1"><strong>bar</strong>: 3</div>
187
            </div>`);
188
    });
189
    it('should render Plot with proper options', () => {
190
      expect(getOptions(true, false)).toEqual({
191
        grid: {
192
          hoverable: true,
193
          clickable: true,
194
          autoHighlight: true,
195
          mouseActiveRadius: 100,
196
        },
197
        legend: { show: false },
198
        xaxis: {
199
          mode: 'time',
200
          showTicks: true,
201
          showMinorTicks: true,
202
          timeBase: 'milliseconds',
203
        },
204
        yaxis: { tickFormatter: expect.anything() },
205
        crosshair: { mode: 'xy', color: '#bbb' },
206
        tooltip: {
207
          show: true,
208
          cssClass: 'graph-tooltip',
209
          content: expect.anything(),
210
          defaultTheme: false,
211
          lines: true,
212
        },
213
        series: {
214
          stack: false,
215
          heatmap: false,
216
          lines: { lineWidth: 1, steps: false, fill: true },
217
          shadowSize: 0,
218
        },
219
        selection: {
220
          mode: 'x',
221
        },
222
      });
223
    });
224
  });
225
});
226
prometheus

Использование cookies
