Блог

Главная - Вопросы по программированию - использование команды cypress chainable в if/else

использование команды cypress chainable в if/else

#typescript #cypress

#typescript #cypress

Вопрос:

как использовать команду chainable, смешанную с логикой if / else? кто-нибудь знает, как очистить код следующим образом? Я не хочу дублировать код .trigger('focus', {force: true}).click({force: true}); в обоих if / else. единственный вариант, который я могу придумать, — это использовать return в логике. но это не работает

     const selectedOption = 'I am option'
    cy.get('.my-selector')
      .contains(selectedOption)
      .scrollIntoView()
      .then(($option) => {
        if ($option.find('input').length === 1) {
          cy.wrap($option.find('input')).trigger('focus', {force: true}).click({force: true});
        } else {
          cy.wrap($option).trigger('focus', {force: true}).click({force: true});
        }
      });

использование return 

       .then(($option) => {
        if ($option.find('input').length === 1) {
          return cy.wrap($option.find('input'));
        }

Комментарии:

1. Можете ли вы подробнее рассказать о том, какой вариант использования? Может быть, есть лучшее решение, которое не требует условного тестирования, поскольку оно не идеально подходит для условного тестирования

2. Мне нужно использовать ту же функцию, чтобы выбрать опцию из двух компонентов typeahead. Однако опция с флажком из одного компонента и один не

3. Для меня это нормально как условное тестирование, кроме этого — .trigger('focus', {force: true}) кажется излишним, если вы будете использовать .click({force:true}) . Я бы разделил его на 2 случая, если это возможно, хотя, если он не зависит от api, но зависит от ваших действий.

Ответ №1:

Вы можете создать вспомогательную функцию для получения правильной цели,

 const getTarget = ($el) => {
  const $input = $el.find('input');
  return $input.length ? $input : $el;
}

cy.get('.my-selector')
  .contains(selectedOption)
  .scrollIntoView()
  .then(($option) => {
    cy.wrap(getTarget($option)).trigger('focus', {force: true}).click({force: true});
  });

// another syntax

cy.get('.my-selector')
  .contains(selectedOption)
  .scrollIntoView()
  .then($option => getTarget($option))
  .trigger('focus', {force: true}).click({force: true});

Или с помощью пользовательской команды

 Cypress.Commands.add('optionTarget', { prevSubject: true }, (subject) => {
  const $input = subject.find('input');
  return $input.length ? $input : subject;
})

cy.get('.my-selector')
  .contains(selectedOption)
  .scrollIntoView()
  .optionTarget().trigger('focus', {force: true}).click({force: true});
Метки: