Why does the cypress recording take too much time? - testing

I'm trying ton record my Test. There you can see below the whole test I'm trying to record.
I only used once it because this is the only way I won't get kicked out of my session while testing, I tried to user a couples of it in my code but it didn't work out, the page redirected me to the log in area after I selected one prodct ("ZBI Wohnwert") and tried to submit with a button for continuing to the next page.
describe('Investment in AIF ZBI Wohnwert 1 Happy Path', function () {
before(function () {
cy.clearLocalStorage();
cy.clearCookies();
});
it('Goes through whole Investment Process', function () {
cy.visit('https://capitalpioneers.de')
cy.contains('Login').click();
cy.get('#email.form-control')
.type(LogConst.TestUserCostumer.usercos);
cy.get('#password.form-control')
.type(LogConst.TestUserCostumer.usercospass);
cy.contains('Anmelden').click();
cy.url()
.should('include', '/investor');
cy.contains('Produkt').click();
cy.url()
.should('include', '/produkte');
cy.contains('ZBI WohnWert1').click();
cy.get('.input-range.js-inv-calc-input-sum-range.js-input-range[type=range]')
.invoke('val', 50000)
.trigger('change');
cy.get('#ga-btn-invest-now-product-detail-zbi-wohnwert1-aif').click();
cy.contains('Fondsprospekt').click();
cy.contains('Wesentlichen Anlegerinformationen').click();
cy.get('#pre_check_inGermany').click({force: true});
cy.get('#pre_check_readDocument1').click({force: true});
cy.get('#pre_check_readDocument2').click({force: true});
//PERSÖNLICHE ANGABEN///
cy.get('form.js-pre-check-form.js-ajax-form').submit().wait(3000);
cy.get('form > .form-group > #user_profile_sex > .radio:nth-child(2) > .required').click();
cy.get('form > .form-group > #user_profile_sex > .radio > #user_profile_sex_1').click({force: true});
cy.get('.form-group > .select2 > .selection > .select2-selection > #select2-user_profile_title-container').click();
cy.get('ul.select2-results__options');
cy.get('li.select2-results__option').first().click();
cy.get('.row > .col-sm-7 > form > .form-group > #user_profile_firstname').click();
cy.get('.row > .col-sm-7 > form > .form-group > #user_profile_firstname').clear().type('Test User Name');
cy.get('.row > .col-sm-7 > form > .form-group > #user_profile_lastname').clear().type('Test User Lastname');
cy.get('.row > .col-sm-7 > form > .form-group > #user_profile_birthname').clear().type('Test Cypress');
cy.get('.select-inline__select > .select2 > .selection > .select2-selection > #select2-user_profile_birthday_day-container').click();
cy.get('input.select2-search__field').type('01');
cy.get('.select-inline__select > .select2 > .selection > .select2-selection > #select2-user_profile_birthday_month-container').click();
cy.get('input.select2-search__field').type('01');
cy.get('.select-inline__select > .select2 > .selection > .select2-selection > #select2-user_profile_birthday_year-container').click();
cy.get('input.select2-search__field').type('1990');
cy.get('#user_profile_birthplace').click().clear().type('Musterstadt');
cy.get('#select2-user_profile_countryOfBirth-container').click();
cy.get('input.select2-search__field').type('Deutschland');
cy.get('li.select2-results__option').click();
cy.get('#user_profile_mobile').click().clear().type('01234569');
//ANSCHRIFT UND WEITERE ANGABEN//
cy.get('#user_profile_street').click().clear().type('Musterstraße');
cy.get('#user_profile_streetNumber').click().clear().type('10000');
cy.get('#user_profile_zipcode').click().clear().type('55555')
cy.get('#user_profile_city').click().clear().type('Musterstadt Aktuell');
cy.get('#select2-user_profile_country-container').click();
cy.get('#select2-user_profile_country-results').contains('Deutschland').click();
cy.get('.form-group > .select2 > .selection > .select2-selection > #select2-user_profile_occupation-container').click()
cy.get('ul.select2-results__options');//.eq('3').click();
cy.get('li.select2-results__option').eq('2').should('contain', 'Angestellter').click();
//BANK DATEN//
cy.get('.row > .col-sm-7 > form > .form-group > #user_profile_iban').click().clear().type(LogConst.TestBankData.UserIBAN);
cy.get('.row > .col-sm-7 > form > .form-group > #user_profile_bic').click().clear().type(LogConst.TestBankData.UserBIC);
cy.get('.row > .col-sm-7 > form > .form-group > #user_profile_bankname').click().clear().type(LogConst.TestBankData.UserBancName);
///PERSONALAUSWEIS ODER REISEPASS
cy.get('form > .form-group > #user_profile_idCardType > .radio:nth-child(1) > .required').click();
cy.get('.row > .col-sm-7 > form > .form-group > #user_profile_idCardNumber').click().clear().type(LogConst.TestUserIdent.IDCardNumber);
cy.get(' #select2-user_profile_idCardValidUntil_day-container').click();
cy.get('input.select2-search__field').type('01');
cy.get('#select2-user_profile_idCardValidUntil_month-container').click();
cy.get('input.select2-search__field').type('01');
cy.get('#select2-user_profile_idCardValidUntil_year-container').click();
cy.get('input.select2-search__field').type('2027');
cy.get('#select2-user_profile_idCardIssueDate_day-container').click();
cy.get('input.select2-search__field').type('02');
cy.get('#select2-user_profile_idCardIssueDate_month-container').click();
cy.get('input.select2-search__field').type('02');
cy.get('#select2-user_profile_idCardIssueDate_year-container').click();
cy.get('input.select2-search__field').type('2016');
cy.get('#user_profile_idCardIssuer').click().clear().type('Stadt der Musterbehörde');
cy.get('#select2-user_profile_nationality-container').click();
cy.get('ul.select2-results__options');
cy.get('li.select2-results__option').first().click();
//STEUERDATEN
cy.get('#user_profile_financialOffice').click().clear().type('Muster Finanzamt');
cy.get('#user_profile_taxId').click().clear().type(LogConst.TestTaxData.UserTaxID);
cy.get('#user_profile_taxNumber').click().clear().type(LogConst.TestTaxData.UserTaxNumber);
cy.get('.button.button.button--yellow.form__submit').click();
//AGM Seite1
//Angaben zu Ihrer Person
cy.get('#select2-user_reasonableness_part1_highestEducation-container').click();
cy.get('ul.select2-results__options');
cy.get('li.select2-results__option').eq('1').should('contain', 'Hochschulabschluss').click();
cy.get('#select2-user_reasonableness_part1_occupationType-container').click();
cy.get('ul.select2-results__options');
cy.get('li.select2-results__option').eq('2').should('contain', 'Kaufmännische(r) Angestellte(r)').click();
cy.get('#select2-user_reasonableness_part1_pastOccupationType-container').click();
cy.get('#select2-user_reasonableness_part1_pastOccupationType-results');
cy.get('li.select2-results__option').eq('4').should('contain', 'sonstige Tätigkeiten').click();
//Ihre Kenntnisse und Erfahrungen
cy.get('#select2-user_reasonableness_part1_experienceInvestingAif-container').click();
cy.get('ul.select2-results__options');
cy.get('li.select2-results__option').eq('2').should('contain', '1 bis 5').click();
cy.get('#select2-user_reasonableness_part1_experiencePropertyValuesAif-container').click();
cy.get('ul.select2-results__options');
cy.get('li.select2-results__option').eq('2').should('contain', '1 - 3 Transaktionen in den letzten 3 Jahren').click();
cy.get('.button.button--yellow.form__submit').click().wait(3000);
cy.get('a.button.button--yellow.form__submit').click();
//GWG Seite
//GWG
cy.get('#user_moneylaundering_confirmation1').click({force:true});
cy.get('#user_moneylaundering_confirmation2').click({force:true});
cy.get('#user_moneylaundering_confirmation3').click({force:true});
//PEP Person
cy.get('#user_moneylaundering_moneyLaunderingPoliticalPerson_0').click({force:true});
// cy.get('.required control-label--text').click({force:true});
cy.get('#user_moneylaundering_moneyLaunderingGermany_0').click({force:true});
// cy.get('.required control-label--text').click({force:true});;
cy.get('#user_moneylaundering_moneyLaunderingAmerican_1').click({force:true});
cy.get('.button.button--yellow.form__submit').click();
cy.get('.input-range.input-range--light.js-inv-calc-input-sum-range.js-input-range[type=range]')
.invoke('val', 50000)
.trigger('change');
cy.get('.button.button--yellow.form__submit').click();
cy.get('#summary_noConsultationConfirmation').click({force:true});
cy.get('#summary_allowInvestmentDataSharing').click({force:true});
cy.get('#summary_readDocumentsConfirmation').click({force:true});
cy.contains('Verkaufsprospekt').click();
cy.contains('Datenschutzerklärung').click();
cy.contains('Wesentliche Anlegerinformationen').click();
cy.contains('Gesetzlichen Pflichtangaben').click();
cy.contains('Allgemeinen Geschäftsbedingungen').click();
cy.contains('Prospektnachtrag Nr. 1 vom 01.12.2016').click();
cy.contains('Prospektnachtrag Nr. 2 vom 01.12.2016').click();
cy.contains('Investitionsinformation').click();
cy.contains('Prospektnachtrag Nr. 3 vom 01.12.2016').click();
// cy.contains('Kaufauftrag ansehen').click();
// cy.get('#ga-btn-preview-contract-zbi-wohnwert1-aif').click();
cy.get('#summary_readDraftContractConfirmation').click({force:true});
cy.get('#summary_signedName').click().clear().type('Test User Name Lastname');
cy.get('#summary_signedCity').click().clear().type('Musterstadt');
cy.get('#ga-btn-buy-now-zbi-wohnwert1-aif').click();
//cy.get('a.button.button--yellow').should('contain', 'Postident').click();
//cy.contains('1. PostIdent Coupon herunterladen').click();
cy.contains('Zum Investment').click();
cy.get('.a.navigation-user.dropdown-toggle').click();
cy.get('ul.dropdown-menu.navigation__dropdown__nav.navigation__nav--mobile.underline-links.underline-links--white');
cy.get('li').eq('7').should('contain', 'Logout');
})
});
I know it looks horrible, but I'm not familiar with testing or JavaScript and I don't think I'll ever be, but I need this for my bachelor thesis.
So do you have any idea why it takes so long when I try to record this test? And does any of you have any idea how to solve this?
I don't get it because I don't get any error messages.

