App下載

使用 Selenium 和 JavaScript 啟動測試自動化的快速指南

寶藏少女 2021-09-03 10:49:28 瀏覽數(shù) (2919)
反饋

測試是軟件開發(fā)生命周期 (SDLC) 的一個重要階段,其中的主要議程是發(fā)現(xiàn)最大的 bug 并挖掘出能成功發(fā)布產(chǎn)品所需的缺失要求。為了增加產(chǎn)品測試覆蓋率并以最快的方式交付無錯誤的產(chǎn)品,重要的是將功能自動化測試引入圖片中,以確保產(chǎn)品按預期運行并為最終用戶提供完美的體驗。

如今,我們有很多自動化測試工具框架來自動化 Web 操作。然而,Selenium 是最流行和最可行的Web自動化框架之一。

Selenium 是一個開源測試框架,用于通過應(yīng)用程序的前端自動化端到端的測試過程。它進一步分類為:

  • ?Selenium IDE?: Selenium 集成開發(fā)環(huán)境 (IDE) 主要是一種記錄和回放工具,可用于自動執(zhí)行 Web 操作。它易于使用,只需向瀏覽器添加擴展程序即可進行配置。它是一個基于 GUI 的應(yīng)用程序,用于記錄與網(wǎng)站的交互并在 IDE 中創(chuàng)建測試套件。
  • ?Selenium WebDriver?:是一個遠程控制接口,提供對用戶代理的控制。?Selenium WebDriver?是一個瀏覽器自動化框架,它接受來自語言綁定的命令并將它們轉(zhuǎn)發(fā)到瀏覽器。它通過直接與瀏覽器通信來控制瀏覽器,并通過瀏覽器特定驅(qū)動程序?qū)崿F(xiàn)。
  • ?Selenium Grid?:是一種趨勢工具,用于針對由不同瀏覽器、瀏覽器版本和不同操作系統(tǒng)創(chuàng)建的不同環(huán)境并行運行多個自動化測試。?Selenium Grid? 基本上是集線器和節(jié)點的組合,其中集線器是 Selenium 獨立集線器,節(jié)點是連接到單個集線器的不同瀏覽器。 

Selenium 支持多種腳本語言,如 ?Java?、?Ruby?、?C#?、?Python?、?JavaScript ?等。 ?JavaScript? 是一種高級、多范式的編程語言,用于客戶端和服務(wù)器端,允許您將靜態(tài)網(wǎng)頁轉(zhuǎn)換為交互式網(wǎng)頁那些。我們將研究如何將 ?Selenium Webdriver? 與 ?Javascript ?一起用于Web 應(yīng)用程序的自動化測試。

為什么選擇 JavaScript 來實現(xiàn)基于 Selenium 的 UI 自動化?

JavaScript 主要用于開發(fā) Web 應(yīng)用程序,因為許多 Web 應(yīng)用程序基于 MEAN 堆棧(MongoDB、Express.js、AngularJS 和 Node.js)或 MERN 堆棧(MongoDB、ExpressJS、ReactJS、Node.js)。根據(jù)Stack Overflow 調(diào)查,JavaScript 是世界上使用最多的編程語言。

由于它受到許多 Web 開發(fā)受眾的青睞,因此,將其與 Selenium 集成以增強測試自動化可能是一個主要想法。以下幾點重點說明了為什么選擇 JavaScript 和 Selenium:

  • JavaScript 是一種開發(fā)良好且結(jié)構(gòu)化的模式語言,它使自動化腳本更加緊湊??且易于理解。
  • 基于 Selenium 的 UI 自動化與 Javascript 可以是許多組織的良好組合,因為他們可以堅持使用一種技術(shù)進行 Web 開發(fā)和測試自動化。
  • 這些技術(shù)是開源和免費使用的,并且正在逐步增強以更好地發(fā)展。
  • 它被高級安全包裹,使用起來相對安全。
  • JavaScript 是一種腳本語言,它提供了巨大的優(yōu)勢,因為它可以直接控制服務(wù)器或客戶端腳本。

排名前四的 JavaScript 測試框架

1. JEST

?JEST ?是 Facebook 開發(fā)的自動化測試框架,用于測試使用 React JS 開發(fā)的應(yīng)用程序的 JavaScript 代碼。它被認為是一個記錄良好且性能快速的 JavaScript 測試框架。使用 ?JEST ?的主要優(yōu)點是可以使用行為驅(qū)動的開發(fā)方法編寫測試用例,并且該框架還可用于通過捕獲屏幕截圖來執(zhí)行可視化回歸測試。

