Skip to content

Commit bfd07fa

Browse files
jo-elimujo-elimu
committed
test: add ui test for /analytics/students/<id>
#2191
1 parent 27de084 commit bfd07fa

27 files changed

+289
-14
lines changed

‎src/main/java/ai/elimu/web/analytics/students/StudentController.java

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,19 @@
11
package ai.elimu.web.analytics.students;
22

33
import ai.elimu.dao.LetterSoundAssessmentEventDao;
4+
import ai.elimu.dao.LetterSoundLearningEventDao;
45
import ai.elimu.dao.StoryBookLearningEventDao;
56
import ai.elimu.dao.StudentDao;
67
import ai.elimu.dao.VideoLearningEventDao;
78
import ai.elimu.dao.WordLearningEventDao;
89
import ai.elimu.entity.analytics.LetterSoundAssessmentEvent;
10+
import ai.elimu.entity.analytics.LetterSoundLearningEvent;
911
import ai.elimu.entity.analytics.StoryBookLearningEvent;
1012
import ai.elimu.entity.analytics.VideoLearningEvent;
1113
import ai.elimu.entity.analytics.WordLearningEvent;
1214
import ai.elimu.entity.analytics.students.Student;
15+
import ai.elimu.model.v2.enums.content.LiteracySkill;
16+
import ai.elimu.model.v2.enums.content.NumeracySkill;
1317
import ai.elimu.util.AnalyticsHelper;
1418
import lombok.RequiredArgsConstructor;
1519
import lombok.extern.slf4j.Slf4j;
@@ -36,6 +40,7 @@ public class StudentController {
3640
private final StudentDao studentDao;
3741

3842
private final LetterSoundAssessmentEventDao letterSoundAssessmentEventDao;
43+
private final LetterSoundLearningEventDao letterSoundLearningEventDao;
3944

4045
private final WordLearningEventDao wordLearningEventDao;
4146

@@ -51,9 +56,16 @@ public String handleRequest(@PathVariable Long studentId, Model model) {
5156
log.info("student.getAndroidId(): " + student.getAndroidId());
5257

5358

59+
model.addAttribute("literacySkills", LiteracySkill.values());
60+
model.addAttribute("numeracySkills", NumeracySkill.values());
61+
62+
5463
List<LetterSoundAssessmentEvent> letterSoundAssessmentEvents = letterSoundAssessmentEventDao.readAll();
5564
model.addAttribute("letterSoundAssessmentEvents", letterSoundAssessmentEvents);
5665

66+
List<LetterSoundLearningEvent> letterSoundLearningEvents = letterSoundLearningEventDao.readAll();
67+
model.addAttribute("letterSoundLearningEvents", letterSoundLearningEvents);
68+
5769

5870
// Prepare chart data - WordLearningEvents
5971
List<WordLearningEvent> wordLearningEvents = wordLearningEventDao.readAll();

‎src/main/webapp/WEB-INF/jsp/analytics/students/id.jsp

Lines changed: 156 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,139 @@
11
<content:title>
2-
🎓 Student ${student.id}
2+
🎓 Student #${student.id}
33
</content:title>
44

55
<content:section cssId="studentPage">
6-
<h4><content:gettitle /></h4>
7-
<h5 style="margin-bottom: 1em;"><code>${student.androidId}</code></h5>
6+
<div class="col s7 m5 l4">
7+
<div class="card contributor">
8+
<div class="card-image">
9+
<img src="<spring:url value='/static/img/student-${applicationScope.configProperties["content.language"]}.png' />" />
10+
<span class="card-title">
11+
<content:gettitle />
12+
</span>
13+
</div>
14+
<div class="card-content">
15+
<p class="grey-text">Student ID</p>
16+
#${student.id}<br />
17+
<br />
18+
<p class="grey-text">Android ID</p>
19+
<code>${student.androidId}</code>
20+
</div>
21+
</div>
22+
</div>
23+
<div class="col s5 m7 l8">
24+
<div class="card-panel">
25+
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/chart.umd.min.js"></script>
26+
<canvas id="chart"></canvas>
27+
<script>
28+
var ctx = document.getElementById('chart');
29+
var data = {
30+
labels: ['Letter-sounds', 'Words', 'Numbers', 'Storybooks', 'Videos'],
31+
datasets: [
32+
{
33+
data: [${letterSoundLearningEventsCount}, ${wordLearningEventsCount}, ${numberLearningEventsCount}, ${storyBookLearningEventsCount}, ${videoLearningEventsCount}],
34+
label: 'Learning events',
35+
backgroundColor: 'rgba(149,117,205, 0.5)', // #9575cd deep-purple lighten-2
36+
tension: 0.5
37+
},
38+
{
39+
data: [${lettersoundAssessmentEventsCount}, ${wordAssessmentEventsCount}, ${numberAssessmentEventsCount}, ${storyBookAssessmentEventsCount}, ${videoAssessmentEventsCount}],
40+
label: 'Assessment events',
41+
backgroundColor: 'rgba(77,182,172, 0.5)', // #4db6ac teal lighten-2
42+
tension: 0.5
43+
}
44+
]
45+
};
46+
var options = {};
47+
new Chart(ctx, {
48+
type: 'radar',
49+
data: data,
50+
options: options
51+
});
52+
</script>
53+
</div>
54+
</div>
55+
<div style="clear: both;"></div>
56+
57+
<div class="col s6">
58+
<h5 style="margin-top: 1em;">Literacy skills</h5>
59+
<div class="card-panel">
60+
<table>
61+
<thead>
62+
<th>Skill</th>
63+
<th></th>
64+
<th>Mastery</th>
65+
</thead>
66+
<tbody>
67+
<c:forEach var="literacySkill" items="${literacySkills}">
68+
<tr>
69+
<td>
70+
${literacySkill}
71+
</td>
72+
<td>
73+
0%
74+
</td>
75+
<td>
76+
<div class="progress">
77+
<div class="determinate" style="width: 0%"></div>
78+
</div>
79+
</td>
80+
</tr>
81+
</c:forEach>
82+
</tbody>
83+
</table>
84+
</div>
85+
</div>
86+
<div class="col s6">
87+
<h5 style="margin-top: 1em;">Numeracy skills</h5>
88+
<div class="card-panel">
89+
<table>
90+
<thead>
91+
<th>Skill</th>
92+
<th></th>
93+
<th>Mastery</th>
94+
</thead>
95+
<tbody>
96+
<c:forEach var="numeracySkill" items="${numeracySkills}">
97+
<tr>
98+
<td>
99+
${numeracySkill}
100+
</td>
101+
<td>
102+
0%
103+
</td>
104+
<td>
105+
<div class="progress">
106+
<div class="determinate" style="width: 0%"></div>
107+
</div>
108+
</td>
109+
</tr>
110+
</c:forEach>
111+
</tbody>
112+
</table>
113+
</div>
114+
</div>
115+
<div style="clear: both;"></div>
8116

9-
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/chart.umd.min.js"></script>
117+
<h5 style="margin-top: 1em;">🎼 Letter-sounds</h5>
118+
<div class="card-panel">
119+
<h5>Assessment events (${fn:length(letterSoundAssessmentEvents)})</h5>
120+
...
121+
122+
<div class="divider" style="margin: 2em 0;"></div>
123+
124+
<h5>Learning events (${fn:length(letterSoundLearningEvents)})</h5>
125+
...
126+
</div>
127+
<div style="clear: both;"></div>
10128

129+
<h5 style="margin-top: 1em;">🔤 Words</h5>
11130
<div class="card-panel">
12-
<h5>🔤 Word learning events (${fn:length(wordLearningEvents)})</h5>
13-
131+
<h5>Assessment events (${fn:length(wordAssessmentEvents)})</h5>
132+
...
133+
134+
<div class="divider" style="margin: 2em 0;"></div>
135+
136+
<h5>Learning events (${fn:length(wordLearningEvents)})</h5>
14137
<canvas id="wordChart"></canvas>
15138
<script>
16139
const wordLabels = [
@@ -36,10 +159,28 @@
36159
new Chart(wordCtx, wordConfig);
37160
</script>
38161
</div>
162+
<div style="clear: both;"></div>
39163

164+
<h5 style="margin-top: 1em;">🔢 Numbers</h5>
40165
<div class="card-panel">
41-
<h5>📚 Storybook learning events</h5>
42-
166+
<h5>Assessment events (${fn:length(numberAssessmentEvents)})</h5>
167+
...
168+
169+
<div class="divider" style="margin: 2em 0;"></div>
170+
171+
<h5>Learning events (${fn:length(numberLearningEvents)})</h5>
172+
...
173+
</div>
174+
<div style="clear: both;"></div>
175+
176+
<h5 style="margin-top: 1em;">📚 Storybooks</h5>
177+
<div class="card-panel">
178+
<h5>Assessment events (${fn:length(storyBookAssessmentEvents)})</h5>
179+
...
180+
181+
<div class="divider" style="margin: 2em 0;"></div>
182+
183+
<h5>Learning events (${fn:length(storyBookLearningEvents)})</h5>
43184
<canvas id="storyBookChart"></canvas>
44185
<script>
45186
const storyBookLabels = [
@@ -65,10 +206,16 @@
65206
new Chart(storyBookCtx, storyBookConfig);
66207
</script>
67208
</div>
209+
<div style="clear: both;"></div>
68210

211+
<h5 style="margin-top: 1em;">🎬 Videos</h5>
69212
<div class="card-panel">
70-
<h5>🎬 Video learning events</h5>
213+
<h5>Assessment events (${fn:length(videoAssessmentEvents)})</h5>
214+
...
215+
216+
<div class="divider" style="margin: 2em 0;"></div>
71217

218+
<h5>Learning events (${fn:length(videoLearningEvents)})</h5>
72219
<canvas id="videoChart"></canvas>
73220
<script>
74221
const videoLabels = [

‎src/main/webapp/WEB-INF/jsp/analytics/students/list.jsp

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -21,19 +21,19 @@
2121
</div>
2222
</content:banner>
2323

24-
<content:section cssId="studentsListPage">
24+
<content:section cssId="studentListPage">
2525
<div class="section row">
2626
<table class="bordered highlight">
2727
<thead>
28-
<th>id</th>
29-
<th>android_id</th>
28+
<th>Student ID</th>
29+
<th>Android ID</th>
3030
</thead>
3131
<tbody>
3232
<c:forEach var="student" items="${students}">
3333
<tr class="student">
3434
<td>
35-
<a href="<spring:url value='/analytics/students/${student.id}' />">
36-
🎓 Student ${student.id}
35+
<a class="studentLink" href="<spring:url value='/analytics/students/${student.id}' />">
36+
🎓 Student #${student.id}
3737
</a>
3838
</td>
3939
<td>

‎src/main/webapp/static/img/student-ENG.png

684 KB
Loading

‎src/main/webapp/static/img/student-HIN.png

407 KB
Loading

‎src/main/webapp/static/img/student-TGL.png

585 KB
Loading

‎src/main/webapp/static/img/student-THA.png

709 KB
Loading

‎src/main/webapp/static/img/student-VIE.png

577 KB
Loading

‎src/test/java/selenium/WelcomePageTest.java

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@ public void setUp() {
3131
driver = new ChromeDriver(chromeOptions);
3232

3333
driver.get(DomainHelper.getBaseUrl());
34+
log.info("driver.getCurrentUrl(): " + driver.getCurrentUrl());
3435
}
3536

3637
@AfterEach

‎src/test/java/selenium/analytics/MainAnalyticsPageTest.java

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@ public void setUp() {
3131
driver = new ChromeDriver(chromeOptions);
3232

3333
driver.get(DomainHelper.getBaseUrl() + "/analytics");
34+
log.info("driver.getCurrentUrl(): " + driver.getCurrentUrl());
3435
}
3536

3637
@AfterEach

0 commit comments

Comments
 (0)