Related

Vue 2 Moving Window with Keyboard Navigation

I have created a list in my program. In this list, you press ArrowUp or ArrowDown to navigate between the items that are generated with a v-for in said list. When you use the arrows to navigate the list, a counter is used to know which item inside this list is the "selected" one. My current problem is: When you "select" an item that is outside your view, the Browser's Window doesn't follow it down, allowing the selection to keep "going down" this list, but the user isn't able to see the other selected items.
I've tried messing around with the focus() function, but I don't know how to focus() a specific item without using the ref atribute, which I also can't seem to implement since it's being generated with v-for.
Here's my current table:
<table class="table table-striped p-0 m-0" v-show="pedidos.length > 0">
<thead class="table-dark">
<tr class="">
<th>Cliente Emissor</th>
<th>Produto</th>
<!-- <th>Endereço</th> -->
<!-- <th>Valor</th> -->
<th>Data Emissão</th>
<th>Estado</th>
</tr>
</thead>
<tbody>
<template v-for="(pedido, index) in pedidos">
<itemPedido :pedido="pedido" :key="index" :endereco="endereco" :class="[(navegacaoAtual == index) ? 'teste' : '']" ref="teste"></itemPedido>
<itemEdit #atualizarListaPedidos="atualizarListaPedidos" #atualizarStatusModal="atualizarStatusModal" class="animation-dropdown" :pedido="pedido" :key="pedido.nome"></itemEdit>
</template>
</tbody>
</table>
Here's the current navigateWithArrows() function I've made:
navegarSetas(key) {
if (this.navegacaoSetasAtiva == false) {
this.navegacaoSetasAtiva = true
this.navegacaoAtual = 0
} else if (this.modalAtivado == false && this.navegacaoSetasAtiva == true) {
if (key == 'ArrowDown' && this.navegacaoAtual < this.pedidos.length - 1) {
this.navegacaoAtual++
Vue.nextTick().then(() => {
let teste1 = this.$refs.teste[this.navegacaoAtual]
teste1.$el.focus()
})
} else if (key == 'ArrowUp' && this.navegacaoAtual <= this.pedidos.length && this.navegacaoAtual > 0) {
this.navegacaoAtual--
} else if (key == 'Enter') {
let pedidoSelecionado = this.pedidos[this.navegacaoAtual].id
Event.$emit('changeShow', pedidoSelecionado)
}
}
},
All help is appreciated. Thank you!
After taking a break and resuming my search, I stumbled upon something that did exactly what I wanted: the scrollIntoView() function.
https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView

