Move all 'helpers' functions to Cypress 'commands'

Author: MatteoStifano

tests/cypress/e2e/helpers.ts

@@ -10,40 +10,3 @@ export const inputServiceRegexSelector = 'input[data-test-id="service_regex-filt
 export const inputServiceSelector = 'input[id="input_Service"]';
 export const inputTemplateSelector = 'input[id="input_Predefined graph"]';
 export const panelContentSelector = '[class="panel-content"]';
-
-export function addCmkDatasource(cmkUsername: string, cmkPassword: string) {
-  cy.visit('/datasources/new');
-  cy.get('button[aria-label="Add data source Checkmk"]').contains('Checkmk').click();
-
-  cy.get('[data-test-id="checkmk-url"]').type(Cypress.env('grafanaToCheckmkUrl'));
-  cy.get('[data-test-id="checkmk-username"]').type(cmkUsername);
-  cy.get('[data-test-id="checkmk-password"]').type(cmkPassword);
-  cy.get('[id="checkmk-version"]').type('<{enter}');
-
-  cy.get('[aria-label="Data source settings page Save and Test button"]').click();
-
-  cy.get('[data-testid="data-testid Alert success"]').should('be.visible');
-  cy.contains('Data source is working').should('be.visible');
-}
-
-export function rmCmkDatasource() {
-  // Remove the previously-created datasource as teardown process.
-  // This makes sure the tests use the newly generated datasource in each execution.
-  // Important especially when running the tests locally if docker images are up during multiple tests' executions.
-
-  cy.visit('/datasources/');
-
-  cy.get('[class="page-container page-body"]').contains('Checkmk').click();
-  cy.contains('Delete').click();
-  cy.get('button[aria-label="Confirm Modal Danger Button"]').click();
-
-  cy.contains('No data sources defined').should('be.visible');
-}
-
-export function saveDashboard(dashboardID: string) {
-  cy.get('button[title="Apply changes and save dashboard"]').contains('Save').click();
-  cy.get('input[aria-label="Save dashboard title field"]').type(' ' + dashboardID);
-
-  cy.get('button[aria-label="Save dashboard button"]').click();
-  cy.contains('Dashboard saved').should('be.visible');
-}

tests/cypress/e2e/spec.cy.ts

@@ -8,7 +8,6 @@ import {
   executeServiceDiscovery,
 } from './api_helpers';
 import {
-  addCmkDatasource,
   inputFilterSelector,
   inputGraphTypeSelector,
   inputHostLabelsSelector,
@@ -19,8 +18,6 @@ import {
   inputServiceSelector,
   inputTemplateSelector,
   panelContentSelector,
-  rmCmkDatasource,
-  saveDashboard,
 } from './helpers';
 
 describe('e2e tests', () => {
@@ -42,7 +39,7 @@ describe('e2e tests', () => {
     activateCmkChanges('cmk');
 
     cy.loginGrafana();
-    addCmkDatasource(cmkUser, cmkPassword);
+    cy.addCmkDatasource(cmkUser, cmkPassword);
   });
 
   it('time-usage panel by service (single host)', {}, () => {
@@ -63,8 +60,7 @@ describe('e2e tests', () => {
 
     cy.get(panelContentSelector).contains('CPU time in user space').should('be.visible');
 
-    const randInt = Math.floor(Math.random() * 1000);
-    saveDashboard(randInt.toString());
+    cy.saveDashboard();
   });
 
   it('time-usage panel by service (multiple hosts)', {}, () => {
@@ -86,8 +82,7 @@ describe('e2e tests', () => {
       .contains('CPU time in user space, ' + hostName1)
       .should('be.visible');
 
-    const randInt = Math.floor(Math.random() * 1000);
-    saveDashboard(randInt.toString());
+    cy.saveDashboard();
   });
 
   it('RAM-used panel by service regex (multiple hosts)', {}, () => {
@@ -107,8 +102,7 @@ describe('e2e tests', () => {
     cy.get(panelContentSelector).contains(hostName0).should('be.visible');
     cy.get(panelContentSelector).contains(hostName1).should('be.visible');
 
-    const randInt = Math.floor(Math.random() * 1000);
-    saveDashboard(randInt.toString());
+    cy.saveDashboard();
   });
 
   it('RAM-used panel by host labels (multiple hosts, single metric)', {}, () => {
@@ -134,8 +128,7 @@ describe('e2e tests', () => {
     cy.get(panelContentSelector).contains(hostName0).should('be.visible');
     cy.get(panelContentSelector).contains(hostName1).should('be.visible');
 
-    const randInt = Math.floor(Math.random() * 1000);
-    saveDashboard(randInt.toString());
+    cy.saveDashboard();
   });
 
   it('RAM-used panel by service regex and hostname regex', {}, () => {
@@ -175,7 +168,7 @@ describe('e2e tests', () => {
   });
 
   after(function () {
-    rmCmkDatasource();
+    cy.rmCmkDatasource();
 
     deleteCmkHost(hostName0);
     deleteCmkHost(hostName1);

tests/cypress/support/commands.ts

@@ -13,11 +13,55 @@ Cypress.Commands.add('addNewPanel', () => {
   cy.get('button[aria-label="Add new panel"]').click();
 });
 
+Cypress.Commands.add('addCmkDatasource', (cmkUser: string, cmkPass: string) => {
+  cy.visit('/datasources/new');
+  cy.get('button[aria-label="Add data source Checkmk"]').contains('Checkmk').click();
+
+  cy.get('[data-test-id="checkmk-url"]').type(Cypress.env('grafanaToCheckmkUrl'));
+  cy.get('[data-test-id="checkmk-username"]').type(cmkUser);
+  cy.get('[data-test-id="checkmk-password"]').type(cmkPass);
+  cy.get('[id="checkmk-version"]').type('<{enter}');
+
+  cy.get('[aria-label="Data source settings page Save and Test button"]').click();
+
+  cy.get('[data-testid="data-testid Alert success"]').should('be.visible');
+  cy.contains('Data source is working').should('be.visible');
+});
+
+Cypress.Commands.add('rmCmkDatasource', () => {
+  // Remove the previously-created datasource as teardown process.
+  // This makes sure the tests use the newly generated datasource in each execution.
+  // Important especially when running the tests locally if docker images are up during multiple tests' executions.
+
+  cy.visit('/datasources/');
+
+  cy.get('[class="page-container page-body"]').contains('Checkmk').click();
+  cy.contains('Delete').click();
+  cy.get('button[aria-label="Confirm Modal Danger Button"]').click();
+
+  cy.contains('No data sources defined').should('be.visible');
+});
+
+Cypress.Commands.add('saveDashboard', () => {
+  const randInt = Math.floor(Math.random() * 1000).toString();
+
+  cy.get('button[title="Apply changes and save dashboard"]').contains('Save').click();
+  cy.get('input[aria-label="Save dashboard title field"]').type(' ' + randInt);
+
+  cy.get('button[aria-label="Save dashboard button"]').click();
+  cy.contains('Dashboard saved').should('be.visible');
+
+  return cy.wrap(randInt);
+});
+
 declare global {
   namespace Cypress {
     interface Chainable {
       loginGrafana(): Chainable<void>;
       addNewPanel(): Chainable<void>;
+      addCmkDatasource(cmkUser: string, cmkPass: string): Chainable<void>;
+      rmCmkDatasource(): Chainable<void>;
+      saveDashboard(): Chainable<string>;
     }
   }
 }