@perses-dev/components 0.23.0 → 0.24.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/ColorPicker/ColorPicker.d.ts +12 -0
- package/dist/ColorPicker/ColorPicker.d.ts.map +1 -0
- package/dist/ColorPicker/ColorPicker.js +78 -0
- package/dist/ColorPicker/ColorPicker.js.map +1 -0
- package/dist/ColorPicker/index.d.ts +2 -0
- package/dist/ColorPicker/index.d.ts.map +1 -0
- package/dist/ColorPicker/index.js +15 -0
- package/dist/ColorPicker/index.js.map +1 -0
- package/dist/EChart.d.ts +2 -2
- package/dist/EChart.d.ts.map +1 -1
- package/dist/EChart.js.map +1 -1
- package/dist/Legend/Legend.js +6 -9
- package/dist/Legend/Legend.js.map +1 -1
- package/dist/LineChart/LineChart.d.ts +4 -2
- package/dist/LineChart/LineChart.d.ts.map +1 -1
- package/dist/LineChart/LineChart.js +1 -1
- package/dist/LineChart/LineChart.js.map +1 -1
- package/dist/OptionsEditorLayout/OptionsEditorControl.js +1 -1
- package/dist/OptionsEditorLayout/OptionsEditorControl.js.map +1 -1
- package/dist/OptionsEditorLayout/OptionsEditorGroup.d.ts +3 -2
- package/dist/OptionsEditorLayout/OptionsEditorGroup.d.ts.map +1 -1
- package/dist/OptionsEditorLayout/OptionsEditorGroup.js +17 -5
- package/dist/OptionsEditorLayout/OptionsEditorGroup.js.map +1 -1
- package/dist/StatChart/StatChart.d.ts +0 -1
- package/dist/StatChart/StatChart.d.ts.map +1 -1
- package/dist/StatChart/StatChart.js +1 -3
- package/dist/StatChart/StatChart.js.map +1 -1
- package/dist/ThresholdsEditor/ThresholdColorPicker.d.ts +4 -0
- package/dist/ThresholdsEditor/ThresholdColorPicker.d.ts.map +1 -0
- package/dist/ThresholdsEditor/ThresholdColorPicker.js +76 -0
- package/dist/ThresholdsEditor/ThresholdColorPicker.js.map +1 -0
- package/dist/ThresholdsEditor/ThresholdInput.d.ts +13 -0
- package/dist/ThresholdsEditor/ThresholdInput.d.ts.map +1 -0
- package/dist/ThresholdsEditor/ThresholdInput.js +61 -0
- package/dist/ThresholdsEditor/ThresholdInput.js.map +1 -0
- package/dist/ThresholdsEditor/ThresholdsEditor.d.ts +10 -0
- package/dist/ThresholdsEditor/ThresholdsEditor.d.ts.map +1 -0
- package/dist/ThresholdsEditor/ThresholdsEditor.js +215 -0
- package/dist/ThresholdsEditor/ThresholdsEditor.js.map +1 -0
- package/dist/ThresholdsEditor/index.d.ts +2 -0
- package/dist/ThresholdsEditor/index.d.ts.map +1 -0
- package/dist/ThresholdsEditor/index.js +15 -0
- package/dist/ThresholdsEditor/index.js.map +1 -0
- package/dist/TimeSeriesTooltip/focused-series.d.ts.map +1 -1
- package/dist/TimeSeriesTooltip/focused-series.js +3 -3
- package/dist/TimeSeriesTooltip/focused-series.js.map +1 -1
- package/dist/cjs/ColorPicker/ColorPicker.js +128 -0
- package/dist/cjs/{model/legend.test.js → ColorPicker/index.js} +11 -12
- package/dist/cjs/Legend/Legend.js +5 -8
- package/dist/cjs/LineChart/LineChart.js +40 -1
- package/dist/cjs/OptionsEditorLayout/OptionsEditorControl.js +1 -1
- package/dist/cjs/OptionsEditorLayout/OptionsEditorGroup.js +22 -5
- package/dist/cjs/StatChart/StatChart.js +1 -41
- package/dist/cjs/ThresholdsEditor/ThresholdColorPicker.js +87 -0
- package/dist/cjs/ThresholdsEditor/ThresholdInput.js +72 -0
- package/dist/cjs/ThresholdsEditor/ThresholdsEditor.js +265 -0
- package/dist/{model/legend.test.js → cjs/ThresholdsEditor/index.js} +15 -14
- package/dist/cjs/TimeSeriesTooltip/focused-series.js +3 -3
- package/dist/cjs/index.js +2 -0
- package/dist/cjs/test-utils/theme.js +8 -0
- package/dist/cjs/theme/theme.js +5 -0
- package/dist/cjs/utils/theme-gen.js +8 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -0
- package/dist/index.js.map +1 -1
- package/dist/model/graph.d.ts +2 -2
- package/dist/model/graph.d.ts.map +1 -1
- package/dist/model/graph.js.map +1 -1
- package/dist/model/legend.d.ts +1 -1
- package/dist/model/legend.d.ts.map +1 -1
- package/dist/model/legend.js.map +1 -1
- package/dist/model/theme.d.ts +5 -0
- package/dist/model/theme.d.ts.map +1 -1
- package/dist/model/theme.js.map +1 -1
- package/dist/model/units/bytes.d.ts +1 -1
- package/dist/model/units/bytes.d.ts.map +1 -1
- package/dist/model/units/bytes.js.map +1 -1
- package/dist/model/units/decimal.d.ts +1 -1
- package/dist/model/units/decimal.d.ts.map +1 -1
- package/dist/model/units/decimal.js.map +1 -1
- package/dist/model/units/percent.d.ts +1 -1
- package/dist/model/units/percent.d.ts.map +1 -1
- package/dist/model/units/percent.js.map +1 -1
- package/dist/model/units/time.d.ts +1 -1
- package/dist/model/units/time.d.ts.map +1 -1
- package/dist/model/units/time.js.map +1 -1
- package/dist/model/units/types.d.ts +1 -1
- package/dist/model/units/types.d.ts.map +1 -1
- package/dist/model/units/types.js.map +1 -1
- package/dist/test-utils/theme.d.ts.map +1 -1
- package/dist/test-utils/theme.js +8 -0
- package/dist/test-utils/theme.js.map +1 -1
- package/dist/theme/theme.js +5 -0
- package/dist/theme/theme.js.map +1 -1
- package/dist/utils/theme-gen.d.ts.map +1 -1
- package/dist/utils/theme-gen.js +8 -0
- package/dist/utils/theme-gen.js.map +1 -1
- package/package.json +5 -3
- package/dist/InfoTooltip/InfoTooltip.test.d.ts +0 -2
- package/dist/InfoTooltip/InfoTooltip.test.d.ts.map +0 -1
- package/dist/InfoTooltip/InfoTooltip.test.js +0 -36
- package/dist/InfoTooltip/InfoTooltip.test.js.map +0 -1
- package/dist/LegendOptionsEditor/LegendOptionsEditor.test.d.ts +0 -2
- package/dist/LegendOptionsEditor/LegendOptionsEditor.test.d.ts.map +0 -1
- package/dist/LegendOptionsEditor/LegendOptionsEditor.test.js +0 -62
- package/dist/LegendOptionsEditor/LegendOptionsEditor.test.js.map +0 -1
- package/dist/StatChart/StatChart.test.d.ts +0 -2
- package/dist/StatChart/StatChart.test.d.ts.map +0 -1
- package/dist/StatChart/StatChart.test.js +0 -94
- package/dist/StatChart/StatChart.test.js.map +0 -1
- package/dist/TimeSeriesTooltip/SeriesInfo.test.d.ts +0 -2
- package/dist/TimeSeriesTooltip/SeriesInfo.test.d.ts.map +0 -1
- package/dist/TimeSeriesTooltip/SeriesInfo.test.js +0 -52
- package/dist/TimeSeriesTooltip/SeriesInfo.test.js.map +0 -1
- package/dist/TimeSeriesTooltip/TooltipContent.test.d.ts +0 -2
- package/dist/TimeSeriesTooltip/TooltipContent.test.d.ts.map +0 -1
- package/dist/TimeSeriesTooltip/TooltipContent.test.js +0 -78
- package/dist/TimeSeriesTooltip/TooltipContent.test.js.map +0 -1
- package/dist/TimeSeriesTooltip/focused-series.test.d.ts +0 -2
- package/dist/TimeSeriesTooltip/focused-series.test.d.ts.map +0 -1
- package/dist/TimeSeriesTooltip/focused-series.test.js +0 -93
- package/dist/TimeSeriesTooltip/focused-series.test.js.map +0 -1
- package/dist/UnitSelector/UnitSelector.test.d.ts +0 -2
- package/dist/UnitSelector/UnitSelector.test.d.ts.map +0 -1
- package/dist/UnitSelector/UnitSelector.test.js +0 -204
- package/dist/UnitSelector/UnitSelector.test.js.map +0 -1
- package/dist/cjs/InfoTooltip/InfoTooltip.test.js +0 -43
- package/dist/cjs/LegendOptionsEditor/LegendOptionsEditor.test.js +0 -69
- package/dist/cjs/StatChart/StatChart.test.js +0 -96
- package/dist/cjs/TimeSeriesTooltip/SeriesInfo.test.js +0 -54
- package/dist/cjs/TimeSeriesTooltip/TooltipContent.test.js +0 -80
- package/dist/cjs/TimeSeriesTooltip/focused-series.test.js +0 -95
- package/dist/cjs/UnitSelector/UnitSelector.test.js +0 -211
- package/dist/cjs/model/units/units.test.js +0 -206
- package/dist/cjs/utils/format.test.js +0 -47
- package/dist/cjs/utils/theme-gen.test.js +0 -202
- package/dist/model/legend.test.d.ts +0 -2
- package/dist/model/legend.test.d.ts.map +0 -1
- package/dist/model/legend.test.js.map +0 -1
- package/dist/model/units/units.test.d.ts +0 -2
- package/dist/model/units/units.test.d.ts.map +0 -1
- package/dist/model/units/units.test.js +0 -204
- package/dist/model/units/units.test.js.map +0 -1
- package/dist/utils/format.test.d.ts +0 -2
- package/dist/utils/format.test.d.ts.map +0 -1
- package/dist/utils/format.test.js +0 -45
- package/dist/utils/format.test.js.map +0 -1
- package/dist/utils/theme-gen.test.d.ts +0 -2
- package/dist/utils/theme-gen.test.d.ts.map +0 -1
- package/dist/utils/theme-gen.test.js +0 -200
- package/dist/utils/theme-gen.test.js.map +0 -1
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/TimeSeriesTooltip/SeriesInfo.test.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { render } from '@testing-library/react';\nimport { screen } from '@testing-library/dom';\nimport { SeriesInfo, SeriesInfoProps } from './SeriesInfo';\n\ndescribe('SeriesInfo', () => {\n const renderComponent = (props: SeriesInfoProps) => {\n render(<SeriesInfo {...props} />);\n };\n\n it('render metric __name__ beside formattedY value', () => {\n const seriesInfo: SeriesInfoProps = {\n seriesName: 'node_load1{env=\"demo\",instance=\"demo.do.prometheus.io:9100\",job=\"node\"}',\n y: 0.28,\n formattedY: '28.0%',\n markerColor: 'hsla(1016196180,50%,50%,0.8)',\n totalSeries: 1,\n wrapLabels: true,\n };\n renderComponent(seriesInfo);\n expect(screen.getByText('node_load1:')).toBeInTheDocument();\n expect(screen.getByText('28.0%')).toBeInTheDocument();\n expect(screen.getByText('demo.do.prometheus.io:9100')).toBeInTheDocument(); // TODO: remove quotes\n });\n\n it('render preformatted series name beside formattedY value', () => {\n const seriesInfo: SeriesInfoProps = {\n seriesName: 'Node memory total',\n y: 552341504,\n formattedY: '526.75 MB',\n markerColor: 'hsla(-1756459732,50%,50%,0.8)',\n totalSeries: 2,\n wrapLabels: true,\n };\n renderComponent(seriesInfo);\n expect(screen.getByText('Node memory total')).toBeInTheDocument();\n expect(screen.getByText('526.75 MB')).toBeInTheDocument();\n });\n});\n"],"names":["render","screen","SeriesInfo","describe","renderComponent","props","it","seriesInfo","seriesName","y","formattedY","markerColor","totalSeries","wrapLabels","expect","getByText","toBeInTheDocument"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,SAASA,MAAM,QAAQ,wBAAwB,CAAC;AAChD,SAASC,MAAM,QAAQ,sBAAsB,CAAC;AAC9C,SAASC,UAAU,QAAyB,cAAc,CAAC;AAE3DC,QAAQ,CAAC,YAAY,EAAE,IAAM;IAC3B,MAAMC,eAAe,GAAG,CAACC,KAAsB,GAAK;QAClDL,MAAM,eAAC,KAACE,UAAU;YAAE,GAAGG,KAAK;UAAI,CAAC,CAAC;IACpC,CAAC,AAAC;IAEFC,EAAE,CAAC,gDAAgD,EAAE,IAAM;QACzD,MAAMC,UAAU,GAAoB;YAClCC,UAAU,EAAE,yEAAyE;YACrFC,CAAC,EAAE,IAAI;YACPC,UAAU,EAAE,OAAO;YACnBC,WAAW,EAAE,8BAA8B;YAC3CC,WAAW,EAAE,CAAC;YACdC,UAAU,EAAE,IAAI;SACjB,AAAC;QACFT,eAAe,CAACG,UAAU,CAAC,CAAC;QAC5BO,MAAM,CAACb,MAAM,CAACc,SAAS,CAAC,aAAa,CAAC,CAAC,CAACC,iBAAiB,EAAE,CAAC;QAC5DF,MAAM,CAACb,MAAM,CAACc,SAAS,CAAC,OAAO,CAAC,CAAC,CAACC,iBAAiB,EAAE,CAAC;QACtDF,MAAM,CAACb,MAAM,CAACc,SAAS,CAAC,4BAA4B,CAAC,CAAC,CAACC,iBAAiB,EAAE,CAAC,CAAC,sBAAsB;IACpG,CAAC,CAAC,CAAC;IAEHV,EAAE,CAAC,yDAAyD,EAAE,IAAM;QAClE,MAAMC,UAAU,GAAoB;YAClCC,UAAU,EAAE,mBAAmB;YAC/BC,CAAC,EAAE,SAAS;YACZC,UAAU,EAAE,WAAW;YACvBC,WAAW,EAAE,+BAA+B;YAC5CC,WAAW,EAAE,CAAC;YACdC,UAAU,EAAE,IAAI;SACjB,AAAC;QACFT,eAAe,CAACG,UAAU,CAAC,CAAC;QAC5BO,MAAM,CAACb,MAAM,CAACc,SAAS,CAAC,mBAAmB,CAAC,CAAC,CAACC,iBAAiB,EAAE,CAAC;QAClEF,MAAM,CAACb,MAAM,CAACc,SAAS,CAAC,WAAW,CAAC,CAAC,CAACC,iBAAiB,EAAE,CAAC;IAC5D,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TooltipContent.test.d.ts","sourceRoot":"","sources":["../../src/TimeSeriesTooltip/TooltipContent.test.tsx"],"names":[],"mappings":""}
|
|
@@ -1,78 +0,0 @@
|
|
|
1
|
-
// Copyright 2023 The Perses Authors
|
|
2
|
-
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
3
|
-
// you may not use this file except in compliance with the License.
|
|
4
|
-
// You may obtain a copy of the License at
|
|
5
|
-
//
|
|
6
|
-
// http://www.apache.org/licenses/LICENSE-2.0
|
|
7
|
-
//
|
|
8
|
-
// Unless required by applicable law or agreed to in writing, software
|
|
9
|
-
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
10
|
-
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
11
|
-
// See the License for the specific language governing permissions and
|
|
12
|
-
// limitations under the License.
|
|
13
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
14
|
-
import { render } from '@testing-library/react';
|
|
15
|
-
import { screen } from '@testing-library/dom';
|
|
16
|
-
import { TooltipContent } from './TooltipContent';
|
|
17
|
-
describe('TooltipContent', ()=>{
|
|
18
|
-
const renderComponent = (props)=>{
|
|
19
|
-
render(/*#__PURE__*/ _jsx(TooltipContent, {
|
|
20
|
-
...props
|
|
21
|
-
}));
|
|
22
|
-
};
|
|
23
|
-
it('render tooltip content with a single series name', ()=>{
|
|
24
|
-
const tooltipContent = {
|
|
25
|
-
focusedSeries: [
|
|
26
|
-
{
|
|
27
|
-
seriesIdx: 0,
|
|
28
|
-
datumIdx: 84,
|
|
29
|
-
seriesName: 'Test node demo.do.prometheus.io:9100',
|
|
30
|
-
date: 'Dec 23, 2022, 1:53:00 PM',
|
|
31
|
-
x: 1671821580000,
|
|
32
|
-
y: 0.1,
|
|
33
|
-
formattedY: '0.1',
|
|
34
|
-
markerColor: 'hsla(19838016,50%,50%,0.8)'
|
|
35
|
-
}
|
|
36
|
-
],
|
|
37
|
-
wrapLabels: true
|
|
38
|
-
};
|
|
39
|
-
renderComponent(tooltipContent);
|
|
40
|
-
expect(screen.getByText('Test node demo.do.prometheus.io:9100')).toBeInTheDocument();
|
|
41
|
-
expect(screen.getByText('Dec 23, 2022 -')).toBeInTheDocument();
|
|
42
|
-
expect(screen.getByText('13:53:00')).toBeInTheDocument();
|
|
43
|
-
expect(screen.getByText('0.1')).toBeInTheDocument();
|
|
44
|
-
});
|
|
45
|
-
it('render tooltip content with multiple series data', ()=>{
|
|
46
|
-
const tooltipContent = {
|
|
47
|
-
focusedSeries: [
|
|
48
|
-
{
|
|
49
|
-
seriesIdx: 2,
|
|
50
|
-
datumIdx: 48,
|
|
51
|
-
seriesName: 'node_memory_MemFree_bytes{env="demo",instance="demo.do.prometheus.io:9100",job="node"}',
|
|
52
|
-
date: 'Dec 23, 2022, 1:44:00 PM',
|
|
53
|
-
x: 1671821040000,
|
|
54
|
-
y: 84635648,
|
|
55
|
-
formattedY: '84.64M',
|
|
56
|
-
markerColor: 'hsla(1887856572,50%,50%,0.8)'
|
|
57
|
-
},
|
|
58
|
-
{
|
|
59
|
-
seriesIdx: 1,
|
|
60
|
-
datumIdx: 48,
|
|
61
|
-
seriesName: 'node_memory_Buffers_bytes{env="demo",instance="demo.do.prometheus.io:9100",job="node"}',
|
|
62
|
-
date: 'Dec 23, 2022, 1:44:00 PM',
|
|
63
|
-
x: 1671821040000,
|
|
64
|
-
y: 33771520,
|
|
65
|
-
formattedY: '33.77M',
|
|
66
|
-
markerColor: 'hsla(158479636,50%,50%,0.8)'
|
|
67
|
-
}
|
|
68
|
-
],
|
|
69
|
-
wrapLabels: true
|
|
70
|
-
};
|
|
71
|
-
renderComponent(tooltipContent);
|
|
72
|
-
expect(screen.getByText('84.64M')).toBeInTheDocument();
|
|
73
|
-
expect(screen.getByText('33.77M')).toBeInTheDocument();
|
|
74
|
-
expect(screen.getAllByText('env="demo", instance="demo.do.prometheus.io:9100", job="node"')).toHaveLength(2);
|
|
75
|
-
});
|
|
76
|
-
});
|
|
77
|
-
|
|
78
|
-
//# sourceMappingURL=TooltipContent.test.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/TimeSeriesTooltip/TooltipContent.test.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { render } from '@testing-library/react';\nimport { screen } from '@testing-library/dom';\nimport { TooltipContent, TooltipContentProps } from './TooltipContent';\n\ndescribe('TooltipContent', () => {\n const renderComponent = (props: TooltipContentProps) => {\n render(<TooltipContent {...props} />);\n };\n\n it('render tooltip content with a single series name', () => {\n const tooltipContent: TooltipContentProps = {\n focusedSeries: [\n {\n seriesIdx: 0,\n datumIdx: 84,\n seriesName: 'Test node demo.do.prometheus.io:9100',\n date: 'Dec 23, 2022, 1:53:00 PM',\n x: 1671821580000,\n y: 0.1,\n formattedY: '0.1',\n markerColor: 'hsla(19838016,50%,50%,0.8)',\n },\n ],\n wrapLabels: true,\n };\n renderComponent(tooltipContent);\n expect(screen.getByText('Test node demo.do.prometheus.io:9100')).toBeInTheDocument();\n expect(screen.getByText('Dec 23, 2022 -')).toBeInTheDocument();\n expect(screen.getByText('13:53:00')).toBeInTheDocument();\n expect(screen.getByText('0.1')).toBeInTheDocument();\n });\n\n it('render tooltip content with multiple series data', () => {\n const tooltipContent: TooltipContentProps = {\n focusedSeries: [\n {\n seriesIdx: 2,\n datumIdx: 48,\n seriesName: 'node_memory_MemFree_bytes{env=\"demo\",instance=\"demo.do.prometheus.io:9100\",job=\"node\"}',\n date: 'Dec 23, 2022, 1:44:00 PM',\n x: 1671821040000,\n y: 84635648,\n formattedY: '84.64M',\n markerColor: 'hsla(1887856572,50%,50%,0.8)',\n },\n {\n seriesIdx: 1,\n datumIdx: 48,\n seriesName: 'node_memory_Buffers_bytes{env=\"demo\",instance=\"demo.do.prometheus.io:9100\",job=\"node\"}',\n date: 'Dec 23, 2022, 1:44:00 PM',\n x: 1671821040000,\n y: 33771520,\n formattedY: '33.77M',\n markerColor: 'hsla(158479636,50%,50%,0.8)',\n },\n ],\n wrapLabels: true,\n };\n renderComponent(tooltipContent);\n expect(screen.getByText('84.64M')).toBeInTheDocument();\n expect(screen.getByText('33.77M')).toBeInTheDocument();\n expect(screen.getAllByText('env=\"demo\", instance=\"demo.do.prometheus.io:9100\", job=\"node\"')).toHaveLength(2);\n });\n});\n"],"names":["render","screen","TooltipContent","describe","renderComponent","props","it","tooltipContent","focusedSeries","seriesIdx","datumIdx","seriesName","date","x","y","formattedY","markerColor","wrapLabels","expect","getByText","toBeInTheDocument","getAllByText","toHaveLength"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,SAASA,MAAM,QAAQ,wBAAwB,CAAC;AAChD,SAASC,MAAM,QAAQ,sBAAsB,CAAC;AAC9C,SAASC,cAAc,QAA6B,kBAAkB,CAAC;AAEvEC,QAAQ,CAAC,gBAAgB,EAAE,IAAM;IAC/B,MAAMC,eAAe,GAAG,CAACC,KAA0B,GAAK;QACtDL,MAAM,eAAC,KAACE,cAAc;YAAE,GAAGG,KAAK;UAAI,CAAC,CAAC;IACxC,CAAC,AAAC;IAEFC,EAAE,CAAC,kDAAkD,EAAE,IAAM;QAC3D,MAAMC,cAAc,GAAwB;YAC1CC,aAAa,EAAE;gBACb;oBACEC,SAAS,EAAE,CAAC;oBACZC,QAAQ,EAAE,EAAE;oBACZC,UAAU,EAAE,sCAAsC;oBAClDC,IAAI,EAAE,0BAA0B;oBAChCC,CAAC,EAAE,aAAa;oBAChBC,CAAC,EAAE,GAAG;oBACNC,UAAU,EAAE,KAAK;oBACjBC,WAAW,EAAE,4BAA4B;iBAC1C;aACF;YACDC,UAAU,EAAE,IAAI;SACjB,AAAC;QACFb,eAAe,CAACG,cAAc,CAAC,CAAC;QAChCW,MAAM,CAACjB,MAAM,CAACkB,SAAS,CAAC,sCAAsC,CAAC,CAAC,CAACC,iBAAiB,EAAE,CAAC;QACrFF,MAAM,CAACjB,MAAM,CAACkB,SAAS,CAAC,gBAAgB,CAAC,CAAC,CAACC,iBAAiB,EAAE,CAAC;QAC/DF,MAAM,CAACjB,MAAM,CAACkB,SAAS,CAAC,UAAU,CAAC,CAAC,CAACC,iBAAiB,EAAE,CAAC;QACzDF,MAAM,CAACjB,MAAM,CAACkB,SAAS,CAAC,KAAK,CAAC,CAAC,CAACC,iBAAiB,EAAE,CAAC;IACtD,CAAC,CAAC,CAAC;IAEHd,EAAE,CAAC,kDAAkD,EAAE,IAAM;QAC3D,MAAMC,cAAc,GAAwB;YAC1CC,aAAa,EAAE;gBACb;oBACEC,SAAS,EAAE,CAAC;oBACZC,QAAQ,EAAE,EAAE;oBACZC,UAAU,EAAE,wFAAwF;oBACpGC,IAAI,EAAE,0BAA0B;oBAChCC,CAAC,EAAE,aAAa;oBAChBC,CAAC,EAAE,QAAQ;oBACXC,UAAU,EAAE,QAAQ;oBACpBC,WAAW,EAAE,8BAA8B;iBAC5C;gBACD;oBACEP,SAAS,EAAE,CAAC;oBACZC,QAAQ,EAAE,EAAE;oBACZC,UAAU,EAAE,wFAAwF;oBACpGC,IAAI,EAAE,0BAA0B;oBAChCC,CAAC,EAAE,aAAa;oBAChBC,CAAC,EAAE,QAAQ;oBACXC,UAAU,EAAE,QAAQ;oBACpBC,WAAW,EAAE,6BAA6B;iBAC3C;aACF;YACDC,UAAU,EAAE,IAAI;SACjB,AAAC;QACFb,eAAe,CAACG,cAAc,CAAC,CAAC;QAChCW,MAAM,CAACjB,MAAM,CAACkB,SAAS,CAAC,QAAQ,CAAC,CAAC,CAACC,iBAAiB,EAAE,CAAC;QACvDF,MAAM,CAACjB,MAAM,CAACkB,SAAS,CAAC,QAAQ,CAAC,CAAC,CAACC,iBAAiB,EAAE,CAAC;QACvDF,MAAM,CAACjB,MAAM,CAACoB,YAAY,CAAC,+DAA+D,CAAC,CAAC,CAACC,YAAY,CAAC,CAAC,CAAC,CAAC;IAC/G,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"focused-series.test.d.ts","sourceRoot":"","sources":["../../src/TimeSeriesTooltip/focused-series.test.ts"],"names":[],"mappings":""}
|
|
@@ -1,93 +0,0 @@
|
|
|
1
|
-
// Copyright 2023 The Perses Authors
|
|
2
|
-
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
3
|
-
// you may not use this file except in compliance with the License.
|
|
4
|
-
// You may obtain a copy of the License at
|
|
5
|
-
//
|
|
6
|
-
// http://www.apache.org/licenses/LICENSE-2.0
|
|
7
|
-
//
|
|
8
|
-
// Unless required by applicable law or agreed to in writing, software
|
|
9
|
-
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
10
|
-
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
11
|
-
// See the License for the specific language governing permissions and
|
|
12
|
-
// limitations under the License.
|
|
13
|
-
import { getNearbySeries } from './focused-series';
|
|
14
|
-
describe('getNearbySeries', ()=>{
|
|
15
|
-
const chartData = {
|
|
16
|
-
timeSeries: [
|
|
17
|
-
{
|
|
18
|
-
type: 'line',
|
|
19
|
-
name: 'env="demo", instance="demo.do.prometheus", job="node", mode="test"',
|
|
20
|
-
color: 'hsla(-1365438424,50%,50%,0.8)',
|
|
21
|
-
data: [
|
|
22
|
-
0.0002315202231525094,
|
|
23
|
-
0.00022873082287300112,
|
|
24
|
-
0.00023152022315149463,
|
|
25
|
-
0.00023152022315149463,
|
|
26
|
-
0.00022873082287300112
|
|
27
|
-
],
|
|
28
|
-
symbol: 'circle'
|
|
29
|
-
},
|
|
30
|
-
{
|
|
31
|
-
type: 'line',
|
|
32
|
-
name: 'env="demo", instance="demo.do.prometheus", job="node", mode="test alt"',
|
|
33
|
-
color: 'hsla(286664040,50%,50%,0.8)',
|
|
34
|
-
data: [
|
|
35
|
-
0.05245188284519867,
|
|
36
|
-
0.0524463040446356,
|
|
37
|
-
0.0524463040446356,
|
|
38
|
-
0.05247140864723438,
|
|
39
|
-
0.052482566248230646
|
|
40
|
-
],
|
|
41
|
-
symbol: 'circle'
|
|
42
|
-
}
|
|
43
|
-
],
|
|
44
|
-
xAxis: [
|
|
45
|
-
1654007865000,
|
|
46
|
-
1654007880000,
|
|
47
|
-
1654007895000,
|
|
48
|
-
1654007910000,
|
|
49
|
-
1654007925000
|
|
50
|
-
],
|
|
51
|
-
rangeMs: 60000
|
|
52
|
-
};
|
|
53
|
-
// https://echarts.apache.org/en/api.html#echartsInstance.convertFromPixel
|
|
54
|
-
const pointInGrid = [
|
|
55
|
-
2,
|
|
56
|
-
0.0560655737704918
|
|
57
|
-
]; // converted from chart.getZr() mousemove coordinates
|
|
58
|
-
const yBuffer = 0.02; // calculated from y axis interval
|
|
59
|
-
const focusedSeriesOutput = [
|
|
60
|
-
{
|
|
61
|
-
date: 'May 31, 2022, 2:38:15 PM',
|
|
62
|
-
datumIdx: 2,
|
|
63
|
-
markerColor: 'hsla(286664040,50%,50%,0.8)',
|
|
64
|
-
seriesName: 'env="demo", instance="demo.do.prometheus", job="node", mode="test alt"',
|
|
65
|
-
seriesIdx: 1,
|
|
66
|
-
x: 1654007895000,
|
|
67
|
-
y: 0.0524463040446356,
|
|
68
|
-
formattedY: '0.05'
|
|
69
|
-
}
|
|
70
|
-
];
|
|
71
|
-
it('should return focused series data for points nearby the cursor', ()=>{
|
|
72
|
-
const decimalUnit = {
|
|
73
|
-
kind: 'Decimal',
|
|
74
|
-
decimal_places: 2
|
|
75
|
-
};
|
|
76
|
-
expect(getNearbySeries(chartData, pointInGrid, yBuffer, decimalUnit)).toEqual(focusedSeriesOutput);
|
|
77
|
-
});
|
|
78
|
-
it('should return series values formatted as a percent', ()=>{
|
|
79
|
-
const percentFormattedOutput = [
|
|
80
|
-
...focusedSeriesOutput
|
|
81
|
-
];
|
|
82
|
-
if (percentFormattedOutput[0]) {
|
|
83
|
-
percentFormattedOutput[0].formattedY = '5%';
|
|
84
|
-
}
|
|
85
|
-
const percentFormattedUnit = {
|
|
86
|
-
kind: 'PercentDecimal',
|
|
87
|
-
decimal_places: 0
|
|
88
|
-
};
|
|
89
|
-
expect(getNearbySeries(chartData, pointInGrid, yBuffer, percentFormattedUnit)).toEqual(percentFormattedOutput);
|
|
90
|
-
});
|
|
91
|
-
});
|
|
92
|
-
|
|
93
|
-
//# sourceMappingURL=focused-series.test.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/TimeSeriesTooltip/focused-series.test.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { EChartsDataFormat, UnitOptions } from '../model';\nimport { getNearbySeries } from './focused-series';\n\ndescribe('getNearbySeries', () => {\n const chartData: EChartsDataFormat = {\n timeSeries: [\n {\n type: 'line',\n name: 'env=\"demo\", instance=\"demo.do.prometheus\", job=\"node\", mode=\"test\"',\n color: 'hsla(-1365438424,50%,50%,0.8)',\n data: [\n 0.0002315202231525094, 0.00022873082287300112, 0.00023152022315149463, 0.00023152022315149463,\n 0.00022873082287300112,\n ],\n symbol: 'circle',\n },\n {\n type: 'line',\n name: 'env=\"demo\", instance=\"demo.do.prometheus\", job=\"node\", mode=\"test alt\"',\n color: 'hsla(286664040,50%,50%,0.8)',\n data: [0.05245188284519867, 0.0524463040446356, 0.0524463040446356, 0.05247140864723438, 0.052482566248230646],\n symbol: 'circle',\n },\n ],\n xAxis: [1654007865000, 1654007880000, 1654007895000, 1654007910000, 1654007925000],\n rangeMs: 60000,\n };\n\n // https://echarts.apache.org/en/api.html#echartsInstance.convertFromPixel\n const pointInGrid = [2, 0.0560655737704918]; // converted from chart.getZr() mousemove coordinates\n\n const yBuffer = 0.02; // calculated from y axis interval\n\n const focusedSeriesOutput = [\n {\n date: 'May 31, 2022, 2:38:15 PM',\n datumIdx: 2,\n markerColor: 'hsla(286664040,50%,50%,0.8)',\n seriesName: 'env=\"demo\", instance=\"demo.do.prometheus\", job=\"node\", mode=\"test alt\"',\n seriesIdx: 1,\n x: 1654007895000,\n y: 0.0524463040446356,\n formattedY: '0.05',\n },\n ];\n\n it('should return focused series data for points nearby the cursor', () => {\n const decimalUnit: UnitOptions = {\n kind: 'Decimal',\n decimal_places: 2,\n };\n expect(getNearbySeries(chartData, pointInGrid, yBuffer, decimalUnit)).toEqual(focusedSeriesOutput);\n });\n\n it('should return series values formatted as a percent', () => {\n const percentFormattedOutput = [...focusedSeriesOutput];\n if (percentFormattedOutput[0]) {\n percentFormattedOutput[0].formattedY = '5%';\n }\n const percentFormattedUnit: UnitOptions = {\n kind: 'PercentDecimal',\n decimal_places: 0,\n };\n expect(getNearbySeries(chartData, pointInGrid, yBuffer, percentFormattedUnit)).toEqual(percentFormattedOutput);\n });\n});\n"],"names":["getNearbySeries","describe","chartData","timeSeries","type","name","color","data","symbol","xAxis","rangeMs","pointInGrid","yBuffer","focusedSeriesOutput","date","datumIdx","markerColor","seriesName","seriesIdx","x","y","formattedY","it","decimalUnit","kind","decimal_places","expect","toEqual","percentFormattedOutput","percentFormattedUnit"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAGjC,SAASA,eAAe,QAAQ,kBAAkB,CAAC;AAEnDC,QAAQ,CAAC,iBAAiB,EAAE,IAAM;IAChC,MAAMC,SAAS,GAAsB;QACnCC,UAAU,EAAE;YACV;gBACEC,IAAI,EAAE,MAAM;gBACZC,IAAI,EAAE,oEAAoE;gBAC1EC,KAAK,EAAE,+BAA+B;gBACtCC,IAAI,EAAE;AACJ,yCAAqB;AAAE,0CAAsB;AAAE,0CAAsB;AAAE,0CAAsB;AAC7F,0CAAsB;iBACvB;gBACDC,MAAM,EAAE,QAAQ;aACjB;YACD;gBACEJ,IAAI,EAAE,MAAM;gBACZC,IAAI,EAAE,wEAAwE;gBAC9EC,KAAK,EAAE,6BAA6B;gBACpCC,IAAI,EAAE;AAAC,uCAAmB;AAAE,sCAAkB;AAAE,sCAAkB;AAAE,uCAAmB;AAAE,wCAAoB;iBAAC;gBAC9GC,MAAM,EAAE,QAAQ;aACjB;SACF;QACDC,KAAK,EAAE;AAAC,yBAAa;AAAE,yBAAa;AAAE,yBAAa;AAAE,yBAAa;AAAE,yBAAa;SAAC;QAClFC,OAAO,EAAE,KAAK;KACf,AAAC;IAEF,0EAA0E;IAC1E,MAAMC,WAAW,GAAG;AAAC,SAAC;AAAE,0BAAkB;KAAC,AAAC,EAAC,qDAAqD;IAElG,MAAMC,OAAO,GAAG,IAAI,AAAC,EAAC,kCAAkC;IAExD,MAAMC,mBAAmB,GAAG;QAC1B;YACEC,IAAI,EAAE,0BAA0B;YAChCC,QAAQ,EAAE,CAAC;YACXC,WAAW,EAAE,6BAA6B;YAC1CC,UAAU,EAAE,wEAAwE;YACpFC,SAAS,EAAE,CAAC;YACZC,CAAC,EAAE,aAAa;YAChBC,CAAC,EAAE,kBAAkB;YACrBC,UAAU,EAAE,MAAM;SACnB;KACF,AAAC;IAEFC,EAAE,CAAC,gEAAgE,EAAE,IAAM;QACzE,MAAMC,WAAW,GAAgB;YAC/BC,IAAI,EAAE,SAAS;YACfC,cAAc,EAAE,CAAC;SAClB,AAAC;QACFC,MAAM,CAAC1B,eAAe,CAACE,SAAS,EAAES,WAAW,EAAEC,OAAO,EAAEW,WAAW,CAAC,CAAC,CAACI,OAAO,CAACd,mBAAmB,CAAC,CAAC;IACrG,CAAC,CAAC,CAAC;IAEHS,EAAE,CAAC,oDAAoD,EAAE,IAAM;QAC7D,MAAMM,sBAAsB,GAAG;eAAIf,mBAAmB;SAAC,AAAC;QACxD,IAAIe,sBAAsB,CAAC,CAAC,CAAC,EAAE;YAC7BA,sBAAsB,CAAC,CAAC,CAAC,CAACP,UAAU,GAAG,IAAI,CAAC;QAC9C,CAAC;QACD,MAAMQ,oBAAoB,GAAgB;YACxCL,IAAI,EAAE,gBAAgB;YACtBC,cAAc,EAAE,CAAC;SAClB,AAAC;QACFC,MAAM,CAAC1B,eAAe,CAACE,SAAS,EAAES,WAAW,EAAEC,OAAO,EAAEiB,oBAAoB,CAAC,CAAC,CAACF,OAAO,CAACC,sBAAsB,CAAC,CAAC;IACjH,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"UnitSelector.test.d.ts","sourceRoot":"","sources":["../../src/UnitSelector/UnitSelector.test.tsx"],"names":[],"mappings":""}
|
|
@@ -1,204 +0,0 @@
|
|
|
1
|
-
// Copyright 2023 The Perses Authors
|
|
2
|
-
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
3
|
-
// you may not use this file except in compliance with the License.
|
|
4
|
-
// You may obtain a copy of the License at
|
|
5
|
-
//
|
|
6
|
-
// http://www.apache.org/licenses/LICENSE-2.0
|
|
7
|
-
//
|
|
8
|
-
// Unless required by applicable law or agreed to in writing, software
|
|
9
|
-
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
10
|
-
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
11
|
-
// See the License for the specific language governing permissions and
|
|
12
|
-
// limitations under the License.
|
|
13
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
14
|
-
import { render, screen } from '@testing-library/react';
|
|
15
|
-
import userEvent from '@testing-library/user-event';
|
|
16
|
-
import { UnitSelector } from './UnitSelector';
|
|
17
|
-
describe('UnitSelector', ()=>{
|
|
18
|
-
const renderUnitSelector = (value, onChange = jest.fn())=>{
|
|
19
|
-
render(/*#__PURE__*/ _jsx("div", {
|
|
20
|
-
children: /*#__PURE__*/ _jsx(UnitSelector, {
|
|
21
|
-
value: value,
|
|
22
|
-
onChange: onChange
|
|
23
|
-
})
|
|
24
|
-
}));
|
|
25
|
-
};
|
|
26
|
-
const getUnitSelector = ()=>{
|
|
27
|
-
return screen.getByRole('combobox', {
|
|
28
|
-
name: 'Units'
|
|
29
|
-
});
|
|
30
|
-
};
|
|
31
|
-
const getDecimalSelector = ()=>{
|
|
32
|
-
return screen.getByRole('combobox', {
|
|
33
|
-
name: 'Decimal'
|
|
34
|
-
});
|
|
35
|
-
};
|
|
36
|
-
const getAbbreviateSwitch = ()=>{
|
|
37
|
-
return screen.getByRole('checkbox', {
|
|
38
|
-
name: 'Abbreviate'
|
|
39
|
-
});
|
|
40
|
-
};
|
|
41
|
-
it('can change the unit kind by clicking', ()=>{
|
|
42
|
-
const onChange = jest.fn();
|
|
43
|
-
renderUnitSelector({
|
|
44
|
-
kind: 'Minutes'
|
|
45
|
-
}, onChange);
|
|
46
|
-
const unitSelector = getUnitSelector();
|
|
47
|
-
userEvent.click(unitSelector);
|
|
48
|
-
const decimalOption = screen.getByRole('option', {
|
|
49
|
-
name: 'Decimal'
|
|
50
|
-
});
|
|
51
|
-
userEvent.click(decimalOption);
|
|
52
|
-
expect(onChange).toHaveBeenCalledWith({
|
|
53
|
-
kind: 'Decimal'
|
|
54
|
-
});
|
|
55
|
-
});
|
|
56
|
-
it('can change the unit kind using a keyboard', ()=>{
|
|
57
|
-
const onChange = jest.fn();
|
|
58
|
-
renderUnitSelector({
|
|
59
|
-
kind: 'Bytes'
|
|
60
|
-
}, onChange);
|
|
61
|
-
const unitSelector = getUnitSelector();
|
|
62
|
-
userEvent.tab();
|
|
63
|
-
userEvent.tab();
|
|
64
|
-
expect(unitSelector).toHaveFocus();
|
|
65
|
-
userEvent.clear(unitSelector);
|
|
66
|
-
userEvent.keyboard('years');
|
|
67
|
-
screen.getByRole('option', {
|
|
68
|
-
name: 'Years'
|
|
69
|
-
});
|
|
70
|
-
userEvent.keyboard('{arrowup}{enter}');
|
|
71
|
-
expect(onChange).toHaveBeenCalledWith({
|
|
72
|
-
kind: 'Years'
|
|
73
|
-
});
|
|
74
|
-
});
|
|
75
|
-
it('can change the decimal places by clicking', ()=>{
|
|
76
|
-
const onChange = jest.fn();
|
|
77
|
-
renderUnitSelector({
|
|
78
|
-
kind: 'Decimal',
|
|
79
|
-
decimal_places: 0,
|
|
80
|
-
abbreviate: true
|
|
81
|
-
}, onChange);
|
|
82
|
-
userEvent.click(getDecimalSelector());
|
|
83
|
-
const decimalOption = screen.getByRole('option', {
|
|
84
|
-
name: '1'
|
|
85
|
-
});
|
|
86
|
-
userEvent.click(decimalOption);
|
|
87
|
-
expect(onChange).toHaveBeenCalledWith({
|
|
88
|
-
kind: 'Decimal',
|
|
89
|
-
decimal_places: 1,
|
|
90
|
-
abbreviate: true
|
|
91
|
-
});
|
|
92
|
-
});
|
|
93
|
-
it('can change the decimal places using a keyboard', ()=>{
|
|
94
|
-
const onChange = jest.fn();
|
|
95
|
-
renderUnitSelector({
|
|
96
|
-
kind: 'Percent'
|
|
97
|
-
}, onChange);
|
|
98
|
-
const decimalSelector = getDecimalSelector();
|
|
99
|
-
userEvent.tab();
|
|
100
|
-
userEvent.tab();
|
|
101
|
-
expect(decimalSelector).toHaveFocus();
|
|
102
|
-
userEvent.clear(decimalSelector);
|
|
103
|
-
userEvent.keyboard('3');
|
|
104
|
-
screen.getByRole('option', {
|
|
105
|
-
name: '3'
|
|
106
|
-
});
|
|
107
|
-
userEvent.keyboard('{arrowup}{enter}');
|
|
108
|
-
expect(onChange).toHaveBeenCalledWith({
|
|
109
|
-
kind: 'Percent',
|
|
110
|
-
decimal_places: 3
|
|
111
|
-
});
|
|
112
|
-
});
|
|
113
|
-
it('can change abbreviate by clicking', ()=>{
|
|
114
|
-
const onChange = jest.fn();
|
|
115
|
-
renderUnitSelector({
|
|
116
|
-
kind: 'Decimal',
|
|
117
|
-
decimal_places: 3,
|
|
118
|
-
abbreviate: true
|
|
119
|
-
}, onChange);
|
|
120
|
-
userEvent.click(getAbbreviateSwitch());
|
|
121
|
-
expect(onChange).toHaveBeenCalledWith({
|
|
122
|
-
kind: 'Decimal',
|
|
123
|
-
decimal_places: 3,
|
|
124
|
-
abbreviate: false
|
|
125
|
-
});
|
|
126
|
-
});
|
|
127
|
-
it('can change abbreviate using a keyboard', ()=>{
|
|
128
|
-
const onChange = jest.fn();
|
|
129
|
-
renderUnitSelector({
|
|
130
|
-
kind: 'Decimal',
|
|
131
|
-
decimal_places: 0
|
|
132
|
-
}, onChange);
|
|
133
|
-
userEvent.tab();
|
|
134
|
-
userEvent.keyboard('{space}');
|
|
135
|
-
expect(onChange).toHaveBeenCalledWith({
|
|
136
|
-
kind: 'Decimal',
|
|
137
|
-
decimal_places: 0,
|
|
138
|
-
abbreviate: true
|
|
139
|
-
});
|
|
140
|
-
});
|
|
141
|
-
describe('with a time unit selected', ()=>{
|
|
142
|
-
it('does not allow the user to set abbreviate', ()=>{
|
|
143
|
-
renderUnitSelector({
|
|
144
|
-
kind: 'Minutes'
|
|
145
|
-
});
|
|
146
|
-
expect(getAbbreviateSwitch()).toBeDisabled();
|
|
147
|
-
});
|
|
148
|
-
});
|
|
149
|
-
describe('with a percent unit selected', ()=>{
|
|
150
|
-
it('allows the user to modify the decimal places', ()=>{
|
|
151
|
-
renderUnitSelector({
|
|
152
|
-
kind: 'Percent'
|
|
153
|
-
});
|
|
154
|
-
expect(getDecimalSelector()).toBeEnabled();
|
|
155
|
-
});
|
|
156
|
-
it('does not allow the user to set abbreviate', ()=>{
|
|
157
|
-
renderUnitSelector({
|
|
158
|
-
kind: 'PercentDecimal'
|
|
159
|
-
});
|
|
160
|
-
expect(getAbbreviateSwitch()).toBeDisabled();
|
|
161
|
-
});
|
|
162
|
-
});
|
|
163
|
-
describe('with a decimal unit selected', ()=>{
|
|
164
|
-
it('allows the user to modify the decimal places', ()=>{
|
|
165
|
-
renderUnitSelector({
|
|
166
|
-
kind: 'Decimal'
|
|
167
|
-
});
|
|
168
|
-
expect(getDecimalSelector()).toBeEnabled();
|
|
169
|
-
});
|
|
170
|
-
it('allows the user to set abbreviate', ()=>{
|
|
171
|
-
renderUnitSelector({
|
|
172
|
-
kind: 'Decimal'
|
|
173
|
-
});
|
|
174
|
-
expect(getAbbreviateSwitch()).toBeEnabled();
|
|
175
|
-
});
|
|
176
|
-
});
|
|
177
|
-
describe('with a bytes unit selected', ()=>{
|
|
178
|
-
it('allows the user to modify the decimal places', ()=>{
|
|
179
|
-
renderUnitSelector({
|
|
180
|
-
kind: 'Bytes'
|
|
181
|
-
});
|
|
182
|
-
expect(getDecimalSelector()).toBeEnabled();
|
|
183
|
-
});
|
|
184
|
-
it('allows the user to set abbreviate', ()=>{
|
|
185
|
-
renderUnitSelector({
|
|
186
|
-
kind: 'Bytes'
|
|
187
|
-
});
|
|
188
|
-
expect(getAbbreviateSwitch()).toBeEnabled();
|
|
189
|
-
});
|
|
190
|
-
});
|
|
191
|
-
it('should not show an option for disabled units', ()=>{
|
|
192
|
-
const onChange = jest.fn();
|
|
193
|
-
renderUnitSelector({
|
|
194
|
-
kind: 'Decimal'
|
|
195
|
-
}, onChange);
|
|
196
|
-
userEvent.click(getUnitSelector());
|
|
197
|
-
const percentShorthandOption = screen.queryByRole('option', {
|
|
198
|
-
name: '%'
|
|
199
|
-
});
|
|
200
|
-
expect(percentShorthandOption).not.toBeInTheDocument();
|
|
201
|
-
});
|
|
202
|
-
});
|
|
203
|
-
|
|
204
|
-
//# sourceMappingURL=UnitSelector.test.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/UnitSelector/UnitSelector.test.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { render, screen } from '@testing-library/react';\nimport userEvent from '@testing-library/user-event';\nimport { UnitOptions } from '../model';\nimport { UnitSelector } from './UnitSelector';\n\ndescribe('UnitSelector', () => {\n const renderUnitSelector = (value: UnitOptions, onChange = jest.fn()) => {\n render(\n <div>\n <UnitSelector value={value} onChange={onChange} />\n </div>\n );\n };\n\n const getUnitSelector = () => {\n return screen.getByRole('combobox', { name: 'Units' });\n };\n\n const getDecimalSelector = () => {\n return screen.getByRole('combobox', { name: 'Decimal' });\n };\n\n const getAbbreviateSwitch = () => {\n return screen.getByRole('checkbox', { name: 'Abbreviate' });\n };\n\n it('can change the unit kind by clicking', () => {\n const onChange = jest.fn();\n renderUnitSelector({ kind: 'Minutes' }, onChange);\n\n const unitSelector = getUnitSelector();\n userEvent.click(unitSelector);\n const decimalOption = screen.getByRole('option', {\n name: 'Decimal',\n });\n userEvent.click(decimalOption);\n\n expect(onChange).toHaveBeenCalledWith({\n kind: 'Decimal',\n });\n });\n\n it('can change the unit kind using a keyboard', () => {\n const onChange = jest.fn();\n renderUnitSelector({ kind: 'Bytes' }, onChange);\n\n const unitSelector = getUnitSelector();\n userEvent.tab();\n userEvent.tab();\n expect(unitSelector).toHaveFocus();\n\n userEvent.clear(unitSelector);\n userEvent.keyboard('years');\n screen.getByRole('option', {\n name: 'Years',\n });\n\n userEvent.keyboard('{arrowup}{enter}');\n\n expect(onChange).toHaveBeenCalledWith({\n kind: 'Years',\n });\n });\n\n it('can change the decimal places by clicking', () => {\n const onChange = jest.fn();\n renderUnitSelector({ kind: 'Decimal', decimal_places: 0, abbreviate: true }, onChange);\n\n userEvent.click(getDecimalSelector());\n const decimalOption = screen.getByRole('option', {\n name: '1',\n });\n userEvent.click(decimalOption);\n\n expect(onChange).toHaveBeenCalledWith({\n kind: 'Decimal',\n decimal_places: 1,\n abbreviate: true,\n });\n });\n\n it('can change the decimal places using a keyboard', () => {\n const onChange = jest.fn();\n renderUnitSelector({ kind: 'Percent' }, onChange);\n\n const decimalSelector = getDecimalSelector();\n userEvent.tab();\n userEvent.tab();\n expect(decimalSelector).toHaveFocus();\n\n userEvent.clear(decimalSelector);\n userEvent.keyboard('3');\n screen.getByRole('option', {\n name: '3',\n });\n\n userEvent.keyboard('{arrowup}{enter}');\n\n expect(onChange).toHaveBeenCalledWith({\n kind: 'Percent',\n decimal_places: 3,\n });\n });\n\n it('can change abbreviate by clicking', () => {\n const onChange = jest.fn();\n renderUnitSelector({ kind: 'Decimal', decimal_places: 3, abbreviate: true }, onChange);\n\n userEvent.click(getAbbreviateSwitch());\n\n expect(onChange).toHaveBeenCalledWith({\n kind: 'Decimal',\n decimal_places: 3,\n abbreviate: false,\n });\n });\n\n it('can change abbreviate using a keyboard', () => {\n const onChange = jest.fn();\n renderUnitSelector({ kind: 'Decimal', decimal_places: 0 }, onChange);\n\n userEvent.tab();\n userEvent.keyboard('{space}');\n\n expect(onChange).toHaveBeenCalledWith({\n kind: 'Decimal',\n decimal_places: 0,\n abbreviate: true,\n });\n });\n\n describe('with a time unit selected', () => {\n it('does not allow the user to set abbreviate', () => {\n renderUnitSelector({ kind: 'Minutes' });\n expect(getAbbreviateSwitch()).toBeDisabled();\n });\n });\n\n describe('with a percent unit selected', () => {\n it('allows the user to modify the decimal places', () => {\n renderUnitSelector({ kind: 'Percent' });\n expect(getDecimalSelector()).toBeEnabled();\n });\n\n it('does not allow the user to set abbreviate', () => {\n renderUnitSelector({ kind: 'PercentDecimal' });\n expect(getAbbreviateSwitch()).toBeDisabled();\n });\n });\n\n describe('with a decimal unit selected', () => {\n it('allows the user to modify the decimal places', () => {\n renderUnitSelector({ kind: 'Decimal' });\n expect(getDecimalSelector()).toBeEnabled();\n });\n\n it('allows the user to set abbreviate', () => {\n renderUnitSelector({ kind: 'Decimal' });\n expect(getAbbreviateSwitch()).toBeEnabled();\n });\n });\n\n describe('with a bytes unit selected', () => {\n it('allows the user to modify the decimal places', () => {\n renderUnitSelector({ kind: 'Bytes' });\n expect(getDecimalSelector()).toBeEnabled();\n });\n\n it('allows the user to set abbreviate', () => {\n renderUnitSelector({ kind: 'Bytes' });\n expect(getAbbreviateSwitch()).toBeEnabled();\n });\n });\n\n it('should not show an option for disabled units', () => {\n const onChange = jest.fn();\n renderUnitSelector({ kind: 'Decimal' }, onChange);\n\n userEvent.click(getUnitSelector());\n const percentShorthandOption = screen.queryByRole('option', {\n name: '%',\n });\n expect(percentShorthandOption).not.toBeInTheDocument();\n });\n});\n"],"names":["render","screen","userEvent","UnitSelector","describe","renderUnitSelector","value","onChange","jest","fn","div","getUnitSelector","getByRole","name","getDecimalSelector","getAbbreviateSwitch","it","kind","unitSelector","click","decimalOption","expect","toHaveBeenCalledWith","tab","toHaveFocus","clear","keyboard","decimal_places","abbreviate","decimalSelector","toBeDisabled","toBeEnabled","percentShorthandOption","queryByRole","not","toBeInTheDocument"],"mappings":"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"}
|
|
@@ -1,43 +0,0 @@
|
|
|
1
|
-
// Copyright 2023 The Perses Authors
|
|
2
|
-
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
3
|
-
// you may not use this file except in compliance with the License.
|
|
4
|
-
// You may obtain a copy of the License at
|
|
5
|
-
//
|
|
6
|
-
// http://www.apache.org/licenses/LICENSE-2.0
|
|
7
|
-
//
|
|
8
|
-
// Unless required by applicable law or agreed to in writing, software
|
|
9
|
-
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
10
|
-
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
11
|
-
// See the License for the specific language governing permissions and
|
|
12
|
-
// limitations under the License.
|
|
13
|
-
"use strict";
|
|
14
|
-
Object.defineProperty(exports, "__esModule", {
|
|
15
|
-
value: true
|
|
16
|
-
});
|
|
17
|
-
const _jsxRuntime = require("react/jsx-runtime");
|
|
18
|
-
const _react = require("@testing-library/react");
|
|
19
|
-
const _userEvent = /*#__PURE__*/ _interopRequireDefault(require("@testing-library/user-event"));
|
|
20
|
-
const _dom = require("@testing-library/dom");
|
|
21
|
-
const _infoTooltip = require("./InfoTooltip");
|
|
22
|
-
function _interopRequireDefault(obj) {
|
|
23
|
-
return obj && obj.__esModule ? obj : {
|
|
24
|
-
default: obj
|
|
25
|
-
};
|
|
26
|
-
}
|
|
27
|
-
describe('InfoTooltip', ()=>{
|
|
28
|
-
const title = 'Tooltip Title';
|
|
29
|
-
const description = 'this is a tooltip';
|
|
30
|
-
it('should render title and description', async ()=>{
|
|
31
|
-
(0, _react.render)(/*#__PURE__*/ (0, _jsxRuntime.jsx)(_infoTooltip.InfoTooltip, {
|
|
32
|
-
title: title,
|
|
33
|
-
description: description,
|
|
34
|
-
children: /*#__PURE__*/ (0, _jsxRuntime.jsx)("div", {
|
|
35
|
-
children: "tooltipAnchor"
|
|
36
|
-
})
|
|
37
|
-
}));
|
|
38
|
-
const tooltipAnchor = _dom.screen.getByText('tooltipAnchor');
|
|
39
|
-
_userEvent.default.hover(tooltipAnchor);
|
|
40
|
-
await _dom.screen.findByText(title);
|
|
41
|
-
_dom.screen.findByText(description);
|
|
42
|
-
});
|
|
43
|
-
});
|
|
@@ -1,69 +0,0 @@
|
|
|
1
|
-
// Copyright 2023 The Perses Authors
|
|
2
|
-
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
3
|
-
// you may not use this file except in compliance with the License.
|
|
4
|
-
// You may obtain a copy of the License at
|
|
5
|
-
//
|
|
6
|
-
// http://www.apache.org/licenses/LICENSE-2.0
|
|
7
|
-
//
|
|
8
|
-
// Unless required by applicable law or agreed to in writing, software
|
|
9
|
-
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
10
|
-
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
11
|
-
// See the License for the specific language governing permissions and
|
|
12
|
-
// limitations under the License.
|
|
13
|
-
"use strict";
|
|
14
|
-
Object.defineProperty(exports, "__esModule", {
|
|
15
|
-
value: true
|
|
16
|
-
});
|
|
17
|
-
const _jsxRuntime = require("react/jsx-runtime");
|
|
18
|
-
const _react = require("@testing-library/react");
|
|
19
|
-
const _userEvent = /*#__PURE__*/ _interopRequireDefault(require("@testing-library/user-event"));
|
|
20
|
-
const _legendOptionsEditor = require("./LegendOptionsEditor");
|
|
21
|
-
function _interopRequireDefault(obj) {
|
|
22
|
-
return obj && obj.__esModule ? obj : {
|
|
23
|
-
default: obj
|
|
24
|
-
};
|
|
25
|
-
}
|
|
26
|
-
describe('LegendOptionsEditor', ()=>{
|
|
27
|
-
const renderLegendOptionsEditor = (value, onChange = jest.fn())=>{
|
|
28
|
-
(0, _react.render)(/*#__PURE__*/ (0, _jsxRuntime.jsx)("div", {
|
|
29
|
-
children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_legendOptionsEditor.LegendOptionsEditor, {
|
|
30
|
-
value: value,
|
|
31
|
-
onChange: onChange
|
|
32
|
-
})
|
|
33
|
-
}));
|
|
34
|
-
};
|
|
35
|
-
const getLegendShowSwitch = ()=>{
|
|
36
|
-
return _react.screen.getByRole('checkbox', {
|
|
37
|
-
name: 'Show'
|
|
38
|
-
});
|
|
39
|
-
};
|
|
40
|
-
const getLegendPositionSelector = ()=>{
|
|
41
|
-
return _react.screen.getByRole('combobox', {
|
|
42
|
-
name: 'Position'
|
|
43
|
-
});
|
|
44
|
-
};
|
|
45
|
-
it('can change legend visibility by clicking', ()=>{
|
|
46
|
-
const onChange = jest.fn();
|
|
47
|
-
renderLegendOptionsEditor(undefined, onChange);
|
|
48
|
-
expect(getLegendPositionSelector()).toBeDisabled();
|
|
49
|
-
_userEvent.default.click(getLegendShowSwitch());
|
|
50
|
-
expect(onChange).toHaveBeenCalledWith({
|
|
51
|
-
position: 'Bottom'
|
|
52
|
-
});
|
|
53
|
-
});
|
|
54
|
-
it('should allow changing legend position', ()=>{
|
|
55
|
-
const onChange = jest.fn();
|
|
56
|
-
renderLegendOptionsEditor({
|
|
57
|
-
position: 'Bottom'
|
|
58
|
-
}, onChange);
|
|
59
|
-
expect(getLegendPositionSelector()).toBeEnabled();
|
|
60
|
-
_userEvent.default.click(getLegendPositionSelector());
|
|
61
|
-
const positionRightOption = _react.screen.getByRole('option', {
|
|
62
|
-
name: 'Right'
|
|
63
|
-
});
|
|
64
|
-
_userEvent.default.click(positionRightOption);
|
|
65
|
-
expect(onChange).toHaveBeenCalledWith({
|
|
66
|
-
position: 'Right'
|
|
67
|
-
});
|
|
68
|
-
});
|
|
69
|
-
});
|