Skip to content

Commit 06eaa57

Browse files
authored
Merge pull request #5549 from Countly/QT-225
[QT-225] Verify that the Community Edition screens that includes data, can be opened as error-free - VOL 3
2 parents ec8881f + 943076a commit 06eaa57

File tree

13 files changed

+1175
-279
lines changed

13 files changed

+1175
-279
lines changed

frontend/express/public/core/events/javascripts/countly.overview.views.js

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -151,7 +151,12 @@
151151
},
152152
change: {
153153
type: String
154-
}
154+
},
155+
testId: {
156+
type: String,
157+
default: 'events-breakdown-horizontal-tile-test-id',
158+
required: false
159+
},
155160
},
156161
template: '<div class="cly-events-breakdown-horizontal-tile bu-column">\
157162
<div class="cly-events-breakdown-horizontal-tile__wrapper">\
@@ -165,8 +170,8 @@
165170
<div class="bu-level-left">\
166171
<div class="bu-level-item">\
167172
<slot name="countValue"></slot>\
168-
<span v-if="trend === \'u\'" class="cly-events-breakdown-horizontal-tile__trend cly-trend-up bu-pl-2"><i class="cly-trend-up-icon ion-android-arrow-up"></i>{{change}}</span>\
169-
<span v-else class="cly-events-breakdown-horizontal-tile__trend cly-trend-down bu-pl-2"><i class="cly-trend-down-icon ion-android-arrow-down"></i>{{change}}</span>\
173+
<span v-if="trend === \'u\'" class="cly-events-breakdown-horizontal-tile__trend cly-trend-up bu-pl-2" :data-test-id="testId + \'-trend-value-label\'"><i class="cly-trend-up-icon ion-android-arrow-up" :data-test-id="testId + \'-trend-icon\'"></i>{{change}}</span>\
174+
<span v-else class="cly-events-breakdown-horizontal-tile__trend cly-trend-down bu-pl-2" :data-test-id="testId + \'-trend-value-label\'"><i class="cly-trend-down-icon ion-android-arrow-down" :data-test-id="testId + \'-trend-icon\'"></i>{{change}}</span>\
170175
</div>\
171176
</div>\
172177
<slot name="totalPercentage">\
@@ -187,7 +192,12 @@
187192
},
188193
change: {
189194
type: String
190-
}
195+
},
196+
testId: {
197+
type: String,
198+
default: 'events-breakdown-horizontal-tile-test-id',
199+
required: false
200+
},
191201
},
192202
template: '<div class="cly-monitor-events-breakdown-horizontal-tile bu-column bu-is-6">\
193203
<div class="cly-monitor-events-breakdown-horizontal-tile__wrapper">\
@@ -201,8 +211,8 @@
201211
<div class="bu-level-left">\
202212
<div class="bu-level-item">\
203213
<slot name="countValue"></slot>\
204-
<span v-if="trend === \'u\'" class="cly-trend-up cly-monitor-events-breakdown-horizontal-tile__trend bu-pl-2"><i class="cly-monitor-events-breakdown-horizontal-tile__arrow fas fa-arrow-circle-up"></i>{{change}}</span>\
205-
<span v-else class="cly-trend-down cly-monitor-events-breakdown-horizontal-tile__trend bu-pl-2"><i class="cly-monitor-events-breakdown-horizontal-tile__arrow fas fa-arrow-circle-down"></i>{{change}}</span>\
214+
<span v-if="trend === \'u\'" class="cly-trend-up cly-monitor-events-breakdown-horizontal-tile__trend bu-pl-2" :data-test-id="testId + \'-trend-value-label\'"><i class="cly-monitor-events-breakdown-horizontal-tile__arrow fas fa-arrow-circle-up" :data-test-id="testId + \'-trend-icon\'"></i>{{change}}</span>\
215+
<span v-else class="cly-trend-down cly-monitor-events-breakdown-horizontal-tile__trend bu-pl-2" :data-test-id="testId + \'-trend-value-label\'"><i class="cly-monitor-events-breakdown-horizontal-tile__arrow fas fa-arrow-circle-down" :data-test-id="testId + \'-trend-icon\'"></i>{{change}}</span>\
206216
</div>\
207217
</div>\
208218
</div>\

