【Cypress】指定した内容が含まれているかチェックする(contains)

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

概要

対象の内容が、指定したターゲットに含まれているか
チェックしたい。

テンプレート

タイトルと簡単な一覧を用意します。

html

<div id="item-area">
    <p class="item-title">季節のフルーツ一覧</p>
    <ul>
        <li>みかん</li>
        <li>メロン</li>
        <li>いちご</li>
    </ul>
</div>

Cypress

以下のチェックを行う。

• タイトルに「季節のフルーツ」が含まれていること
• 一覧に「メロン」が含まれていること

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

        cy.get('.item-title').contains('季節のフルーツ')
        cy.get('#items').contains('メロン')
    })
})

特定の要素に対しても、大きな範囲に対しても
containsは使用することができます。

以上です。