Search code examples
triggerscypresseachkeydownmousedown

Cypress trigger does not hold the click two times in same each loop

I'm trying to delete a record that is inside an "each" loop. It is deleted the first time each runs, but the second time, it just clicks but doesn't hold it.

cy.get('pc-fonts-manager-list').then(($fontsList) => {

      cy.get('pc-fonts-family-list-item').each(listItem =>{
      cy.get('[data-at=fontName]').first().invoke('text').then($fontName =>{
      cy.get('[data-at=removeFontBtn]').first().click();
      cy.holdToDeleteFontFamily('[data-at=fontFamilyConfirmRemoveBtn]');
      cy.wait('@deleteFamily');
      cy.assertSnackbarMessage(' Font Family \''+$fontName+'\' has been deleted ');

This is the piece to click and hold button (works first iteration):

 Cypress.Commands.add('holdToDeleteFontFamily', (element) =>{
      cy.get(element).focus().trigger('keydown', {key: 'Enter'})
    });

I'm not sure if it might be something related to trigger(), because I also tried the 'mouseclick' approach, and it also hasn't worked.

HTML piece:

<div class="c-alert__buttons"><button _ngcontent-cvf-c367="" ip-btn-regular-tertiary="" size="small" data-at="fontFamilyCancelRemoveBtn" class="c-btn c-btn--regular-tertiary c-btn--regular-tertiary-small c-btn--regular-tertiary-danger" ng-reflect-size="small"><span class="c-btn__content"> cancel </span></button><button _ngcontent-cvf-c367="" ip-btn-regular-secondary="" ip-btn-click-and-hold="" size="small" data-at="fontFamilyConfirmRemoveBtn" class="c-btn c-btn--regular-secondary c-btn--regular-secondary-small c-btn--click-and-hold c-btn--regular-secondary-danger" ng-reflect-size="small"><span class="c-btn__content"> confirm </span></button></div>

Thanks for your help!

Solution

  • I solved by adding an extra click() before triggering keydown

    cy.get(element).focus().click().trigger('keydown', {key: 'Enter'})