Add Cypress test for checkout process

This commit is contained in:
Daniel Egger 2024-06-20 14:05:49 +02:00
parent 2fe182b3be
commit da5c6d07d2
11 changed files with 154 additions and 16 deletions

View File

@ -24,7 +24,9 @@ const user = useUserStore();
<p class="mb-4">
{{ $t("start.vvDescription") }}
</p>
<a href="/start/vv" class="btn-primary">{{ $t("a.Mehr erfahren") }}</a>
<a href="/start/vv" class="btn-primary" data-cy="start-vv">
{{ $t("a.Mehr erfahren") }}
</a>
</div>
<div>
@ -39,6 +41,7 @@ const user = useUserStore();
<router-link
:to="{ name: 'accountProfile', params: { courseType: 'uk' } }"
class="btn-primary"
data-cy="start-uk"
>
{{ $t("a.Jetzt mit Lehrgang starten") }}
</router-link>

View File

@ -9,7 +9,9 @@ const userStore = useUserStore();
<template>
<WizardPage :step="0.5">
<template #content>
<h2 class="my-10">{{ $t("a.Konto erstellen") }}</h2>
<h2 class="my-10" data-cy="account-confirm-title">
{{ $t("a.Konto erstellen") }}
</h2>
<InfoBox color="text-green-500" icon="it-icon-check">
<template #content>
<p class="text-lg font-bold">
@ -27,7 +29,11 @@ const userStore = useUserStore();
</template>
<template #footer>
<router-link :to="{ name: 'accountProfile' }" class="btn-blue flex items-center">
<router-link
:to="{ name: 'accountProfile' }"
class="btn-blue flex items-center"
data-cy="continue-button"
>
{{ $t("general.next") }}
<it-icon-arrow-right class="it-icon ml-2 h-6 w-6" />
</router-link>

View File