2. Nightwatch 

?Nightwatch ?是一個由 node.js 驅(qū)動的自動化測試框架。它通過利用 W3C Selenium WebDriver API 促進了 Web 應(yīng)用程序的端到端測試。它可用于單元測試和集成測試。它有一個內(nèi)置的命令行測試運行器,用于通過重試和隱式等待來執(zhí)行測試。?Nightwatch ?框架的語法非常干凈且易于理解,有助于測試人員編寫更有效的測試用例。

3.Protractor

正如我們上面所研究的,JEST 主要用于基于 React JS 的應(yīng)用程序,類似地,對于基于 Angular JS 的 Web 應(yīng)用程序,我們有 ?Protractor?。它通常用于 Angular 應(yīng)用程序的端到端測試,并支持與 Selenium 定位器類似的其他定位器,例如:repeater, model, binding等等。設(shè)置針對不同環(huán)境的測試用例的并行執(zhí)行非常簡單。此外,使用?Protractor?可以更輕松地自動截取和比較屏幕截圖。

4. Mocha 

自 2011 年以來,?Mocha JS? 一直是流行的自動化測試框架。它是一個開源測試框架,主要由 JavaScript 開發(fā)人員用于單元測試。它在 Node.js 上運行,并為前端和后端測試提供兼容性。它廣泛用于第三方斷言、嘲笑和間諜活動。它支持 node.js 調(diào)試器,使錯誤識別更容易。?Mocha JS? 框架還以其準確的報告和將異常與相關(guān)測試用例輕松映射而聞名。

使用 JavaScript 設(shè)置 Selenium 的先決條件  

要繼續(xù)使用 Selenium 和 JavaScript 執(zhí)行測試自動化,需要檢查的先決條件很少。我們來看一下:

第 1 步:安裝 Node.js npm

Node.js 與 npm 捆綁在一起,即節(jié)點包管理器。你可以從Node.js 官方站點下載相同的內(nèi)容。運行以下命令來驗證 npm 和 node.js 的安裝:

  • npm -v
  • node-v

第 2 步:安裝 Selenium WebDriver

Npm 是內(nèi)置的包管理器,它將進一步用于為 JS 安裝 Selenium。

以下是安裝 Selenium WebDriver 的命令(-save 用于創(chuàng)建一個新包,該包將保存到項目 package.json 文件中):

  • npm install –save selenium-webdriver

你還需要為 Chrome、Firefox 或任何其他要在其上執(zhí)行自動化測試的特定瀏覽器下載驅(qū)動程序,可以從npm js 站點下載相同的驅(qū)動程序。強烈建議將瀏覽器驅(qū)動程序的路徑添加到系統(tǒng) PATH 中,以便 Selenium 可以使用這些可執(zhí)行文件直接啟動瀏覽器。

第 3 步:安裝 IDE

為了實現(xiàn),您可以從下面為 JS 安裝您選擇的任何 IDE:

  • Visual Studio Code
  • Eclipse

使用 Selenium 和 JavaScript 編寫我們的第一個 Web 自動化測試

完成上述所有步驟并成功完成配置設(shè)置后,我們就可以開始使用 JavaScript 編寫我們的第一個 Selenium 自動化測試了。

我們的測試場景如下:

  1. 導航到 pCloudy 官方網(wǎng)站
  2. 獲取首頁的標題
  3. 驗證首頁標題驗證登陸pcloudy網(wǎng)站
  4. 根據(jù)測試用例通過或失敗打印日志

first_test.js

var webdriver = require('selenium-webdriver');
 
const driver = new webdriver.Builder()
    .forBrowser('chrome')
    .build();
 
 
driver.get('http:/www.pCloudy.com').then(function(){
    driver.getTitle().then(title=>{
     
        if(title.localeCompare("Mobile App Testing, Continuous Testing Cloud, Mobile Testing Tools | pCloudy")){
            console.log("Test Passed!")
        }else{
            console.log("Test Failed!")
        }
    })
 });
 
driver.quit();

代碼演示:

最初,我們導入了selenium-webdriver庫,然后我們使用我們導入的庫中的Builder方法創(chuàng)建了 chromedriver 的一個實例。

接下來,我們使用 driver.get() 導航到 Web 應(yīng)用程序 URL。然后,我們使用 driver.getTitle() 獲取應(yīng)用程序主頁的標題,并驗證實際標題是否與預期標題匹配。此外,日志將打印在控制臺上以顯示測試用例的狀態(tài)。在腳本結(jié)束時,我們退出了正在運行的瀏覽器會話。

