なんだかGoodVibes

日々の勉強メモです。

【Cypress】フォーカスインされている要素を取得する(focused)

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

概要

フォーカスインされている要素を取得したい。

フォーカスの操作を行う方法については
以下の記事を参照してください。

【Cypress】フォーカスイン・アウトのチェックを行う(focus、blur) - なんだかGoodVibes


テンプレート

html

<input type="text" id="txt1" class="text1">
<input type="text" id="txt2" class="text2">
<input type="text" id="txt3" class="text3">

javascript

const txt2 = document.getElementById('txt2')
txt2.focus();

idがtxt2の要素にフォーカスインしています。


Cypress

input textの要素内でフォーカスインしている要素を検索し、
期待しているクラスが設定されているかチェックします。

describe('サンプル', () => {
    it('テストパターン', () => {
        cy.visit('/')

        cy.get('input[type="text"]')
          .focused()
          .should('have.class', 'text2')
    })
})

対象の要素.focused()で
フォーカスされている要素の検索ができます。



以上です。