Cypress-定位下拉框的动态加载显示的某数据选项-[虚拟列表]

问题描述：下拉框动态数据的解释。

如上图，左侧为下拉框，右侧红色部分为下拉框的数据。

数据显示的最大div数是固定的，但下拉框不止这几条数据。[注：这玩意儿是虚拟列表]

所以，滚动下拉时（如下图），新来的数据在div内靠覆盖之前的数据的位置显示。 

不在div里的数据定位不到。Cypress直接断言通不过。

---

目标：获取新加载出来的数据并可以定位它。

解决思路：新的数据是通过下拉框上下滚动加载出来的，所以，得”滚动”下拉框，让数据先出现在DOM中，再进行后续操作(点击，断言等等操作)。[注：这里只是提供一种解决方式，Code还可以继续优化。]

 图中，this.visiteUrl()，this.getkigyo，this.getdropDownBox 是PO封装好的方法。

递归过程：

Code源码 :

runES(uuid = 0) {
    var ukName = baseData.isukName + uuid // ZARD123456
    var findEle = baseData.isElementTemp.replace(/temp/g, ukName) // div[title='ZARD123456']
    this.visitUrl()
    this.getkigyo.click({ force: true })
    this.searchElement(findEle)
    this.getdropDownBox.should('not.have.class', baseData.isDropDownBoxHiddien).find(findEle).click()
  }
  //----让被查找的数据出现（DOM中能定位到）
  searchElement(findEle, times = 0) {
    if (times > 30) {
      throw "Search No Found "
    }
    this.getdropDownBox.should('not.have.class', baseData.isDropDownBoxHiddien)
      .find(baseData.isDropDownBoxElementList).then(($eleList) => {
        const sres = $eleList.find(findEle).length
        if (sres == 0) {
          this.getkigyo.type('{downarrow}{downarrow}', { force: true })
          return this.searchElement(findEle, times + 1)
        }
        return "Search End"
      })
  }

keng：

a.既然 递归次数上限设置，为什么不用循环来做？

b.递归函数 最后结束递归 为什么不返回 $eleList，后两步直接cy.get(this.searchElement(findEle)).find(findEle).click() 岂不简洁 ？

da：

ab.是异步的感觉。

a.用循环来做时，循环体里的Cypress语句一遍还没做完，循环已经跑多次或已经跑完。

b.get 先执行。