要運行測試,請執(zhí)行以下命令:

?node first_test.js? 

在 pCloudy Browser Cloud 上使用 JavaScript 運行 Selenium 自動化測試

?pCloudy?是一個連續(xù)的云測試平臺,它提供了由真實 Windows 和 Mac 機器支持的大量瀏覽器組合。瀏覽器平臺被命名為瀏覽器云,其中所有遠程機器都托管在云上,以便我們在不同的環(huán)境(即不同的瀏覽器、多個瀏覽器版本和不同的操作系統(tǒng))上利用和運行我們的自動化測試。

?Browser Cloud? 還提供對這些云托管機器上的 Web 應(yīng)用程序的手動測試。如果你的自動化測試在特定環(huán)境中失敗,你只需從 ?pCloudy UI? 中選擇相同的環(huán)境,就可以在 ?pCloudy ?上的相同環(huán)境中手動運行該測試。

現(xiàn)在,讓我們快速瀏覽下面基于 JavaScript 的 Selenium 腳本,該腳本將用于在 ?pCloudy? 瀏覽器云上執(zhí)行跨瀏覽器測試:

const webdriver = require('selenium-webdriver');
 
var id = 'ramit.dhamija@gmail.com';
var accessKey = '5TfF4UcNRbN3JhucQ';
 
function verifyHomePageTitle() {
 
    const capabilities = {
    pCloudy_Username: id,
    apiKey: accessKey,
    clientName: id,
    email: id,
      os: 'Mac',
    osVersion: 'Catalina',
      browserName: 'safari',
      browserVersions: '14',
      pCloudy_EnableVideo: true,
      pCloudy_EnablePerformanceData: true,
      pCloudy_EnableDeviceLogs: true
        
    }
 
    const gridUrl =        'https://prod-browsercloud-in.pcloudy.com/seleniumcloud/wd/hub';
 
    const driver = new webdriver.Builder()
        .usingServer(gridUrl)
        .withCapabilities(capabilities)
        .build();
     
    driver.get('http:/www.pCloudy.com').then(function(){
    driver.getTitle().then(title=>{
     
        if(title.localeCompare("Mobile App Testing, Continuous Testing  Cloud, Mobile Testing 
        Tools | pCloudy")){
            console.log("Test Passed!")
        }else{
            console.log("Test Failed!")
        }
     })
  });
}
verifyHomePageTitle();

代碼演示:

由于我們現(xiàn)在在 Selenium Grid 上運行我們的自動化測試,即?pCloudy Browser Cloud?,添加所需的功能來設(shè)置測試環(huán)境很重要。作為所需功能的一部分,我們傳遞了我們的 pCloudy 憑據(jù)(用戶名和 api 密鑰)以及真實測試機器的功能,例如“Mac”作為操作系統(tǒng)、“Catalina”作為操作系統(tǒng)版本、“safari”作為瀏覽器,“14”作為 safari 瀏覽器版本。此外,我們還使用 pCloudy 的一些內(nèi)置功能來捕獲測試視頻記錄、性能數(shù)據(jù)和日志。 

為了在 pCloudy Selenium 網(wǎng)格上運行我們的測試,我們定義了 selenium 網(wǎng)格 URL。此外,我們已經(jīng)編寫了與上述腳本相同的測試場景的腳本。

pCloudy 輸出:

要查看測試的當前運行狀態(tài),你需要定向到?pCloudy 設(shè)備頁面?并單擊報告-> 我的活動會話:

要查看迄今為止執(zhí)行的所有測試,請直接轉(zhuǎn)到?pCloudy 設(shè)備頁面?并單擊“報告”->“所有報告”:

要查看特定測試的日志和快照,請直接轉(zhuǎn)到?pCloudy 設(shè)備頁面?并單擊“報告”->“所有報告”并根據(jù)需要對特定會話名稱執(zhí)行操作,其日志和屏幕截圖:

結(jié)論

利用 pCloudy 等基于云的測試平臺是自動化測試工作的關(guān)鍵。由于 Selenium 和 JavaScript 都是一些最流行的自動化測試系統(tǒng),因此使用它們跨設(shè)備運行您的應(yīng)用程序測試腳本對于更快地發(fā)布高質(zhì)量的應(yīng)用程序變得更加重要。自動化一直是企業(yè)更快開發(fā)和測試應(yīng)用程序的關(guān)鍵驅(qū)動因素。我們希望本指南能幫助大家盡快開始應(yīng)用程序的自動化之旅。測試愉快!


0 人點贊