Skip to content

Commit b4b2cc8

Browse files
committed
Improve test coverage
1 parent 1b3ba18 commit b4b2cc8

File tree

7 files changed

+370
-44
lines changed

7 files changed

+370
-44
lines changed

cypress/fixtures/donut-evolution.json

Lines changed: 172 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,172 @@
1+
{
2+
"dataset": [
3+
{
4+
"name": "Serie 1",
5+
"values": [
6+
0,
7+
1,
8+
1,
9+
2,
10+
3,
11+
5,
12+
8,
13+
13,
14+
21,
15+
34,
16+
55,
17+
89,
18+
12
19+
]
20+
},
21+
{
22+
"name": "Serie 2",
23+
"values": [
24+
10,
25+
5,
26+
20,
27+
10,
28+
10,
29+
10,
30+
10,
31+
10,
32+
10,
33+
10,
34+
10,
35+
10,
36+
0
37+
]
38+
},
39+
{
40+
"name": "Serie 3",
41+
"values": [
42+
5,
43+
5,
44+
5,
45+
5,
46+
5,
47+
5,
48+
5,
49+
5,
50+
5,
51+
5,
52+
5,
53+
5,
54+
0
55+
]
56+
},
57+
{
58+
"name": "Serie 3",
59+
"values": [
60+
5,
61+
5,
62+
5,
63+
5,
64+
5,
65+
5
66+
]
67+
}
68+
],
69+
"config": {
70+
"style": {
71+
"fontFamily":"inherit",
72+
"chart": {
73+
"backgroundColor":"#FFFFFF",
74+
"color":"#2D353C",
75+
"layout": {
76+
"height": 316,
77+
"width": 500,
78+
"padding": {
79+
"top": 24,
80+
"left": 48,
81+
"right": 48,
82+
"bottom": 24
83+
},
84+
"grid": {
85+
"show": true,
86+
"stroke":"#e1e5e8",
87+
"strokeWidth": 0.7,
88+
"showVerticalLines": true,
89+
"yAxis": {
90+
"dataLabels": {
91+
"show": true,
92+
"fontSize": 10,
93+
"color":"#2D353C",
94+
"roundingValue": 0,
95+
"offsetX": 0,
96+
"bold": false,
97+
"steps": 10
98+
}
99+
},
100+
"xAxis": {
101+
"dataLabels": {
102+
"show": true,
103+
"values": ["JAN", "FEB", "MAR", "APR", "MAY", "JUN", "JUL", "AUG", "SEP", "OCT", "NOV", "DEC", "JAN"],
104+
"fontSize": 8,
105+
"showOnlyFirstAndLast": false,
106+
"color": "#2D353C"
107+
}
108+
}
109+
},
110+
"line": {
111+
"show": true,
112+
"stroke": "#CCCCCC",
113+
"strokeWidth": 4
114+
},
115+
"highlighter": {
116+
"color": "#2D353C",
117+
"opacity": 5
118+
},
119+
"dataLabels": {
120+
"show": true,
121+
"fontSize": 10,
122+
"color":"#2D353C",
123+
"bold": false,
124+
"rounding": 0,
125+
"prefix": "",
126+
"suffix": "",
127+
"offsetY": 0
128+
}
129+
},
130+
"title": {
131+
"text": "Title",
132+
"color": "#2D353C",
133+
"fontSize": 20,
134+
"bold": true,
135+
"subtitle": {
136+
"color": "#A1A1A1",
137+
"text": "Subtitle",
138+
"fontSize": 16,
139+
"bold": false
140+
}
141+
},
142+
"legend": {
143+
"color": "#2D353C",
144+
"backgroundColor": "#FFFFFF",
145+
"bold": false,
146+
"show": true,
147+
"fontSize": 16,
148+
"roundingPercentage": 0,
149+
"roundingValue": 0
150+
}
151+
}
152+
},
153+
"table": {
154+
"show": false,
155+
"th": {
156+
"backgroundColor": "#FAFAFA",
157+
"color": "#2D353C",
158+
"outline": "1px solid #e1e5e8"
159+
},
160+
"td": {
161+
"backgroundColor": "#FFFFFF",
162+
"color": "#2D353C",
163+
"outline": "1px solid #e1e5e8",
164+
"roundingValue": 0,
165+
"roundingPercentage": 0
166+
}
167+
},
168+
"userOptions": {
169+
"show": true
170+
}
171+
}
172+
}

package-lock.json

