サイプレス- UIテストオートメーション-アクセス要素イントロ

6208 ワード
beginners qa testautomation javascript テキストリンク

違いは？

  • ジャバスクリプトのみ
  • (クロムのみ)not anymore!
  • モカのみ

  • これは速い!テストコード自体は、アプリケーションのコード自体と一緒にブラウザで実行するため.

    • セットアップ


    インストールの前提条件


    ノード。js


    端末とタイプをオープンしますnode --version - そして?
    ノードが見つからない場合はNode

    サイプレスを設置する


    NPM(JavaScriptのパッケージマネージャ)は、テストコードと同じフォルダーで、ローカルにパッケージをインストールします.まずmkdir [foldername] フォルダ.and cd [foldername] その中に.
    ランnpm init -y 得るpackage.jsonここでは、サイプレスがインストールされて登録することができます
    インストールnpm install cypress
    ランnpx cypress open
    今あなたのIDEでは、フォルダを見つけるでしょう、1つの例のテストの多くの統合です

    最初のテスト


    of Not-todo-List 私はherokuとstrapiで作成しました.遅れてごめんなさい-バックエンドにしばらく待ってください.
    「埃っぽい窓にペンキを塗らないでください」と、より重要に「サイプレス研究を延期してください」を加えましょう.
  • 統合フォルダに移動し、例2を削除します.クリエイトアnottodoList.spec.js ファイル.
  • コード自動補完サポート/// <reference types="cypress" /> ページの上に.
  • テストを書くit 関数.
    • /// <reference types="cypress" />
it('should navigate to the Not-Todo App', () => {
  cy.visit('https://aquin-todolist.netlify.app/')
})
    走るnpx cypress open
  • it 2つのパラメタを受け入れます:テストの名前とテストコードでのストリングとコールバック機能.
  • it オブジェクトの使用cy + 訪問メソッドを使用して
    • 失敗するようにしましょう-良いエラー処理があります.

    目的は、テスト中のウェブサイトで行わ物事を得るためにターゲットを



    IDEで過去に

    加える.type() 直後にコマンド.get

    あった!

    安定性のために遅れを加える


    .get functionは、2番目のパラメータtimeoutを持ちます.入力を取得するまで待ちます.
    cy.get('input', {timeout: 6000}).type('paint flowers on dusty windows')
    追加をクリックしてリストにnotodoを追加します.

    入力を得る

  • is . visit ()は、ページがテキスト/HTMLコンテンツを200ステータスコードで送信することを期待します.
  • request . request ()はリモートサーバが存在し、応答を提供します.
  • Cy . container ()は、DOMに最終的にコンテンツが存在する要素を期待します.
  • ci . get ()は、DOMに要素が最終的に存在することを期待します.
  • .find ()は、DOMに要素が最終的に存在することを期待します.
  • .type ()は、要素が最終的に型指定可能な状態になることを期待します.
  • .click ()は、要素が最終的にactionableな状態になることを期待します.
  • .is ()は、最終的に現在のオブジェクトにプロパティを見つけます.

    • CSSセレクタ

    cy.get('textarea.post-body')

    テキストコンテンツ

    cy.contains("nichts überlegen")

    要素との相互作用

    cy.get('textarea.post-body').type('This is an excellent post.')
  • .type () -入力を入力します.
  • .blur () -フォーカスDOM要素のぼかしを作成します.
  • .focus () - DOM要素にフォーカスします.
  • .clear () -入力またはtextareaの値をクリアする
  • .check () -チェックボックス( es )またはラジオ( s )をチェックします.
  • .uncheck () -チェックボックス( es )をチェックします.
  • .select () - aを選択します.
  • .dblickick ()- DOM要素をダブルクリックします.
  • .RightClick ()- DOM要素を右クリックします.

    • 主張する


      .should('have.class', 'active')
  .and('have.attr', 'href', '/users')
    Actions on Google、Actions SDKのサンプルアプリを実行してみた
    [nodeJS編]nodeJSの02-モジュール詳細