ramon
/
vbv
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add cypress tests which check contents of learning path and circle page

This commit is contained in:
Daniel Egger 2023-10-15 21:41:37 +02:00
parent dd24186fd5
commit 4d3b46de59
5 changed files with 50 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
client/src/pages/learningPath/circlePage/LearningSequence.vue
View File

@ -132,7 +132,11 @@ function checkboxIconUncheckedTailwindClass(lc: LearningContent) {
</script>
<template>
<div :id="learningSequence.slug" class="learning-sequence mb-8">
<div
:id="learningSequence.slug"
class="learning-sequence mb-8"
data-cy="lp-learning-sequence"
>
<div class="mb-2 flex items-center gap-4 text-blue-900">
<component :is="learningSequence.icon" v-if="showIcon(learningSequence.icon)" />
<h3 class="text-large font-semibold">
@ -146,6 +150,7 @@ function checkboxIconUncheckedTailwindClass(lc: LearningContent) {
<ol class="border bg-white px-4 lg:px-6" :class="learningSequenceBorderClass">
<li
v-for="learningUnit in learningSequence.learning_units"
data-cy="lp-learning-unit"
:id="learningUnit.slug"
:key="learningUnit.id"
class="pt-3 lg:pt-6"
@ -165,6 +170,7 @@ function checkboxIconUncheckedTailwindClass(lc: LearningContent) {
<li
v-for="learningContent in learningUnit.learning_contents"
:key="learningContent.id"
data-cy="lp-learning-content"
>
<div class="pb-6">
<div class="flex items-center gap-4">

2
client/src/pages/learningPath/learningPathPage/LearningPathCircleColumn.vue
View File

@ -46,7 +46,7 @@ watch(
<router-link
:to="overrideCircleUrl ? overrideCircleUrl : props.circle.frontend_url"
:data-cy="`circle-${props.circle.title}`"
class="flex flex-col items-center pb-6"
class="cy-lp-circle flex flex-col items-center pb-6"
>
<div ref="circleElement" class="flex flex-row items-center pb-2">
<div class="w-12">

1
client/src/pages/learningPath/learningPathPage/LearningPathPathView.vue
View File

@ -55,6 +55,7 @@ const scrollLearnPathDiagram = (offset: number) => {
<p
:id="`topic-${topic.slug}`"
class="inline-block h-12 self-start px-4 font-bold text-gray-800"
data-cy="lp-topic"
>
{{ topic.title }}
</p>

31
cypress/e2e/circle.cy.js
View File

@ -87,4 +87,35 @@ describe("circle.cy.js", () => {
cy.get('[data-cy="close-learning-content"]').click();
cy.get('[data-cy="circle-title"]').should("contain", "Fahrzeug");
});
it("checks number of sequences and contents", () => {
cy.get('[data-cy="lp-learning-sequence"]').should("have.length", 3);
cy.get('[data-cy="lp-learning-sequence"]')
.first()
.should("contain", "Vorbereitung");
cy.get('[data-cy="lp-learning-sequence"]')
.eq(1)
.should("contain", "Training");
cy.get('[data-cy="lp-learning-sequence"]')
.last()
.should("contain", "Transfer");
cy.get('[data-cy="lp-learning-content"]').should("have.length", 10);
cy.get('[data-cy="lp-learning-content"]')
.first()
.should("contain", "Verschaffe dir einen Überblick");
cy.get('[data-cy="lp-learning-content"]')
.eq(4)
.should("contain", "Präsenzkurs Fahrzeug");
cy.get('[data-cy="lp-learning-content"]')
.eq(7)
.should("contain", "Reflexion");
cy.get('[data-cy="lp-learning-content"]')
.last()
.should("contain", "Feedback");
cy.visit("/course/test-lehrgang/learn/reisen");
cy.get('[data-cy="lp-learning-sequence"]').should("have.length", 3);
cy.get('[data-cy="lp-learning-content"]').should("have.length", 7);
});
});

10
cypress/e2e/learningPath.cy.js
View File

@ -52,4 +52,14 @@ describe("learningPath.cy.js", () => {
.click();
cy.get('[data-cy="circle-title"]').should("contain", "Reisen");
});
it("checks contents", () => {
cy.get('[data-cy="lp-topic"]').should("have.length", 2);
cy.get('[data-cy="lp-topic"]').first().should("contain", "Circle ÜK");
cy.get('[data-cy="lp-topic"]').eq(1).should("contain", "Circle VV");
cy.get(".cy-lp-circle").should("have.length", 2);
cy.get(".cy-lp-circle").first().should("contain", "Fahrzeug");
cy.get(".cy-lp-circle").eq(1).should("contain", "Reisen");
});
});