Lines changed: 18 additions & 18 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "vue-data-ui",
33
"private": false,
4-
"version": "1.9.36",
4+
"version": "1.9.37",
55
"type": "module",
66
"description": "A user-empowering data visualization Vue components library",
77
"keywords": [
Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
import VueUiDonutEvolution from './vue-ui-donut-evolution.vue'
2+
3+
describe('<VueUiDonutEvolution />', () => {
4+
beforeEach(function () {
5+
cy.fixture('donut-evolution.json').as('fixture');
6+
cy.viewport(400, 400);
7+
cy.get('@fixture').then((fixture) => {
8+
cy.mount(VueUiDonutEvolution, {
9+
props: {
10+
dataset: fixture.dataset,
11+
config: fixture.config
12+
}
13+
})
14+
})
15+
});
16+
17+
function updateConfig(modifiedConfig) {
18+
cy.get('@fixture').then((fixture) => {
19+
const updatedFixture = { ...fixture, config: modifiedConfig };
20+
cy.wrap(updatedFixture).as('fixture');
21+
cy.mount(VueUiDonutEvolution, {
22+
props: {
23+
dataset: fixture.dataset,
24+
config: modifiedConfig
25+
}
26+
});
27+
});
28+
}
29+
30+
it('renders donuts', () => {
31+
for(let i = 0; i < 12; i += 1) {
32+
cy.get(`[data-cy="donut-wrapper-${i}"]`).then(($wrapper) => {
33+
cy.wrap($wrapper).should('exist')
34+
})
35+
36+
cy.get(`[data-cy="trap-${i}"]`).then(($trap) => {
37+
cy.wrap($trap).trigger('mouseenter', { force: true })
38+
cy.wait(150)
39+
cy.wrap($trap).trigger('mouseleave')
40+
cy.wrap($trap).click();
41+
cy.wait(150)
42+
cy.get(`[data-cy="quit-dialog"]`).click()
43+
})
44+
}
45+
})
46+
47+
it('opens user options and shows table', () => {
48+
cy.get(`[data-cy="user-options-summary"]`).click()
49+
cy.get(`[data-cy="user-options-table"]`).click()
50+
cy.viewport(400,670);
51+
cy.get(`[data-cy="vue-data-ui-table-data"]`).should('exist')
52+
})
53+
54+
it('downloads pdf, img, xlsx', () => {
55+
cy.get('@fixture').then((fixture) => {
56+
cy.get(`[data-cy="user-options-summary"]`).click()
57+
cy.get(`[data-cy="user-options-pdf"]`).click();
58+
cy.wait(3000);
59+
cy.readFile(`cypress\\Downloads\\${fixture.config.style.chart.title.text}.pdf`);
60+
cy.get(`[data-cy="user-options-xls"]`).click();
61+
cy.wait(3000);
62+
cy.readFile(`cypress\\Downloads\\${fixture.config.style.chart.title.text}.xlsx`);
63+
cy.get(`[data-cy="user-options-img"]`).click();
64+
cy.wait(3000);
65+
cy.readFile(`cypress\\Downloads\\${fixture.config.style.chart.title.text}.png`);
66+
cy.clearDownloads();
67+
cy.get(`[data-cy="user-options-summary"]`).click()
68+
})
69+
})
70+
})

src/components/vue-ui-donut-evolution.vue

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@ import Title from "../atoms/Title.vue";
88
import { useNestedProp } from "../useNestedProp";
99
import UserOptions from "../atoms/UserOptions.vue";
1010
import DataTable from "../atoms/DataTable.vue";
11-
import Tooltip from "../atoms/Tooltip.vue";
1211
import Legend from "../atoms/Legend.vue";
1312
1413
const props = defineProps({
@@ -32,10 +31,6 @@ const defaultConfig = ref(mainConfig.vue_ui_donut_evolution);
3231
3332
const isPrinting = ref(false);
3433
const isImaging = ref(false);
35-
const donutEvolutionChart = ref(null);
36-
const isTooltip = ref(false);
37-
const tooltipContent = ref("");
38-
const selectedSerie = ref(null);
3934
const segregated = ref([]);
4035
const hoveredIndex = ref(null);
4136
const hoveredDatapoint = ref(null);
@@ -506,7 +501,7 @@ defineExpose({
506501
</g>
507502
</g>
508503
509-
<g v-for="(datapoint, i ) in drawableDataset" :class="{'donut-opacity': true, 'donut-behind': (i !== hoveredIndex && hoveredIndex !== null) || isFixed}">
504+
<g v-for="(datapoint, i ) in drawableDataset" :data-cy="`donut-wrapper-${i}`" :class="{'donut-opacity': true, 'donut-behind': (i !== hoveredIndex && hoveredIndex !== null) || isFixed}">
510505
<g v-if="datapoint.subtotal">
511506
<g v-if="hoveredIndex !== null && hoveredIndex === i">
512507
<g v-for="arc in datapoint.donut">
@@ -594,6 +589,7 @@ defineExpose({
594589
/>
595590
<rect
596591
v-for="(datapoint, i) in drawableDataset"
592+
:data-cy="`trap-${i}`"
597593
:x="padding.left + (i * slit)"
598594
:y="padding.top"
599595
:width="slit"
@@ -637,6 +633,7 @@ defineExpose({
637633
stroke-width="1.5"
638634
/>
639635
<circle
636+
data-cy="quit-dialog"
640637
@click="unfixDatapoint"
641638
@keypress.enter="unfixDatapoint"
642639
:cx="svg.absoluteWidth - padding.right - svg.width / 40"

src/lib.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -574,7 +574,7 @@ export function calcPercentageTrend(arr) {
574574
}
575575

576576
const percentageTrend = (overallChange / totalMagnitude);
577-
return percentageTrend;
577+
return isNaN(percentageTrend) ? 0 : percentageTrend;
578578
}
579579

580580
export function calcMedian(arr) {
@@ -695,8 +695,8 @@ const lib = {
695695
calcLinearProgression,
696696
calcMarkerOffsetX,
697697
calcMarkerOffsetY,
698-
calcNutArrowPath,
699698
calcMedian,
699+
calcNutArrowPath,
700700
canShowValue,
701701
checkArray,
702702
checkNaN,

0 commit comments

Comments
 (0)