Refactor cypress checkbox tests

Fix cypress circle tests

Fix cypress tests
This commit is contained in:
Daniel Egger 2023-06-21 13:30:07 +02:00
parent b86057ec03
commit e6a5af56a8
5 changed files with 67 additions and 35 deletions

View File

@ -31,12 +31,14 @@ const input = (e: Event) => {
:class="{
'opacity-50': disabled,
'cursor-not-allowed': disabled,
'cy-checked': checkboxItem.checked,
'cy-unchecked': !checkboxItem.checked,
}"
:data-cy="`it-checkbox-${checkboxItem.value}`"
class="inline-flex cursor-pointer"
:data-cy="`it-checkbox-clicktarget-${checkboxItem.value}`"
>
<label
class="cy-checkbox cy-checkbox-checked block flex h-8 items-center bg-contain bg-no-repeat pl-8 disabled:opacity-50"
class="flex h-8 items-center bg-contain bg-no-repeat pl-8 disabled:opacity-50"
:class="
checkboxItem.checked
? 'bg-[url(/static/icons/icon-checkbox-checked.svg)] hover:bg-[url(/static/icons/icon-checkbox-checked-hover.svg)]'
@ -50,9 +52,9 @@ const input = (e: Event) => {
:checked="checkboxItem.checked"
:value="checkboxItem.value"
:disabled="disabled"
:data-cy="`it-checkbox-${checkboxItem.value}-checkbox`"
class="sr-only"
type="checkbox"
:data-cy="`it-checkbox-${checkboxItem.value}`"
@keydown="keydown"
@input="input"
/>

View File

@ -45,9 +45,13 @@ describe("assignmentStudent.cy.js", () => {
"Teilaufgabe 1: Beispiel einer Versicherungspolice finden"
);
// Click confirmation
cy.get('[data-cy="it-checkbox-clicktarget-confirmation-1"]').click();
cy.get('[data-cy="it-checkbox-confirmation-1"]').click();
cy.reload();
cy.get('[data-cy="it-checkbox-confirmation-1"]').should("be.checked");
cy.get('[data-cy="it-checkbox-confirmation-1"]').should(
"have.class",
"cy-checked"
);
});
it("can save text", () => {

View File

@ -16,18 +16,22 @@ describe("circle.cy.js", () => {
cy.get('[data-cy="circle-title"]').should("contain", "Fahrzeug");
cy.get(
'[data-cy="test-lehrgang-lp-circle-fahrzeug-lc-handlungsfeld-fahrzeug-checkbox"] > .cy-checkbox'
'[data-cy="test-lehrgang-lp-circle-fahrzeug-lc-handlungsfeld-fahrzeug-checkbox"]'
).should("have.class", "cy-unchecked");
cy.get(
'[data-cy="test-lehrgang-lp-circle-fahrzeug-lc-handlungsfeld-fahrzeug-checkbox"]'
).click();
cy.get(
'[data-cy="test-lehrgang-lp-circle-fahrzeug-lc-handlungsfeld-fahrzeug-checkbox"] > .cy-checkbox-checked'
).should("have.class", "cy-checkbox-checked");
'[data-cy="test-lehrgang-lp-circle-fahrzeug-lc-handlungsfeld-fahrzeug-checkbox"]'
).should("have.class", "cy-checked");
// completion data should still be there after reload
cy.reload();
cy.get(
'[data-cy="test-lehrgang-lp-circle-fahrzeug-lc-handlungsfeld-fahrzeug-checkbox"] > .cy-checkbox-checked'
).should("have.class", "cy-checkbox-checked");
'[data-cy="test-lehrgang-lp-circle-fahrzeug-lc-handlungsfeld-fahrzeug-checkbox"]'
).should("have.class", "cy-checked");
});
it("can open learning contents and complete them by continuing", () => {
@ -48,11 +52,11 @@ describe("circle.cy.js", () => {
cy.get('[data-cy="complete-and-continue"]').click({ force: true });
cy.get(
'[data-cy="test-lehrgang-lp-circle-fahrzeug-lc-verschaffe-dir-einen-überblick-checkbox"] > .cy-checkbox-checked'
).should("have.class", "cy-checkbox-checked");
'[data-cy="test-lehrgang-lp-circle-fahrzeug-lc-verschaffe-dir-einen-überblick-checkbox"]'
).should("have.class", "cy-checked");
cy.get(
'[data-cy="test-lehrgang-lp-circle-fahrzeug-lc-handlungsfeld-fahrzeug-checkbox"] > .cy-checkbox-checked'
).should("have.class", "cy-checkbox-checked");
'[data-cy="test-lehrgang-lp-circle-fahrzeug-lc-handlungsfeld-fahrzeug-checkbox"]'
).should("have.class", "cy-checked");
});
it("continue button works", () => {

View File

@ -41,7 +41,7 @@ describe("learningPath.cy.js", () => {
// mark a learning content in second circle
cy.get('[data-cy="circle-Reisen"]').click({ force: true });
cy.get(
'[data-cy="test-lehrgang-lp-circle-reisen-lc-fachcheck-reisen-checkbox"] > .cy-checkbox'
'[data-cy="test-lehrgang-lp-circle-reisen-lc-fachcheck-reisen-checkbox"]'
).click();
cy.get('[data-cy="back-to-learning-path-button"]').click();

View File

@ -93,31 +93,53 @@ describe("email notification settings", () => {
it("can update email notification settings", () => {
login("admin", "test");
cy.visit("/settings");
cy.wait(2000);
// Checking prerequisites
cy.get('[data-cy="it-checkbox-USER_INTERACTION"]').should("not.be.checked");
cy.get('[data-cy="it-checkbox-INFORMATION"]').should("not.be.checked");
cy.get('[data-cy="it-checkbox-PROGRESS"]').should("not.be.checked");
cy.get('[data-cy="it-checkbox-USER_INTERACTION"]').should(
"have.class",
"cy-unchecked"
);
cy.get('[data-cy="it-checkbox-INFORMATION"]').should(
"have.class",
"cy-unchecked"
);
cy.get('[data-cy="it-checkbox-PROGRESS"]').should(
"have.class",
"cy-unchecked"
);
cy.get('[data-cy="it-checkbox-clicktarget-INFORMATION"]').click();
cy.get('[data-cy="it-checkbox-INFORMATION"]').should("be.checked");
cy.wait(400);
cy.get('[data-cy="it-checkbox-USER_INTERACTION"]').click();
cy.get('[data-cy="it-checkbox-INFORMATION"]').click();
cy.visit("/settings");
cy.wait(1000);
cy.get('[data-cy="it-checkbox-USER_INTERACTION"]').should("not.be.checked");
cy.get('[data-cy="it-checkbox-INFORMATION"]').should("be.checked");
cy.get('[data-cy="it-checkbox-PROGRESS"]').should("not.be.checked");
cy.reload();
cy.get('[data-cy="it-checkbox-USER_INTERACTION"]').should(
"have.class",
"cy-checked"
);
cy.get('[data-cy="it-checkbox-INFORMATION"]').should(
"have.class",
"cy-checked"
);
cy.get('[data-cy="it-checkbox-PROGRESS"]').should(
"have.class",
"cy-unchecked"
);
cy.get('[data-cy="it-checkbox-clicktarget-INFORMATION"]').click();
cy.get('[data-cy="it-checkbox-INFORMATION"]').should("not.be.checked");
cy.wait(400);
cy.get('[data-cy="it-checkbox-USER_INTERACTION"]').click();
cy.get('[data-cy="it-checkbox-INFORMATION"]').click();
cy.visit("/settings");
cy.wait(1000);
cy.get('[data-cy="it-checkbox-USER_INTERACTION"]').should("not.be.checked");
cy.get('[data-cy="it-checkbox-INFORMATION"]').should("not.be.checked");
cy.get('[data-cy="it-checkbox-PROGRESS"]').should("not.be.checked");
cy.reload();
cy.get('[data-cy="it-checkbox-USER_INTERACTION"]').should(
"have.class",
"cy-unchecked"
);
cy.get('[data-cy="it-checkbox-INFORMATION"]').should(
"have.class",
"cy-unchecked"
);
cy.get('[data-cy="it-checkbox-PROGRESS"]').should(
"have.class",
"cy-unchecked"
);
});
});