cy.intercept
APIが実行されていることを担保できる。以下のように使うことでAPIの実行を同期的に待つことができます。
|
1 2 |
cy.intercept('HTTPメソッド','リクエストURL').as('命名'); cy.wait("@命名したAPI") |
cy.visit
対象のURLにアクセスする。Cypressの設定でbaseURLを設定するとURL指定が楽になる。（ベストプラクティスと書かれている。）
https://docs.cypress.io/guides/references/best-practices#Setting-a-global-baseUrl
cy.get
要素の取得ができます。
|
1 |
cy.get('#app') |
親要素の取得
子要素の要素をgetで取得してparentを使います。
|
1 |
cy.get('.child').parent() |
フォーム要素操作
テキストに値を入力
|
1 |
cy.get('#text').type('こんにちは') |
テキスト要素のクリア
|
1 |
cy.get('text').clear() |
チェックボックスのチェック
|
1 |
cy.get('[value="check_1"]').check() |
ラジオボタンの選択
|
1 |
cy.get('[type="radio"]').first().check() |
firstでラジオボタンの最初の要素を選択することができます。
ボタンをクリック
|
1 |
cy.get('#button').click() |
アサーション
should()
アサーションの一つです。もちろん、visitやclickなど他のAPIでもアサーションはできます(デフォルトアサーション）が、
|
1 |
cy.get('id名など').should("have.value", "hogehoge"); |
not.be.visible
DOMは存在するが「display:none」などのプロパティが指定されている要素などのチェックに使えます。
not.exist
DOM自体が存在しないことのチェックができます。例えば、Reactの条件分岐でDOM自体を消す場合の判定などに使えます。
have.class
CSSのclassの内容をチェックできます。
have.length
要素の個数などをチェックできます。例えば、「children()」などで子要素の個数などを判定するのに使えます。
.contains('値')
要素に値が含まれているか判定します。
この記事へのコメントはありません。