Refactor Cypress tests after drupal/gin update to 3.0.0-rc16

With the recent theme update, some UI elements changed. I have added two new Cypress commands: `clickSaveButton` and `deleteEntitiesIfExists`. These commands are now working as expected and is applied to all tests affected by the update. This also ensuring more reliable test execution in the future

cypress/e2e/campaign.cy.ts

@@ -346,10 +346,10 @@ describe('Campaign creation and endpoint', () => {
     cy.drupalLogin();
 
     // Delete campaigns.
-    deleteCampaign(campaigns.authorCampaign);
-    deleteCampaign(campaigns.booksByJKRowling);
-    deleteCampaign(campaigns.rankingAndCampaign);
-    deleteCampaign(campaigns.rankingOrCampaign);
+    cy.deleteEntitiesIfExists(campaigns.authorCampaign);
+    cy.deleteEntitiesIfExists(campaigns.booksByJKRowling);
+    cy.deleteEntitiesIfExists(campaigns.rankingAndCampaign);
+    cy.deleteEntitiesIfExists(campaigns.rankingOrCampaign);
 
     cy.anonymousUser();
   });
@@ -457,26 +457,7 @@ const createRankingOrCampaign = () => {
 const createCampaign = (callback: () => void) => {
   cy.visit('/node/add/campaign');
   callback();
-  cy.get('input[value="Save"]').click();
-};
-
-const deleteCampaign = (title: string) => {
-  cy.visit('/admin/content');
-  cy.contains(title)
-    .parents('tr')
-    .find('td li.dropbutton-toggle button')
-    .click()
-    .then(($button) => {
-      cy.wrap($button)
-        .parent('.dropbutton-toggle')
-        .parent('ul.dropbutton')
-        .find('li.delete a')
-        .click();
-      cy.get('.ui-dialog .form-submit')
-        .filter(':visible')
-        .should('exist')
-        .click();
-    });
+  cy.clickSaveButton();
 };
 
 const createCampaignMainProperties = (name: string, logic: 'AND' | 'OR') => {

cypress/e2e/events.cy.ts

@@ -34,7 +34,7 @@ describe('Events', () => {
     });
     setDate('Start date', events.singleEvent.start);
     setDate('End date', events.singleEvent.end);
-    cy.findByRole('button', { name: 'Save' }).click();
+    cy.clickSaveButton();
 
     // Ensure that the core data from the event is displayed on the resulting page.
     // @todo This should probably be replaced by a visual regression test.

cypress/e2e/opening-hours-editor.cy.ts

@@ -52,7 +52,7 @@ const createTestBranchAndVisitOpeningHoursAdmin = () => {
   cy.get('#edit-field-address-0-address-locality')
     .type('Example City', { force: true })
     .should('have.value', 'Example City');
-  cy.get('input[value="Save"]').click();
+  cy.clickSaveButton();
   cy.get('a[href^="/node/"][href$="/edit"]').click({ force: true });
   cy.get('a[href*="/edit/opening-hours"]').click();
   // Save the URL for the admin page and the page itself for later use
@@ -63,27 +63,6 @@ const createTestBranchAndVisitOpeningHoursAdmin = () => {
   });
 };
 
-const deleteAllTestBranchesIfExists = () => {
-  const formattedSearchString = branchTitle.toLowerCase().replace(/ /g, '+');
-  cy.drupalLogin();
-  cy.visit(
-    `/admin/content?title=${formattedSearchString}&type=branch&status=All&langcode=All`,
-  );
-
-  cy.get('tbody').then((tbody) => {
-    if (tbody.find('td.views-empty').length) {
-      cy.log('No branches to delete.');
-    } else {
-      cy.get('input[title="Select all rows in this table"]').check({
-        force: true,
-      });
-      cy.get('#edit-action').select('node_delete_action');
-      cy.contains('input', 'Apply to selected items').click();
-      cy.contains('input', 'Delete').click();
-    }
-  });
-};
-
 const visitOpeningHoursPage = (initialDate?: string) => {
   const pageUrl = Cypress.env('pageUrl');
   if (pageUrl) {
@@ -457,7 +436,7 @@ const deleteRestOfOpeningHoursSeries = ({
 
 describe('Opening hours editor', () => {
   beforeEach(() => {
-    deleteAllTestBranchesIfExists();
+    cy.deleteEntitiesIfExists(branchTitle);
     createTestBranchAndVisitOpeningHoursAdmin();
   });
 

cypress/e2e/varnish.cy.ts

@@ -24,7 +24,7 @@ describe('Varnish', () => {
     // Create a node as admin.
     cy.drupalLogin('/node/add/article');
     cy.findByLabelText('Title').type(node.title);
-    cy.findByRole('button', { name: 'Save' }).click();
+    cy.clickSaveButton();
     cy.contains(node.title);
     cy.should('not.contain', node.subtitle);
     // We do not have a good way to store the current path between tests so
@@ -48,7 +48,7 @@ describe('Varnish', () => {
       force: true,
     });
     cy.findByLabelText('Subtitle').type(node.subtitle);
-    cy.findByRole('button', { name: 'Save' }).click();
+    cy.clickSaveButton();
     cy.contains(node.title);
     cy.contains(node.subtitle);
 

cypress/support/commands.ts

@@ -244,6 +244,7 @@ Cypress.Commands.add(
     });
   },
 );
+
 Cypress.Commands.add(
   'setupAdgangsplatformenRegisterMappinngs',
   ({
@@ -330,6 +331,32 @@ Cypress.Commands.add('getBySel', (selector, checkVisible = false, ...args) => {
   return cy.get(`[data-cy="${selector}"]${visible(checkVisible)}`, ...args);
 });
 
+Cypress.Commands.add('clickSaveButton', () => {
+  cy.get('#edit-gin-sticky-actions input[value="Save"]').click();
+});
+
+Cypress.Commands.add('deleteEntitiesIfExists', (name) => {
+  const formattedSearchString = name.toLowerCase().replace(/ /g, '+');
+
+  cy.drupalLogin();
+  cy.visit(
+    `/admin/content?title=${formattedSearchString}&status=All&langcode=All`,
+  );
+
+  cy.get('tbody').then((tbody) => {
+    if (tbody.find('td.views-empty').length) {
+      cy.log('No branches to delete.');
+    } else {
+      cy.get('input[title="Select all rows in this table"]').check({
+        force: true,
+      });
+      cy.get('#edit-action').select('node_delete_action');
+      cy.contains('input', 'Apply to selected items').click();
+      cy.contains('input', 'Delete').click();
+    }
+  });
+});
+
 // According to the documentation of types and Cypress commands
 // the namespace is declared like it is done here. Therefore we'll bypass errors about it.
 /* eslint-disable @typescript-eslint/no-namespace */
@@ -367,6 +394,8 @@ declare global {
         checkVisible?: boolean,
         ...args: unknown[]
       ): Chainable;
+      deleteEntitiesIfExists(name: string): Chainable<null>;
+      clickSaveButton(): Chainable<null>;
     }
   }
 }