賽普拉斯 - 有超時的條件測試

Question

我正在嘗試做與這篇文章非常相似的事情： https://stackoverflow.com/questions/56145926/how-to-check-if-element-exists-using-cypress-io

我正在使用打字稿。 這是我的代碼：

cy.get("body").then($body => {
            if ($body.find(this.timerLocator).length > 0) {
                return cy.get(this.timerLocator);
            }
            else {
                return cy.contains('No Match Found');
            }
});

問題是“this.timerLocator”最多可能需要 60 秒才能出現。 查找命令的文檔提到我們可以傳遞一個選項“超時”。 但是在添加超時時，我收到以下錯誤消息：

cy.get("body").then($body => {
            if ($body.find(this.timerLocator, {timeout: 60000}).length > 0) {
                return cy.get(this.timerLocator);
            }
            else {
                return cy.contains('No Match Found');
            }
        });

Expected 1 arguments, but got 2.ts(2554)

我還嘗試了一些更簡單的方法，例如：

try {
    cy.get(this.timerLocator, { timeout: 60000 });            
} catch (error) {
    cy.contains('No Match Found');
}

但這不起作用。 我從來沒有到達過抓斗。

誰能幫我解決這個問題？

Answer 1

我會不惜一切代價避免定義超時和基於時間的wait(number) 。 從長遠來看，它們不是解決方案，因為它們會減慢您的測試速度。

例如，大多數情況下，您需要等待某個 API 被調用。 在這種情況下，您應該使用別名定義一個 http 攔截器。

cy.intercept("GET", "/customers*").as("getCustomers");

然后等待那個別名。

cy.wait('@getCustomers');

如果您正在等待其他東西（這是非常特殊的），例如某種其他 promise 或超時來完成，然后找到一種方法來為該長期運行的 function 定義別名。 例如存根它並為它定義一個別名。

const stub = cy.stub(someServiceToWaitFor, 'functionToWaitFor').as('alias')

但是，您不能存根全局函數。 您只能在 object 上定義的存根函數。 因此，這可能（或可能不）需要您移動一些代碼。 （例如在服務中組織你的代碼）

其次，在您的 cypress-test 代碼中獲取該服務 object 可能具有挑戰性。 但是您實際上可以通過在window object 上定義變量來傳遞變量。

  if (window['Cypress']) {
    window['SomeServiceToWaitFor'] = someServiceToWaitFor;
  }

然后，您可以使用cy.window...從您的測試中獲取該 object。

Answer 2

你真的不能在超時的情況下做有條件的$body.find(...) 。

您可以使用輪詢 function 編寫自己的超時，但這比您需要的要復雜一些。

由於您有一個/或，並且看起來它們是互斥的，因此您可以使用多個選擇器

cy.get(this.timerLocator, 'contains("No Match Found")', {timeout:60000})
  .then($el =>
    cy.wrap($el).as('timerOrNoMatch');             // use alias not return
  })

請注意，您應該注意return cy.get() - 如果您存儲該查詢結果並且頁面發生更改，您最終可能會遇到無效元素，這是一個難以追蹤的錯誤。

如果您使用如上所示的別名，賽普拉斯會確保元素引用正確或執行重新查詢。

---

進一步說明 - 超時錯誤

$body.find()是沒有超時功能的 find 的 jQuery 版本。

賽普拉斯cy.find()是 jQuery 之一，其中包含重試/超時。