frontend/express/public/core/events/templates/allEvents.html

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@
1313
<div class="bu-columns bu-is-gapless">
1414
<div class="bu-column white-bg bu-is-3 bu-mr-5" style="max-height:681px">
1515
<cly-listbox
16+
test-id="all-events"
1617
skin="jumbo"
1718
height="624"
1819
:searchPlaceholder="searchPlaceholder"
@@ -30,19 +31,20 @@
3031
<cly-notification v-if="item.show" class="bu-mb-5 cly-vue-events-all__alerts" :text="item.message" color="light-warning">
3132
</cly-notification>
3233
</div>
33-
<div class="cly-vue-events-all" v-if="!groupData.isGroup">
34+
<div class="cly-vue-events-all" v-if="!groupData.isGroup" data-test-id="event-title">
3435
{{decode(selectedEventName)}}<span v-if="category!=''" class="cly-vue-events-group bu-ml-4">{{decode(category)}}</span>
3536
</div>
36-
<div class="cly-vue-events-all" v-else>
37+
<div class="cly-vue-events-all" v-else data-test-id="event-title">
3738
{{decode(groupData.name)}}<span class="cly-vue-events-group bu-ml-4">{{i18n('events.all.group')}}</span>
3839
</div>
3940
<div class="cly-vue-events-all__subheading bu-pt-3" v-if="groupData.isGroup && groupData.description" >{{unescapeHtml(groupData.description)}}</div>
4041
<div class="cly-vue-events-all__subheading bu-pt-3" v-if="!groupData.isGroup && eventDescription" >{{unescapeHtml(eventDescription)}}</div>
4142
<div class="bu-is-flex cly-vue-events-all--padding">
4243
<div class="bu-is-align-items-center bu-is-flex" v-if="hasSegments || hasOmittedSegments">
43-
<span class="bu-is-flex cly-vue-events-all-placeholder-text bu-pr-2">{{i18n('events.all.segmentation')}}</span>
44+
<span class="bu-is-flex cly-vue-events-all-placeholder-text bu-pr-2" data-test-id="segmentation-by-label">{{i18n('events.all.segmentation')}}</span>
4445
<cly-select-x
4546
:search-placeholder="i18n('events.all.segmentation-search.placeholder')"
47+
test-id="segmentation-select"
4648
:options="availableSegments"
4749
:searchable="true"
4850
v-model="selectedSegment"
@@ -59,9 +61,9 @@
5961
</div>
6062
<div class="color-cool-gray-100 font-weight-normal text-medium bu-pt-4" v-if="segmentDescription!=''" >{{unescapeHtml(segmentDescription)}}</div>
6163
<cly-section class="bu-mt-5 bu-mr-5">
62-
<cly-chart-bar v-if="currentActiveSegmentation !== 'segment'" :option="barData" :legend="lineLegend" :force-loading="isChartLoading" v-loading="isChartLoading">
64+
<cly-chart-bar test-id="all-events-chart-bar" v-if="currentActiveSegmentation !== 'segment'" :option="barData" :legend="lineLegend" :force-loading="isChartLoading" v-loading="isChartLoading">
6365
</cly-chart-bar>
64-
<cly-chart-time v-else :option="chartData" :legend="lineLegend" :force-loading="isChartLoading" v-loading="isChartLoading" :category="graphNotesCategory"></cly-chart-time>
66+
<cly-chart-time test-id="all-events-chart-time" v-else :option="chartData" :legend="lineLegend" :force-loading="isChartLoading" v-loading="isChartLoading" :category="graphNotesCategory"></cly-chart-time>
6567
</cly-section>
6668
<cly-section class="bu-mt-5 bu-mr-5">
6769
<detail-tables></detail-tables>
Lines changed: 57 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -1,58 +1,58 @@
11
<div v-bind:class="[componentId]">
2-
<cly-datatable-n :rows="eventsTableRows" :force-loading="isTableLoading" :exportFormat="formatExportTable">
3-
<template v-slot:header-left="selectScope">
4-
</template>
5-
<template v-slot="scope">
6-
<el-table-column v-if="selectedSegment !== 'segment'" sortable :sort-method="customSortSegments" prop="curr_segment" :label="i18n('events.table.segmentation')">
7-
<template v-slot="rowScope">
8-
<div class="has-ellipsis">
9-
{{rowScope.row.curr_segment}}
10-
</div>
11-
</template>
12-
</el-table-column>
13-
<el-table-column v-else sortable="true" column-key="date" prop="dateVal" :sort-method="customSortSegments" :label="i18n('common.date')">
14-
<template
15-
date v-slot="rowScope">
16-
<div>
17-
{{rowScope.row.date}}
18-
</div>
19-
</template>
20-
</el-table-column>
21-
<el-table-column v-if="isColumnAllowed('count')" sortable="true" prop="c" :label="labels.count">
22-
<template v-slot="rowScope">
23-
<div>
24-
{{formatNumber(rowScope.row.c)}}
25-
</div>
26-
</template>
27-
</el-table-column>
28-
<el-table-column v-if="isColumnAllowed('sum')" sortable="true" prop="s" :label="labels.sum">
29-
<template v-slot="rowScope">
30-
<div>
31-
{{formatNumber(rowScope.row.s)}}
32-
</div>
33-
</template>
34-
</el-table-column>
35-
<el-table-column v-if="isColumnAllowed('dur')" sortable="true" prop="dur" :label="labels.dur">
36-
<template v-slot="rowScope">
37-
<div>
38-
{{formatDurNumber(rowScope.row.dur)}}
39-
</div>
40-
</template>
41-
</el-table-column>
42-
<el-table-column v-if="isColumnAllowed('AvgSum')" sortable="true" prop="avgSum" :label="i18n('events.table.avg-sum')">
43-
<template v-slot="rowScope">
44-
<div>
45-
{{formatNumber(rowScope.row.avgSum)}}
46-
</div>
47-
</template>
48-
</el-table-column>
49-
<el-table-column v-if="isColumnAllowed('AvgDur')" sortable="true" prop="avgDur" :label="i18n('events.table.avg-dur')">
50-
<template v-slot="rowScope">
51-
<div>
52-
{{formatDurNumber(rowScope.row.avgDur)}}
53-
</div>
54-
</template>
55-
</el-table-column>
56-
</template>
57-
</cly-datatable-n>
58-
</div>
2+
<cly-datatable-n test-id="all-events-datatable" :rows="eventsTableRows" :force-loading="isTableLoading" :exportFormat="formatExportTable">
3+
<template v-slot:header-left="selectScope">
4+
</template>
5+
<template v-slot="scope">
6+
<el-table-column v-if="selectedSegment !== 'segment'" sortable :sort-method="customSortSegments" prop="curr_segment" :label="i18n('events.table.segmentation')">
7+
<template v-slot="rowScope">
8+
<div class="has-ellipsis" :data-test-id="'datatable-all-events-segment-' + rowScope.$index">
9+
{{rowScope.row.curr_segment}}
10+
</div>
11+
</template>
12+
</el-table-column>
13+
<el-table-column v-else sortable="true" column-key="date" prop="dateVal" :sort-method="customSortSegments" :label="i18n('common.date')">
14+
<template
15+
date v-slot="rowScope">
16+
<div :data-test-id="'datatable-all-events-date-' + rowScope.$index">
17+
{{rowScope.row.date}}
18+
</div>
19+
</template>
20+
</el-table-column>
21+
<el-table-column v-if="isColumnAllowed('count')" sortable="true" prop="c" :label="labels.count">
22+
<template v-slot="rowScope">
23+
<div :data-test-id="'datatable-all-events-count-' + rowScope.$index">
24+
{{formatNumber(rowScope.row.c)}}
25+
</div>
26+
</template>
27+
</el-table-column>
28+
<el-table-column v-if="isColumnAllowed('sum')" sortable="true" prop="s" :label="labels.sum">
29+
<template v-slot="rowScope">
30+
<div :data-test-id="'datatable-all-events-sum-' + rowScope.$index">
31+
{{formatNumber(rowScope.row.s)}}
32+
</div>
33+
</template>
34+
</el-table-column>
35+
<el-table-column v-if="isColumnAllowed('dur')" sortable="true" prop="dur" :label="labels.dur">
36+
<template v-slot="rowScope">
37+
<div :data-test-id="'datatable-all-events-dur-' + rowScope.$index">
38+
{{formatDurNumber(rowScope.row.dur)}}
39+
</div>
40+
</template>
41+
</el-table-column>
42+
<el-table-column v-if="isColumnAllowed('AvgSum')" sortable="true" prop="avgSum" :label="i18n('events.table.avg-sum')">
43+
<template v-slot="rowScope">
44+
<div :data-test-id="'datatable-all-events-avg-sum-' + rowScope.$index">
45+
{{formatNumber(rowScope.row.avgSum)}}
46+
</div>
47+
</template>
48+
</el-table-column>
49+
<el-table-column v-if="isColumnAllowed('AvgDur')" sortable="true" prop="avgDur" :label="i18n('events.table.avg-dur')">
50+
<template v-slot="rowScope">
51+
<div :data-test-id="'datatable-all-events-avg-dur-' + rowScope.$index">
52+
{{formatDurNumber(rowScope.row.avgDur)}}
53+
</div>
54+
</template>
55+
</el-table-column>
56+
</template>
57+
</cly-datatable-n>
58+
</div>

0 commit comments

Comments
 (0)