ceph/src/pybind/mgr/dashboard/frontend/cypress/e2e/common/01-global.feature.po.ts

   1 import { And, Given, Then, When } from 'cypress-cucumber-preprocessor/steps';
   2
   3 import { UrlsCollection } from './urls.po';
   4
   5 const urlsCollection = new UrlsCollection();
   6
   7 Given('I am logged in', () => {
   8   cy.login();
   9 });
  10
  11 Given('I am on the {string} page', (page: string) => {
  12   cy.visit(urlsCollection.pages[page].url);
  13   cy.get(urlsCollection.pages[page].id).should('exist');
  14 });
  15
  16 Then('I should be on the {string} page', (page: string) => {
  17   cy.get(urlsCollection.pages[page].id).should('exist');
  18 });
  19
  20 And('I should see a button to {string}', (button: string) => {
  21   cy.get(`[aria-label="${button}"]`).should('be.visible');
  22 });
  23
  24 When('I click on {string} button', (button: string) => {
  25   cy.get(`[aria-label="${button}"]`).first().click();
  26 });
  27
  28 // When you are clicking on an action in the table actions dropdown button
  29 When('I click on {string} button from the table actions', (button: string) => {
  30   cy.get('.table-actions button.dropdown-toggle').first().click();
  31   cy.get(`[aria-label="${button}"]`).first().click();
  32 });
  33
  34 And('select options {string}', (labels: string) => {
  35   if (labels) {
  36     cy.get('a[data-testid=select-menu-edit]').click();
  37     for (const label of labels.split(', ')) {
  38       cy.get('.popover-body div.select-menu-item-content').contains(label).click();
  39     }
  40   }
  41 });
  42
  43 And('{string} option {string}', (action: string, labels: string) => {
  44   if (labels) {
  45     if (action === 'add') {
  46       cy.get('cd-modal').find('.select-menu-edit').click();
  47       for (const label of labels.split(', ')) {
  48         cy.get('.popover-body input').type(`${label}{enter}`);
  49       }
  50     } else {
  51       for (const label of labels.split(', ')) {
  52         cy.contains('cd-modal .badge', new RegExp(`^${label}$`))
  53           .find('.badge-remove')
  54           .click();
  55       }
  56     }
  57   }
  58 });
  59
  60 /**
  61  * Fills in the given field using the value provided
  62  * @param field ID of the field that needs to be filled out.
  63  * @param value Value that should be filled in the field.
  64  */
  65 And('enter {string} {string}', (field: string, value: string) => {
  66   cy.get('cd-modal').within(() => {
  67     cy.get(`input[id=${field}]`).type(value);
  68   });
  69 });
  70
  71 And('I click on submit button', () => {
  72   cy.get('[data-cy=submitBtn]').click();
  73 });
  74
  75 /**
  76  * Selects any row on the datatable if it matches the given name
  77  */
  78 When('I select a row {string}', (row: string) => {
  79   cy.get('cd-table .search input').first().clear().type(row);
  80   cy.contains(`datatable-body-row datatable-body-cell .datatable-body-cell-label`, row).click();
  81 });
  82
  83 Then('I should see the modal', () => {
  84   cy.get('cd-modal').should('exist');
  85 });
  86
  87 Then('I should not see the modal', () => {
  88   cy.get('cd-modal').should('not.exist');
  89 });
  90
  91 /**
  92  * Some modals have an additional confirmation to be provided
  93  * by ticking the 'Are you sure?' box.
  94  */
  95 Then('I check the tick box in modal', () => {
  96   cy.get('cd-modal .custom-control-label').click();
  97 });
  98
  99 And('I confirm to {string}', (action: string) => {
 100   cy.contains('cd-modal button', action).click();
 101   cy.get('cd-modal').should('not.exist');
 102 });
 103
 104 Then('I should see an error in {string} field', (field: string) => {
 105   cy.get('cd-modal').within(() => {
 106     cy.get(`input[id=${field}]`).should('have.class', 'ng-invalid');
 107   });
 108 });
 109
 110 Then('I should see a row with {string}', (row: string) => {
 111   cy.get('cd-table .search input').first().clear().type(row);
 112   cy.contains(`datatable-body-row datatable-body-cell .datatable-body-cell-label`, row).should(
 113     'exist'
 114   );
 115 });
 116
 117 Then('I should not see a row with {string}', (row: string) => {
 118   cy.get('cd-table .search input').first().clear().type(row);
 119   cy.contains(`datatable-body-row datatable-body-cell .datatable-body-cell-label`, row).should(
 120     'not.exist'
 121   );
 122 });
 123
 124 Then('I should see rows with following entries', (entries) => {
 125   entries.hashes().forEach((entry: any) => {
 126     cy.get('cd-table .search input').first().clear().type(entry.hostname);
 127     cy.contains(
 128       `datatable-body-row datatable-body-cell .datatable-body-cell-label`,
 129       entry.hostname
 130     ).should('exist');
 131   });
 132 });
 133
 134 And('I should see row {string} have {string}', (row: string, options: string) => {
 135   if (options) {
 136     cy.get('cd-table .search input').first().clear().type(row);
 137     for (const option of options.split(',')) {
 138       cy.contains(
 139         `datatable-body-row datatable-body-cell .datatable-body-cell-label .badge`,
 140         option
 141       ).should('exist');
 142     }
 143   }
 144 });
 145
 146 And('I should see row {string} does not have {string}', (row: string, options: string) => {
 147   if (options) {
 148     cy.get('cd-table .search input').first().clear().type(row);
 149     for (const option of options.split(',')) {
 150       cy.contains(
 151         `datatable-body-row datatable-body-cell .datatable-body-cell-label .badge`,
 152         option
 153       ).should('not.exist');
 154     }
 155   }
 156 });
 157
 158 And('I go to the {string} tab', (names: string) => {
 159   for (const name of names.split(', ')) {
 160     cy.contains('.nav.nav-tabs a', name).click();
 161   }
 162 });
 163
 164 And('select {string} {string}', (selectionName: string, option: string) => {
 165   cy.get(`select[name=${selectionName}]`).select(option);
 166   cy.get(`select[name=${selectionName}] option:checked`).contains(option);
 167 });
 168
 169 When('I expand the row {string}', (row: string) => {
 170   cy.contains('.datatable-body-row', row).first().find('.tc_expand-collapse').click();
 171 });
 172
 173 And('I should see row {string} have {string} on this tab', (row: string, options: string) => {
 174   if (options) {
 175     cy.get('cd-table').should('exist');
 176     cy.get('datatable-scroller, .empty-row');
 177     cy.get('.datatable-row-detail').within(() => {
 178       cy.get('cd-table .search input').first().clear().type(row);
 179       for (const option of options.split(',')) {
 180         cy.contains(
 181           `datatable-body-row datatable-body-cell .datatable-body-cell-label span`,
 182           option
 183         ).should('exist');
 184       }
 185     });
 186   }
 187 });