diff --git a/cypress/utils/commands.js b/cypress/utils/commands.js index ce28849bc..cab746dd3 100644 --- a/cypress/utils/commands.js +++ b/cypress/utils/commands.js @@ -202,6 +202,25 @@ Cypress.Commands.add('getElementByTestId', (testId, options = {}) => { return cy.get(`[data-test-subj="${testId}"]`, options); }); +Cypress.Commands.add('getElementsByTestIds', (testIds, options = {}) => { + const selectors = [testIds] + .flat(Infinity) + .map((testId) => `[data-test-subj="${testId}"]`); + return cy.get(selectors.join(','), options); +}); + +Cypress.Commands.add( + 'whenTestIdNotFound', + (testIds, callbackFn, options = {}) => { + const selectors = [testIds] + .flat(Infinity) + .map((testId) => `[data-test-subj="${testId}"]`); + cy.get('body', options).then(($body) => { + if ($body.find(selectors.join(',')).length === 0) callbackFn(); + }); + } +); + Cypress.Commands.add('createIndex', (index, policyID = null, settings = {}) => { cy.request('PUT', `${Cypress.env('openSearchUrl')}/${index}`, settings); if (policyID != null) { diff --git a/cypress/utils/dashboards/commands.js b/cypress/utils/dashboards/commands.js index 54615c999..1d2188c4f 100644 --- a/cypress/utils/dashboards/commands.js +++ b/cypress/utils/dashboards/commands.js @@ -47,13 +47,29 @@ Cypress.Commands.add('setTopNavDate', (start, end, submit = true) => { message: `Start: ${start} :: End: ${end}`, }); - // Click date picker - cy.getElementByTestId('superDatePickerShowDatesButton', opts).click(opts); - - // Click start date - cy.getElementByTestId('superDatePickerstartDatePopoverButton', opts).click( + /* Find any one of the two buttons that change/open the date picker: + * * if `superDatePickerShowDatesButton` is found, it will switch the mode to dates + * * in some versions of OUI, the switch will open the date selection dialog as well + * * if `superDatePickerstartDatePopoverButton` is found, it will open the date selection dialog + */ + cy.getElementsByTestIds( + ['superDatePickerstartDatePopoverButton', 'superDatePickerShowDatesButton'], opts - ); + ) + .should('be.visible') + .invoke('attr', 'data-test-subj') + .then((testId) => { + cy.getElementByTestId(testId, opts).should('be.visible').click(opts); + }); + + /* While we surely are in the date selection mode, we don't know if the date selection dialog + * is open or not. Looking for a tab and if it is missing, click on the dialog opener. + */ + cy.whenTestIdNotFound('superDatePickerAbsoluteTab', () => { + cy.getElementByTestId('superDatePickerstartDatePopoverButton', opts) + .should('be.visible') + .click(opts); + }); // Click absolute tab cy.getElementByTestId('superDatePickerAbsoluteTab', opts).click(opts); diff --git a/cypress/utils/index.d.ts b/cypress/utils/index.d.ts index 4f436c3e0..d5daf9dfd 100644 --- a/cypress/utils/index.d.ts +++ b/cypress/utils/index.d.ts @@ -2,7 +2,25 @@ /// declare namespace Cypress { - interface Chainable { + interface Chainable { /** + * Call a function when an element with a test id cannot be found + * @example + * cy.whenTestIdNotFound(['query', 'puery'], () => {...}) + */ + whenTestIdNotFound( + testIds: string | string[], + callbackFn: void, + options?: Partial + ): Chainable; + /** + * Get elements by their test ids + * @example + * cy.getElementsByTestIds(['query', 'puery']) + */ + getElementsByTestIds( + testIds: string | string[], + options?: Partial + ): Chainable; /** * Get an element by its test id * @example