单击 Cypress 中的隐藏元素不起作用

Question

我遇到了这个问题，但没有找到好的解决方案。我尝试了在谷歌中找到的每一篇文章，但没有成功。我正在隔离问题，以便我可以与您分享确切的要点。我正在“mercadolibre.com”中搜索特定产品，我想将列表从较低价格到最高价格排序。为此，您可以直接在此处输入并单击“Menor Precio”选项。

手动执行此操作效果很好，但使用 Cypress 我无法做到这一点。该脚本运行良好，但最后一步似乎没有效果。

// Activate intelligence
/// <reference types="Cypress" />

describe("Main test suite for price control", () => {
    it("search scanners and order them by ascending price", () => {
      // Web access
      cy.visitAndWait("https://listado.mercadolibre.com.ar/scanner-blueetooth#D[A:scanner%20blueetooth");

      // Order by ascending price
      cy.get(':nth-child(2) > .andes-list__item-first-column > .andes-list__item-text > .andes-list__item-primary').click({force: true})
    });
});;

也许我使用了不好的方法来引用该对象？

此致！

Answer 1

我会重试菜单，直到选项可见

Cypress.on('uncaught:exception', () => false)

before(() => {
  cy.visit('https://listado.mercadolibre.com.ar/scanner-blueetooth#D%5BA:scanner%20blueetooth%5D') 
})

it('retries the menu open command', () => {

  function openMenu(attempts = 0) {
    if (attempts > 6) throw 'Failed open menu'

    return cy.get('button.andes-dropdown__trigger').click()
      .then(() => {
        const option = Cypress.$('.andes-list:visible') // is list visible
        if (!option.length) {
          openMenu(++attempts)  // try again, up to 6 attempts
        } 
      })
  } 

  openMenu().then(() => {
    cy.get('a.andes-list__item:contains(Menor precio)').click()
  })

  // Verification
  cy.contains('.ui-search-result__wrapper:nth-child(1)', '$490', {timeout:20000})
})