なんだかGoodVibes

日々の勉強メモです。

【Cypress】andを使用して複数のチェックを行う

Cypress

こんにちは。
本日はCypressメモです。

概要

連続でチェックを行うとき、
shouldの代わりにandを使用できるようなので
試してみる。


テンプレート

<body>
    <div style="text-align:center;">
        <div class='text-area'>
            <input id="txt1" type="text" class="text-class" maxlength="10" value="HELLO">
        </div>
    </div>
</body>


Cypress

以下のチェックを行う。

  • 表示であること(非表示でないこと)
  • 値が「HELLO」であること
  • classに「text-class」が設定されていること
describe('サンプル', () => {
    it('テストパターン', () => {
        cy.visit('/')

        cy.get('#txt1')
          .should('be.visible')
          .and('have.value', 'HELLO')
          .and('have.class', 'text-class')
    })
})

2つ目以降のチェックをandで記載することで
連続でチェックを行うことができました。

もちろん、andの部分をshouldと記載しても動作します。

andを最初に記載するとエラーになるので注意です。
(以下のような書き方はNG)

cy.get('#txt1')
  .and('be.visible')



以上です。