CodeceptJS
3.6.10
ステータスの構築：
Appiumヘルパー：
Webヘルパー：
参照：ヘルパーAPI
CodeCeptJSは、WebDriver（またはその他）を使用したエンドツーエンドテストの新しいテストフレームワークです。ユーザーの観点から書かれた単純な手順へのブラウザの相互作用を抽象化します。サイトのメインページに「ウェルカム」テキストが表示される簡単なテストは次のようになります。
Feature ( 'CodeceptJS demo' ) ;
Scenario ( 'check Welcome page on site' , ( { I } ) => {
I . amOnPage ( '/' ) ;
I . see ( 'Welcome' ) ;
} ) ;codeceptjsテストは次のとおりです。
Iの方法です。これにより、テストは非テクノロジーの人でも読み取り、書き込み、保守が簡単になります。 CodeCeptJSは、ヘルパーモジュールを使用して、 Iオブジェクトにアクションを提供します。現在、codeceptjsにはこれらのヘルパーがあります。
そしてもっと来る...
Codeceptjsは、PHPの人気のあるフルスタックテストフレームワークであるCodeceptionの後継者です。 CodeCeptJSを使用すると、シナリオ駆動型の機能テストと受け入れテストは、可能な限りシンプルでクリーンになります。 nodejsの非同期性や、劇作家、セレン、操り人形師、テストカフェなどのさまざまなAPIについて心配する必要はありません。
npm i codeceptjs --saveテスト（およびcodeceptjs config）を保存したいディレクトリに移動し、実行します。
npx codeceptjs initテスト環境を作成および構成します。 Selenium WebDriverテストを作成する必要がある場合は、ヘルパーのリストからWebDriverを選択することをお勧めします。
その後、実行して最初のテストを作成します。
npx codeceptjs generate:testこれでテストが作成され、で実行できます
npx codeceptjs runTypeScriptを使用してテストを書きたい場合は、実行して標準タイプの定義を生成するだけです。
npx codeceptjs def .後で、タイプ定義を自動的に更新して、独自のカスタムヘルパーメソッドを含めることもできます。
注記：
12+以降が必要です。 例でcodeceptjsを学びます。 CodeCeptJSがインストールされ、WebDriverヘルパーが有効になっていると仮定しましょう。
基本的なフォームテストをどのように処理できるか見てみましょう。
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ヘルパーから取られています。それらの使用方法を学ぶための参照を参照してください。
このテストを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 Methodで埋めました。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で始まります。私たちの場合、String 'ユーザーは有効であることがWebページのどこかにあると主張しています。ただし、2番目のパラメーターを提供することにより、検索を特定の要素に絞り込むことができます。
I . see ( 'User is valid' ) ;
// better to specify context:
I . see ( 'User is valid' , '.alert-success' ) ;この場合、「ユーザーは有効な」文字列は、CSS .alert-successによって配置されている要素内でのみ検索されます。
Webページから値を返し、テストで直接使用する必要がある場合は、 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/
} ) ;同じ方法で、テキスト、属性、またはフォーム値を取得して、次のテスト手順でそれらを使用できます。
Webページを開く、ユーザーにログインするなどの一般的な準備手順は、 BeforeまたはBackgroundに配置できます。
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' ) ;
} ) ; CodeCeptJSは、テストでページオブジェクトを作成および使用する最も簡単な方法を提供します。実行して作成できます
npx codeceptjs generate pageobjectこれにより、ページオブジェクトファイルが作成され、構成に追加されます。 docsPageという名前の1つを作成したと仮定しましょう。
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 | ニコカンバコム |
エルコヤノフ | トマショーン | gkushang | ツエムラ |
エゴルボドナー | Vikalpp | Elaichenkov | ボリソシポフ |
ngraf | nitschsb | Hubidu | Jploskonka |
Maojunxyz | Abhimanyupandian | マルトモ | hatufacci |
MIT©CodeCeptJSチーム
