CodeceptJS下載 - CodeceptJS源代碼下載

CodeceptJS

其他源碼

3.6.10

下載

構建狀態：

Appium Helper：

網絡助手：

codeceptjs

參考：幫助者API

增壓E2E測試

CodeCeptJS是一個新的測試框架，用於使用WebDriver（或其他）進行端到端測試。它將瀏覽器交互作用抽象為從用戶的角度編寫的簡單步驟。一個簡單的測試驗證網站主頁上存在“歡迎”文本的簡單測試將看起來像：

 Feature ( 'CodeceptJS demo' ) ;

Scenario ( 'check Welcome page on site' , ( { I } ) => {
  I . amOnPage ( '/' ) ;
  I . see ( 'Welcome' ) ;
} ) ;

CodeCeptJS測試是：

同步。您不需要關心線性的回調或承諾或測試場景。但是，您的測試應該是線性的。
從用戶的角度寫。每個動作都是I的方法。這使得測試易於閱讀，寫作和維護，甚至針對非技術人員。
後端API不可知論。我們不知道哪個WebDriver實現正在運行此測試。

codeceptjs使用助手模塊為I對象提供動作。目前，CodeCeptjs有這些幫助者：

劇作家- 是一個節點庫，可自動使用單個API自動化鉻，Webkit和Firefox瀏覽器。
Puppeteer-使用Google Chrome的Puppeteer進行快速無頭測試。
WebDriver-使用WebDriverio通過WebDriver或DevTools協議運行測試。
TestCafe-便宜且快速的跨瀏覽器測試自動化。
Appium-用於Appium的移動測試
排毒- 這是排毒庫頂上的包裝器，旨在統一CodeCeptJS框架的測試經驗。排毒為移動應用程序提供了一個灰色的盒子測試，對於React Native Apps來說特別好。

還有更多...

為什麼要codeceptjs？

CodeCeptJS是CodeCeption的繼任者，CodeCeption是PHP流行的全堆棧測試框架。使用CodeCeptJS，您的方案驅動功能和接受測試將盡可能簡單清潔。您不必擔心Nodejs的異步性質或劇作家，硒，木偶，Testcafe等的各種API，因為CodeCeptjs將它們統一併使其使其同步時起作用。

特徵

？具有GPT功能的AI驅動功能，可幫助和治愈失敗測試。
☕基於摩卡摩卡測試框架。
專為BDD風格的方案驅動接受測試而設計。
無需轉介劑就本地使用ES6。
也可以與打字稿一起播放。
</>智能定位器：使用名稱，標籤，匹配的文本，CSS或XPATH定位元素。
交互式調試外殼：在任何時候暫停測試，並在瀏覽器中嘗試不同的命令。
輕鬆使用CLI Generators創建測試，PageObject，StepObject。

安裝

npm i codeceptjs --save

移動到要存儲測試（和CodeCeptJs配置）的目錄，並執行：

npx codeceptjs init

創建和配置測試環境。如果您需要編寫Selenium WebDriver測試，建議從助手列表中選擇WebDriver。

之後，通過執行來創建您的第一個測試：

npx codeceptjs generate:test

現在創建測試，可以執行

npx codeceptjs run

如果要使用Typescript編寫測試，則僅通過執行來生成標準類型定義：

npx codeceptjs def .

稍後，您甚至可以自動更新類型的定義，以包括您自己的自定義幫助者方法。

筆記：

CodeCeptJS需要Node.js版本12+或更高版本。

用法

通過示例學習CodeCeptJ。假設我們已經安裝了CodeCeptJ並啟用了WebDriver Helper。

基礎

讓我們看看如何處理基本表單測試：

 Feature ( 'CodeceptJS Demonstration' ) ;

Scenario ( 'test some forms' , ( { I } ) => {
  I . amOnPage ( 'http://simple-form-bootstrap.plataformatec.com.br/documentation' ) ;
  I . fillField ( 'Email' , '[email protected]' ) ;
  I . fillField ( 'Password' , secret ( '123456' ) ) ;
  I . checkOption ( 'Active' ) ;
  I . checkOption ( 'Male' ) ;
  I . click ( 'Create User' ) ;
  I . see ( 'User is valid' ) ;
  I . dontSeeInCurrentUrl ( '/documentation' ) ;
} ) ;

所有動作均由I對象執行；斷言功能從see函數開始。在這些示例中，所有I的方法均來自WebDriver Helper，請參閱參考以了解如何使用它們。

讓我們使用run命令執行此測試。附加選項--steps將向我們展示運行過程。我們建議在開發過程中使用--steps或--debug 。

npx codeceptjs run --steps

這將產生一個輸出：

CodeceptJS Demonstration --
 test some forms
 • I am on page " http://simple-form-bootstrap.plataformatec.com.br/documentation "
 • I fill field " Email " , " [email protected] "
 • I fill field " Password " , " **** "
 • I check option " Active "
 • I check option " Male "
 • I click " Create User "
 • I see " User is valid "
 • I dont see in current url " /documentation "
 ✓ OK in 17752ms