Cypress: Check list of hrefs, assert they do NOT contain a certain string

I have a list of hrefs that I need to check. I only need to make sure that none of them contains the string "creditcheck"
The html looks like this:
<div class="yiiTab clearfix content-right-side" id="clientinfotabs">
<ul class="tabs left-side-tabs">
<li>
<a reloadonclick="" loadurl="/index.php?r=foo/bar;id=12345&language=de" href="#foofoobar" class="active">Test<span class="tab-item-count">8</span></a></li>
<li>
<li>
<li>
<li>
.
.
.
</ul>
The general idea was this:
Get ul
Iterate through every li item
Get 'a' using .children()
Invoke href and compare to a string
I tried to iterate through the list and check the hrefs using several approaches. This is my latest attempt:
describe('check hrefs', () => {
it('check hrefs', () => {
cy.login()
cy.visit('url3')
cy.get('tbody > :nth-child(1) > .col-id-large').click({force: true})
cy.get('#clientinfotabs > ul')
.each(($el) => {
cy.get($el).children().invoke('attr','href').should('not.include','creditcheck');
})
})
})
That's what Cypress returns when I run this script:
AssertionError
Timed out retrying after 10000ms: object tested must be an array, a map, an object, a set, a string, or a weakset, but undefined given
cypress/integration/test2.spec.js:10:62
8 | cy.get('#clientinfotabs > ul')
9 | .each(($el) => {
> 10 | cy.get($el).children().invoke('attr','href').should('not.include','creditcheck');
| ^
11 | })
12 | })
13 | })
So you are really close. Instead of cy.get() you have to use cy.wrap(). And also you can directly loop over li using the selector #clientinfotabs > ul > li.
describe('check hrefs', () => {
it('check hrefs', () => {
cy.login()
cy.visit('url3')
cy.get('tbody > :nth-child(1) > .col-id-large').click({force: true})
cy.get('#clientinfotabs > ul >li').each(($el) => {
cy.wrap($el).invoke('attr', 'href').should('not.include', 'creditcheck')
})
})
})

