// ***********************************************
// This example commands.js shows you how to
// create various custom commands and overwrite
// existing commands.
//
// For more comprehensive examples of custom
// commands please read more here:
// https://on.cypress.io/custom-commands
// ***********************************************
import 'cypress-fill-command';
import '@testing-library/cypress/add-commands';
import 'cypress-file-upload';

declare global {
  namespace Cypress {
    interface Chainable {
      scrollAndCheckVisible(): Chainable<JQuery<HTMLElement>>;
    }
  }
}

// This command scrolls the element into view and checks if it is visible. Should work even in cases where elements were getting scrolled away by the browser.
Cypress.Commands.add('scrollAndCheckVisible', { prevSubject: 'element' }, (subject) => {
  cy.wrap(subject).should(($el: JQuery<HTMLElement>) => {
    $el.get(0).scrollIntoView();
    if (!$el.is(':visible')) {
      throw new Error('Element not visible yet');
    }
  });
});

Cypress.Commands.add('pasteText', (selector, text) => {
  cy.get(selector).then((elem) => {
    elem.text(text);
    elem.val(text);
    cy.get(selector).type(' {backspace}');
  });
});

Cypress.Commands.add('findWithinOrGet', (childSelector: string, ancestorAlias?: string) => {
  return ancestorAlias ? cy.get(ancestorAlias).find(childSelector) : cy.get(childSelector);
});
