【Cypress】テストコードの書き方の基本

こんにちは。
本日はCypressについてのメモです。

概要

Cypressの書き方の基本と、
URLへアクセスについて。

Cypressのインストールについては以下の記事を参照してください。

nandakagoodvibes.hatenablog.com

テストコードの書き方

テストコードの開始はdescribeです。
その中にテストパターンを記載します。 テストパターンはitで始めます。

describe('テスト名', () => {
    it('テストパターン1', () => {
        // チェック1
        // チェック2
        // チェック3
              ...
    })
})

対象URLへのアクセス

画面へアクセスするための設定をします。
ベースURLはcypress.jsonに設定します。

{
    "baseUrl": "http://localhost:8080"
}

以下の記載で、上記で設定したbaseUrlへアクセスができます。

describe('テスト名', () => {
    it('テストパターン1', () => {
        cy.visit('/')
           ...
    })
})

baseUrlに設定を行っていない場合、
もしくは設定したURLを異なるURLを対象としたい場合は以下でもOKです。

describe('テスト名', () => {
    it('テストパターン1', () => {
        cy.visit('http://localhost:8080')
           ...
    })
})

テストのスキップと特定のテストのみの実行

テストパターンのスキップを行う場合は、
itをit.skipに書き換えます。

describe('テスト名', () => {
    // テストパターン1がスキップされる
    it.skip('テストパターン1', () => {
        // チェック1
              ...
    })

    it('テストパターン2', () => {
        // チェック1
              ...
    })
})

特定のテストパターンだけ実行したい場合は、
itをit.onlyに書き換えます。

describe('テスト名', () => {
    // テストパターン1のみが実行される
    it.only('テストパターン1', () => {
        // チェック1
              ...
    })

    it('テストパターン2', () => {
        // チェック1
              ...
    })
})

以上です。