CodeCeptJS具有最終功能，可幫助您開發和調試測試。您可以在任何位置暫停測試執行，並使用交互式殼來嘗試不同的操作和定位器。只需在測試中的任何位置添加pause()調用並運行。

可以通過運行以外的測試上下文啟動交互式外殼：

npx codeceptjs shell

動作

我們用fillField方法填充表格，該方法通過其標籤位於表單元素。您可以在測試中通過名稱， CSS或XPath定位器找到元素的方式相同：

 // by name
I . fillField ( 'user_basic[email]' , '[email protected]' ) ;
// by CSS
I . fillField ( '#user_basic_email' , '[email protected]' ) ;
// don't make us guess locator type, specify it
I . fillField ( { css : '#user_basic_email' } , '[email protected]' ) ;

其他方法，例如checkOption ，並以類似的方式click工作。他們可以使用標籤，CSS或XPATH定位器來查找要交互的元素。

斷言

斷言從see或dontSee前綴開始。在我們的情況下，我們聲稱字符串“用戶是有效的”在網頁中的某個地方。但是，我們可以通過提供第二個參數將搜索範圍縮小到特定元素：

 I . see ( 'User is valid' ) ;
// better to specify context:
I . see ( 'User is valid' , '.alert-success' ) ;

在這種情況下，只有CSS .alert-success位於位置的內部元素中，才會搜索“用戶有效”字符串。

搶劫者

如果您需要從網頁返回值並將其直接在測試中使用，則應使用具有grab前綴的方法。預計它們將在async/await功能中使用，它們的結果將在測試中可用：

 Feature ( 'CodeceptJS Demonstration' ) ;

Scenario ( 'test page title' , async ( { I } ) => {
  I . amOnPage ( 'http://simple-form-bootstrap.plataformatec.com.br/documentation' ) ;
  const title = await I . grabTitle ( ) ;
  I . expectEqual ( title , 'Example application with SimpleForm and Twitter Bootstrap' ) ; // Avaiable with Expect helper. -> https://codecept.io/helpers/Expect/
} ) ;

您可以以相同的方式獲取文本，屬性或形式值，並在下一測試步驟中使用它們。

之前/之後

可以在用戶中登錄的通用準備步驟，例如在用戶中登錄，可以放置在或Background Before ：

 const { I } = inject ( ) ;

Feature ( 'CodeceptJS Demonstration' ) ;

Before ( ( ) => { // or Background
  I . amOnPage ( 'http://simple-form-bootstrap.plataformatec.com.br/documentation' ) ;
} ) ;

Scenario ( 'test some forms' , ( ) => {
  I . click ( 'Create User' ) ;
  I . see ( 'User is valid' ) ;
  I . dontSeeInCurrentUrl ( '/documentation' ) ;
} ) ;

Scenario ( 'test title' , ( ) => {
  I . seeInTitle ( 'Example application' ) ;
} ) ;

PageObjects

CodeCeptJS提供了在測試中創建和使用頁面對象的最簡單方法。您可以通過運行創建一個

npx codeceptjs generate pageobject

它將為您創建一個頁面對象文件，並將其添加到配置中。假設我們創建了一個名為docsPage ：

 const { I } = inject ( ) ;

module . exports = {
  fields : {
    email : '#user_basic_email' ,
    password : '#user_basic_password'
  } ,
  submitButton : { css : '#new_user_basic input[type=submit]' } ,

  sendForm ( email , password ) {
    I . fillField ( this . fields . email , email ) ;
    I . fillField ( this . fields . password , password ) ;
    I . click ( this . submitButton ) ;
  }
}

您可以通過在測試參數中提供其名稱來輕鬆注入測試：

 Feature ( 'CodeceptJS Demonstration' ) ;

Before ( ( { I } ) => { // or Background
  I . amOnPage ( 'http://simple-form-bootstrap.plataformatec.com.br/documentation' ) ;
} ) ;

Scenario ( 'test some forms' , ( { I , docsPage } ) => {
  docsPage . sendForm ( '[email protected]' , '123456' ) ;
  I . see ( 'User is valid' ) ;
  I . dontSeeInCurrentUrl ( '/documentation' ) ;
} ) ;

使用TypeScript時，將module.exports替換為自動完成的export 。

貢獻

貢獻指南
行為守則

貢獻者

_Davertmik	_Kobenguyent	_Vorobeyko	_Reubenmiller
_阿赫爾	_apshenkin	_法比奧爾	_Pablopaul
_米拉	_{喬治格里夫}	_kmkoushik	_Nikocanvacom
_Elukoyanov	_托馬索恩	_Gkushang	_Tsuemura
_Egorbodnar	_維卡爾普	_Elaichenkov	_Borisosipov
_Ngraf	_Nitschsb	_Hubidu	_jploskonka
_Maojunxyz	_{Abhimanyupandian}	_馬托莫	_Hatufacci