WebdriverIO - 等待

WebdriverIO 中的 waitUnit 方法是等待頁面上的操作/元素的標準方法。它等待滿足某個條件（真值）。

例如，我們經常等待文字出現在頁面上。

語法

waitUnit 方法的語法如下：

browser.waitUntil(condition, { timeout, timeoutMsg, interval })

這裡：

• condition = 等待的條件。

• 超時以毫秒為單位。預設值為 5000，是可選引數。

• timeoutMsg 是超時時丟擲的錯誤訊息，也是可選引數。

• interval 是驗證之間的間隔。預設值為 500，也是可選引數。

在下圖中，讓我們點選連結 - 團隊，並等待文字 - 教程點團隊出現。

點選“團隊”連結後，頁面上會顯示高亮顯示的訊息。

首先，請按照標題為“使用 WebdriverIO 的正確流程”一章中的步驟 1 到 5 操作，步驟如下：

步驟 1 - 安裝 NodeJS。有關如何執行此安裝的詳細資訊，請參閱標題為“使用 NodeJS 入門”一章。

步驟 2 - 安裝 NPM。有關如何執行此安裝的詳細資訊，請參閱標題為“NPM 安裝”一章。

步驟 3 - 安裝 VS Code。有關如何執行此安裝的詳細資訊，請參閱標題為“VS Code 安裝”一章。

步驟 4 - 建立配置檔案。有關如何執行此安裝的詳細資訊，請參閱標題為“配置檔案生成”一章。

步驟 5 - 建立規範檔案。有關如何執行此安裝的詳細資訊，請參閱標題為“Mocha 安裝”一章。

步驟 6 - 在建立的 Mocha 規範檔案中新增以下程式碼。

// test suite name
describe('Tutorialspoint Application', function(){
   //test case
   it('Waits', function(){    
      // launch url
      browser.url('https://tutorialspoint.tw/about/about_careers.htm')  
      //identify then click link - Team
      const p = $('=Team')
      p.click()
      //wait for text
      browser.waitUntil(
         () => $('<h1>').getText() === 'Team @ Tutorials Point', {
            timeout: 6000,
            timeoutMsg: 'expected text did not match'
         }
      );
      //identify required text
      const m = $('<h1>')
      console.log(m.getText())   
   });
});

使用以下命令執行配置檔案 - wdio.conf.js 檔案：

npx wdio run wdio.conf.js

有關如何建立配置檔案的詳細資訊，請參閱標題為“wdio.conf.js 檔案”和“配置檔案生成”章節。您的計算機上將出現以下螢幕：

命令成功執行後，點選“團隊”連結生成的文字 - 教程點團隊將列印在控制檯中。