Unselect effect Radio Material2 Angular 5

I'm using mat-radio-button(material2) and I have something like a quiz. When I select an answer and go to the next quiz, the visual effect of unselect is showing in the second quiz. This happens if the selected option in the first quiz, appears in the second too, in the same position or after.
I made a simple example. You can reproduce it selecting "aa", then click ">>" button.
HTML
<mat-radio-group class="example-radio-group" [(ngModel)]="radioSelected">
<mat-radio-button *ngFor="let option of tempSublist" [value]="option" class="example-radio-button" color="primary">
{{option}}
</mat-radio-button>
</mat-radio-group>
<hr>
<button (click)="prev()"><<</button>
<button (click)="next()">>></button>
Typescript
list = [
['aa','bb','cc'],
['cc','aa','bb'],
['bb','cc','ee'],
['dd','bb','cc'],
];
index = 0;
tempSublist = this.list[this.index];
radioSelected:string;
next(){
if(this.index < this.list.length){
this.radioSelected = null;
this.index++;
this.tempSublist = this.list[this.index];
}
}
prev(){
if(this.index >= 1){
this.radioSelected = null;
this.index--;
this.tempSublist = this.list[this.index];
}
}
https://stackblitz.com/edit/angular-7s9qvs?file=app%2Fradio-ng-model-example.html
How can I solve this?
Adding trackBy option on ngFor helps to reduce the transition between the two states. Also disabling repples with [disableRipple]="true" seems to reduce the visual effect:
HTML
<mat-radio-button [disableRipple]="true" *ngFor="let option of tempSublist;
trackBy: trackByFn" ...>
...
Typescript
next() {
if (this.index < this.list.length - 1) {
//add this ^
...
trackByFn(index, item) {
return index;
}
I thought adding a control on navigation buttons would be nice:
<button [disabled]="index <= 0" (click)="prev()"><<</button>
^- this
<button [disabled]="index === tempSublist.length" (click)="next()">>></button>
^- this
Demo
If this is not enough, in last recourse, hide and show the whole block.
Wrap it in a div and set ngIf:
<div *ngIf="isVisible">
<mat-radio-group class="example-radio-group" [(ngModel)]="radioSelected">
...
and use timeout in the class on button click:
next() {
isVisible = true;
this.isVisible = false;
if (this.index < this.list.length - 1) {
...
}
setTimeout(() => this.isVisible = true, 30)
}
Demo

Prestashop - Show the prices are tax excluded for visitors

I am on Prestashop 1.6
When a user is a guest or a member, the mention "tax excl." is displayed next to the price in the products sheets.
Like this :
I would like this text to appear also for the visitors.
For visitors, it currently shoows like this :
So go to Client -> Group and for all groups choose as price display the HT.
Regards,
In Back office, customers > groups choose the visitor group click to modify button, change the tax display to tax incl, if it is like that, go to admin coutries choose your country, click to modify button and enable tax showing
think I found the solution. In product.tpl, replace
<span id="our_price_display" class="price" itemprop="price" content="{$productPrice}">{convertPrice price=$productPrice|floatval}</span>
{if $tax_enabled && ((isset($display_tax_label) && $display_tax_label == 1) || !isset($display_tax_label))}
{if $priceDisplay == 1} {l s='tax excl.'}{else} {l s='tax incl.'}{/if}
{ /if}
With :
<span id="our_price_display" class="price" itemprop="price" content="{$productPrice}">{convertPrice price=$productPrice|floatval}</span>
{if $priceDisplay == 1} {l s='tax excl.'}{else} {l s='tax incl.'}{/if}

how to change the default message displayed by tooltip when error occurs in dojo

whenever i submit the form without entering anything into the text field by default i get a mesaage "please fill out this field".
how do i change the message to first name is required
< html >
< head >< /head >
< body >
< form action="a.html" >
< label for="firstName">First Name: < /label >
< input type="text" id="firstName" name="firstName"
dojoType="dijit.form.ValidationTextBox"
required="true"
propercase="true"
promptMessage="Enter first name."
invalidMessage="First name is required."
trim="true"
/>< br>
< input type="submit" value="submit"/>
< /form>
< /body >
< /html>
It sounds like you want to set "missingMessage", too:
http://livedocs.dojotoolkit.org/dijit/form/ValidationTextBox