@ -70,7 +70,9 @@ const nextRoute = computed(() => {
<template>
<WizardPage :step="1">
<template #content>
<h2 class="my-10">{{ $t("a.Profil ergänzen") }}</h2>
<h2 class="my-10" data-cy="account-profile-title">
{{ $t("a.Profil ergänzen") }}
</h2>
<h3 class="mb-3">{{ $t("a.Gesellschaft") }}</h3>
@ -120,6 +122,7 @@ const nextRoute = computed(() => {
:disabled="!validOrganisation"
class="btn-blue flex items-center"
role="link"
data-cy="continue-button"
@click="navigate"
>
{{ $t("general.next") }}

View File

@ -180,7 +180,9 @@ const executePayment = async () => {
<template>
<WizardPage :step="2">
<template #content>
<h2 class="my-10">{{ $t("a.Lehrgang kaufen") }}</h2>
<h2 class="my-10" data-cy="account-checkout-title">
{{ $t("a.Lehrgang kaufen") }}
</h2>
<p class="mb-4">
<i18next
:translation="$t('a.Der Preis für den Lehrgang {course} beträgt {price}.')"
@ -234,6 +236,7 @@ const executePayment = async () => {
<button
v-if="!useCompanyAddress"
class="underline"
data-cy="add-company-address"
@click="setUseCompanyAddress(true)"
>
<template v-if="userOrganisationName">
@ -285,7 +288,7 @@ const executePayment = async () => {
<it-icon-arrow-left class="it-icon mr-2 h-6 w-6" />
{{ $t("general.back") }}
</router-link>
<button class="btn-blue flex items-center" @click="executePayment">
<button class="btn-blue flex items-center" data-cy="continue-pay" @click="executePayment">
{{ $t("a.Mit Kreditkarte bezahlen") }}
<it-icon-arrow-right class="it-icon ml-2 h-6 w-6" />
</button>

View File

@ -6,7 +6,7 @@ const user = useUserStore();
<template>
<div class="flex flex-grow flex-col items-center gap-y-8 p-16">
<h1 class="my-10">{{ $t("a.Gratuliere!") }}</h1>
<h1 class="my-10" data-cy="checkout-success-title">{{ $t("a.Gratuliere!") }}</h1>
<svg
xmlns="http://www.w3.org/2000/svg"
width="472"
@ -43,7 +43,7 @@ const user = useUserStore();
</template>
</i18next>
</p>
<router-link to="/" class="btn-blue flex items-center">
<router-link to="/" class="btn-blue flex items-center" data-cy="start-vv-button">
{{ $t("a.Jetzt mit Lehrgang starten") }}
</router-link>
</div>

View File

@ -1,8 +1,16 @@
// ids for cypress test data
export const ADMIN_USER_ID = "872efd96-3bd7-4a1e-a239-2d72cad9f604";
export const TEST_TRAINER1_USER_ID = "b9e71f59-c44f-4290-b93a-9b3151e9a2fc";
export const TEST_STUDENT1_USER_ID = "65c73ad0-6d53-43a9-a4a4-64143f27b03a";
export const TEST_STUDENT2_USER_ID = "19c40d94-15cc-4198-aaad-ef707c4b0900";
export const ADMIN_USER_ID = "872efd96-3bd7-4a1e-a239-2d72cad9f604"
export const TEST_SUPERVISOR1_USER_ID = "a9a8b741-f115-4521-af2d-7dfef673b8c5"
export const TEST_TRAINER1_USER_ID = "b9e71f59-c44f-4290-b93a-9b3151e9a2fc"
export const TEST_TRAINER2_USER_ID = "299941ae-1e4b-4f45-8180-876c3ad340b4"
export const TEST_STUDENT1_USER_ID = "65c73ad0-6d53-43a9-a4a4-64143f27b03a"
export const TEST_STUDENT2_USER_ID = "19c40d94-15cc-4198-aaad-ef707c4b0900"
export const TEST_STUDENT3_USER_ID = "bcf94dba-53bc-474b-a22d-e4af39aa042b"
export const TEST_MENTOR1_USER_ID = "d1f5f5a9-5b0a-4e1a-9e1a-9e9b5b5e1b1b"
export const TEST_STUDENT1_VV_USER_ID = "5ff59857-8de5-415e-a387-4449f9a0337a"
export const TEST_STUDENT2_VV_AND_VV_MENTOR_USER_ID = "7e8ebf0b-e6e2-4022-88f4-6e663ba0a9db"
export const TEST_USER_EMPTY_ID = "daecbabe-4ab9-4edf-a71f-4119042ccb02"
export const TEST_COURSE_SESSION_BERN_ID = -1;
export const TEST_COURSE_SESSION_ZURICH_ID = -2;

View File

@ -0,0 +1,97 @@
import { TEST_USER_EMPTY_ID } from "../../consts";
import { login } from "../helpers";
describe("checkout.cy.js", () => {
beforeEach(() => {
cy.manageCommand("cypress_reset");
login("empty@example.com", "test");
cy.visit("/");
});
it("can register and buy Versicherungsvermittlerin with credit card", () => {
cy.get('[data-cy="start-vv"]').click();
// wähle "Deutsch"
cy.get('[href="/onboarding/vv-de/account/create"]').click();
cy.get('[data-cy="account-confirm-title"]').should(
"contain",
"Konto erstellen"
);
cy.get('[data-cy="continue-button"]').click();
cy.get('[data-cy="account-profile-title"]').should(
"contain",
"Profil ergänzen"
);
cy.get('[data-cy="dropdown-select"]').click();
cy.get('[data-cy="dropdown-select-option-Baloise"]').click();
cy.get('[data-cy="continue-button"]').click();
// Adressdaten ausfüllen
cy.get('[data-cy="account-checkout-title"]').should(
"contain",
"Lehrgang kaufen"
);
cy.get("#street-address").type("Eggersmatt");
cy.get("#street-number").type("32");
cy.get("#postal-code").type("1719");
cy.get("#city").type("Zumholz");
cy.get('[data-cy="add-company-address"]').click();
cy.get("#company-name").type("Iterativ GmbH");
cy.get("#company-street-address").type("Brückfeldstrasse");
cy.get("#company-street-number").type("16");
cy.get("#company-postal-code").type("3012");
cy.get("#company-city").type("Bern");
cy.get('[data-cy="continue-pay"]').click();
// check that results are stored on server
cy.loadCheckoutInformation("user_id", TEST_USER_EMPTY_ID).then((ci) => {
expect(ci.first_name).to.equal("Flasche");
expect(ci.last_name).to.equal("Leer");
expect(ci.street).to.equal("Eggersmatt");
expect(ci.street_number).to.equal("32");
expect(ci.postal_code).to.equal("1719");
expect(ci.city).to.equal("Zumholz");
expect(ci.country).to.equal("CH");
expect(ci.invoice_address).to.equal("org");
expect(ci.organisation_detail_name).to.equal("Iterativ GmbH");
expect(ci.organisation_street).to.equal("Brückfeldstrasse");
expect(ci.organisation_street_number).to.equal("16");
expect(ci.organisation_postal_code).to.equal("3012");
expect(ci.organisation_city).to.equal("Bern");
expect(ci.product_name).to.equal("Versicherungsvermittler/-in VBV");
expect(ci.product_name).to.equal("Versicherungsvermittler/-in VBV");
expect(ci.product_price).to.equal(32400);
expect(ci.state).to.equal("ongoing");
});
// pay
cy.get('[data-cy="pay-button"]').click();
cy.get('[data-cy="checkout-success-title"]').should(
"contain",
"Gratuliere"
);
// wait for payment callback
cy.wait(3000);
cy.get('[data-cy="start-vv-button"]').click();
// back on dashboard page
cy.get('[data-cy="db-course-title"]').should(
"contain",
"Versicherungsvermittler"
);
cy.loadCheckoutInformation("user_id", TEST_USER_EMPTY_ID).then((ci) => {
expect(ci.state).to.equal("paid");
});
});
});

View File

@ -133,7 +133,7 @@ Cypress.Commands.add("loadAssignmentCompletion", (key, value) => {
key,
value,
"vbv_lernwelt.assignment.models.AssignmentCompletion",
"vbv_lernwelt.assignment.serializers.AssignmentCompletionSerializer",
"vbv_lernwelt.assignment.serializers.CypressAssignmentCompletionSerializer",
true
);
});
@ -148,6 +148,16 @@ Cypress.Commands.add("loadFeedbackResponse", (key, value) => {
);
});
Cypress.Commands.add("loadCheckoutInformation", (key, value) => {
return loadObjectJson(
key,
value,
"vbv_lernwelt.shop.models.CheckoutInformation",
"vbv_lernwelt.shop.serializers.CypressCheckoutInformationSerializer",
true
);
});
Cypress.Commands.add("makeSelfEvaluation", (answers) => {
for (let i = 0; i < answers.length; i++) {
const answer = answers[i];

View File

@ -3,7 +3,7 @@ from rest_framework import serializers
from vbv_lernwelt.assignment.models import AssignmentCompletion
class AssignmentCompletionSerializer(serializers.ModelSerializer):
class CypressAssignmentCompletionSerializer(serializers.ModelSerializer):
class Meta:
model = AssignmentCompletion
fields = [

View File

@ -88,8 +88,8 @@ def fake_datatrans_pay_view(request, api_url=""):
<label>failed</label>
</div>
<div>
<button type="submit">
Pay with selected Status
<button type="submit" data-cy="pay-button">
Pay with selected status
</button>
</div>
</fieldset>

View File

@ -1 +1,9 @@
from rest_framework import serializers
from vbv_lernwelt.shop.models import CheckoutInformation
class CypressCheckoutInformationSerializer(serializers.ModelSerializer):
class Meta:
model = CheckoutInformation
fields = "__all__"