赛普拉斯/Javascript - 尝试单击尚未选择的按钮

布鲁西强盗

我在我的柏树中遇到问题，我试图单击第二个尚未禁用或未选择的按钮。当前发生的是它正在选择已经选择的按钮，我不确定为什么会这样。

这是一个 html 示例，因此如果您查看下面的代码，会发现有两个 div，每个 div 都处理一个选择行。每行中有一个按钮（<a>链接）。

<div class="marketsList__amount selectionBlock">
    <a id="event-selection-4191929065" eventid="event-selection-19976412" title="Ronaldo to score 2 or more goals" eventmodule="ODDS_BOOSTS_HOMEPAGE" class="oddsBoostedPrice   button__bet eventSelection--link" "="">
       <i class="icon-tick"></i>
        <em class="button__bet__odds">5/2</em>
        <div class="button__bet--action" data-textadded="Added" data-textremoved="Removed"></div>
    </a>
</div>

<div class="marketsList__amount selectionBlock">
    <a id="event-selection-4191929065" eventid="event-selection-19976412" title="Rashford to score 2 or more goals" eventmodule="ODDS_BOOSTS_HOMEPAGE" class="oddsBoostedPrice   button__bet eventSelection--link" "="">
       <i class="icon-tick"></i>
        <em class="button__bet__odds">5/2</em>
        <div class="button__bet--action" data-textadded="Added" data-textremoved="Removed"></div>
    </a>
</div>

现在在我的 BDD 场景中，我将其设置为这样；

When User selects an available bet bundle selection
Then The latest selection is added onto the betslip
When User selects an available bet bundle selection
Then The latest selection is added onto the betslip

当上面的步骤是这样的：

const oddsSelectionElements = new OddsSelectionElements();

When ("User selects an available bet bundle selection", () => {
  oddsSelectionElements.oddsButton().each((element, index) => {
      if (element.not("have.class", "disabled") || element.not("have.class", "selected")) {
      cy.wrap(element).click();
      return false;
    }
  })
})

OddsSelectionElements 类

class OddsSelectionElements {

    oddsButton() {
        return cy.get('.button__bet')
    }
}

export default OddsSelectionElements

那么发生的情况是，如果选择了一个按钮，则该类selected将添加到<a> element like so：

<a id="event-selection-4191929065" eventid="event-selection-19976412" title="Ronaldo to score 2 or more goals" eventmodule="ODDS_BOOSTS_HOMEPAGE" class="oddsBoostedPrice   button__bet eventSelection--link selected" "="">

这就是为什么我要检查以确保我们通过每个赔率按钮元素以及它是否不包含.selected该类。

谁能看到我做错了什么以及如何解决这个问题？

我

这个可以简化，因为您已经.button__bet在oddsButton方法中检查了类。

oddsSelectionElements.oddsButton()
  .each((element, index) => {
    if (!element.hasClass("disabled") && !element.hasClass("selected")) {
      cy.wrap(element).click()
      return false
    }
  })

抱歉，它需要&&在两个类之间进行检查，因为每个检查都是!（不是）。

disabled 通常是一个属性，会像这样检查

oddsSelectionElements.oddsButton()
  .each((element, index) => {
    if (!element.attr("disabled") && !element.hasClass("selected")) {
      cy.wrap(element).click()
      return false
    }
  })

使用此 HTML 片段进行测试

<button class="oddsBoostedPrice   button__bet eventSelection--link selected"></button>
<button class="oddsBoostedPrice   button__bet eventSelection--link" disabled></button>
<button class="oddsBoostedPrice   button__bet eventSelection--link"></button>

只有第三个按钮传递到if()语句中。

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。