Protractor核心API

本章將幫助您瞭解各種核心API，這些API是Protractor執行的關鍵。

Protractor API的重要性

Protractor提供給我們廣泛的API，這些API對於執行以下操作以獲取網站的當前狀態非常重要：

獲取我們將要測試的網頁的DOM元素。
與DOM元素互動。
為它們分配操作。
與它們共享資訊。

為了執行上述任務，瞭解Protractor API非常重要。

各種Protractor API

眾所周知，Protractor是Selenium-WebDriver的包裝器，Selenium-WebDriver是Node.js的WebDriver繫結。Protractor具有以下API：

瀏覽器 (Browser)

它是WebDriver例項的包裝器，用於處理瀏覽器級別的命令，例如導航、頁面範圍的資訊等。例如，browser.get方法載入頁面。

元素 (Element)

它用於搜尋和與我們正在測試的頁面上的DOM元素互動。為此，它需要一個用於定位元素的引數。

定位器 (by)

它是一組元素定位器策略。例如，可以透過CSS選擇器、ID或任何其他與ng-model繫結的屬性來查詢元素。

接下來，我們將詳細討論這些API及其功能。

瀏覽器API (Browser API)

如上所述，它是WebDriver例項的包裝器，用於處理瀏覽器級別的命令。它執行各種功能，如下所示：

函式及其描述

ProtractorBrowser API 的函式如下：

browser.angularAppRoot

此Browser API函式設定我們將查詢Angular的元素的CSS選擇器。通常，此函式位於“body”中，但如果我們的ng-app位於頁面的子部分，則它也可能是一個子元素。

browser.waitForAngularEnabled

此Browser API函式可以設定為true或false。顧名思義，如果此函式設定為false，則Protractor將不會等待Angular $http和$timeout任務完成，然後再與瀏覽器互動。我們也可以在不更改狀態的情況下透過呼叫waitForAngularEnabled()（不傳遞值）來讀取當前狀態。

browser.getProcessedConfig

藉助此browser APIs函式，我們可以獲取當前正在執行的已處理配置物件，包括規範和功能。

browser.forkNewDriverInstance

顧名思義，此函式將派生另一個瀏覽器例項，用於互動式測試。它可以在啟用和停用控制流的情況下執行。下面分別給出兩種情況的示例：

示例1

執行**browser.forkNewDriverInstance()**並啟用控制流：

var fork = browser.forkNewDriverInstance();
fork.get(‘page1’);

示例2

執行**browser.forkNewDriverInstance()**並停用控制流：

var fork = await browser.forkNewDriverInstance().ready;
await forked.get(‘page1’);

browser.restart

顧名思義，它將透過關閉瀏覽器例項並建立一個新的例項來重新啟動瀏覽器。它也可以在啟用和停用控制流的情況下執行。下面分別給出兩種情況的示例：

**示例1** - 執行**browser.restart()**並啟用控制流：

browser.get(‘page1’);
browser.restart();
browser.get(‘page2’);

**示例2** - 執行**browser.forkNewDriverInstance()**並停用控制流：

await browser.get(‘page1’);
await browser.restart();
await browser.get(‘page2’);

browser.restartSync

它類似於browser.restart()函式。唯一的區別是它直接返回新的瀏覽器例項，而不是返回一個解析為新的瀏覽器例項的promise。只有在啟用控制流時才能執行它。

**示例** - 執行**browser.restartSync()**並啟用控制流：

browser.get(‘page1’);
browser.restartSync();
browser.get(‘page2’);

browser.useAllAngular2AppRoots

顧名思義，它僅與Angular2相容。在查詢元素或等待穩定性時，它將搜尋頁面上所有可用的Angular應用程式。

browser.waitForAngular

此browser API函式指示WebDriver等待Angular完成渲染並且沒有未完成的$http或$timeout呼叫，然後再繼續。

browser.findElement

顧名思義，此browser API函式將在搜尋元素之前等待Angular完成渲染。

browser.isElementPresent

顧名思義，此browser API函式將測試元素是否存在於頁面上。

browser.addMockModule

每次呼叫Protractor.get方法時，它都會新增一個模組以便在Angular之前載入。

示例

browser.addMockModule('modName', function() {
   angular.module('modName', []).value('foo', 'bar');
});

browser.clearMockModules

與browser.addMockModule不同，它將清除已註冊的模擬模組列表。

browser.removeMockModule

顧名思義，它將刪除一個已註冊的模擬模組。例如：browser.removeMockModule('modName');

browser.getRegisteredMockModules

與browser.clearMockModule相反，它將獲取已註冊的模擬模組列表。

browser.get

我們可以使用browser.get()將瀏覽器導航到特定的網路地址，並在Angular載入之前為該頁面載入模擬模組。

示例

browser.get(url);
browser.get('https://:3000'); 
// This will navigate to the localhost:3000 and will load mock module if needed

browser.refresh

顧名思義，這將重新載入當前頁面並在Angular之前載入模擬模組。

browser.navigate

顧名思義，它用於將導航方法混合到導航物件中，以便像以前一樣呼叫它們。例如：driver.navigate().refresh()。

browser.setLocation

它用於使用頁面內導航瀏覽到另一個頁面。

示例

browser.get('url/ABC');
browser.setLocation('DEF');
expect(browser.getCurrentUrl())
   .toBe('url/DEF');

它將從ABC頁面導航到DEF頁面。

browser.debugger

顧名思義，這必須與protractor除錯一起使用。此函式基本上向控制流新增一個任務，以暫停測試並將輔助函式注入瀏覽器，以便可以在瀏覽器控制檯中進行除錯。

browser.pause

它用於除錯WebDriver測試。我們可以在測試中使用**browser.pause()**從控制流中的該點進入protractor偵錯程式。

示例

element(by.id('foo')).click();
browser.pause();
// Execution will stop before the next click action.
element(by.id('bar')).click();

browser.controlFlowEnabled

它用於確定控制流是否啟用。

列印頁面