web-dev-qa-db-ja.com

サイプレスを使用して存在しない可能性のある要素を確認する方法

ウェブサイトにログインするためのサイプレステストを書いています。ユーザー名とパスワードのフィールドと送信ボタンがあります。ほとんどの場合、ログインは簡単ですが、警告ダイアログが最初に表示され、閉じる必要があります。

私はこれを試しました：

    cy.get('#login-username').type('username');
    cy.get('#login-password').type(`password{enter}`);

    // Check for a possible warning dialog and dismiss it
    if (cy.get('.warning')) {
        cy.get('#warn-dialog-submit').click();
    }

警告が表示されない場合にテストが失敗することを除いて、これは正常に機能します。

CypressError: Timed out retrying: Expected to find element: '.warning', but never found it.

次に、これを試しましたが、警告が十分に速く表示されないため失敗し、Cypress。$は何も見つかりません。

    cy.get('#login-username').type('username');
    cy.get('#login-password').type(`password{enter}`);

    // Check for a possible warning dialog and dismiss it
    if (Cypress.$('.warning').length > 0) {
        cy.get('#warn-dialog-submit').click();
    }

要素の存在を確認する正しい方法は何ですか？要素が見つからない場合でも文句を言わないcy.getのようなものが必要です。

automated-testscypress
19
Charles Anderson

DOM要素に対して条件付きテストを実行しようとすると、さまざまな欠点があり、サイプレスにはさまざまな回避策があります。これはすべて、サイプレスのドキュメントの 条件付きテスト で詳しく説明されています。

実行しようとしていることを実行する方法は複数あるため、ドキュメント全体を読んで、アプリケーションとテストのニーズに最適なものを決定することをお勧めします。

5
Jennifer Shehane
export function clickIfExist(element) {
    cy.get('body').then((body) => {
        if (body.find(element).length > 0) {
            cy.get(element).click();
        }
    });
}
3
Ran Adler

私はそれを純粋なjsで行いました。

 cy.get('body').then((jqBodyWrapper) => {

                if (jqBodyWrapper[0].querySelector('.pager-last a')) {
                    cy.get('.pager-last a').then(jqWrapper => {
                        // hardcoded due to similarities found on page

                        const splitLink = jqWrapper[0].href.split("2C");
                        AMOUNT_OF_PAGES_TO_BE_RETRIEVED = Number(splitLink[splitLink.length - 1]) + 1;
                    })
                } else {
                    AMOUNT_OF_PAGES_TO_BE_RETRIEVED = 1;
                }
            });

ボディに要素が存在するかどうかを確認しようとしています

cy.get('body').then((jqBodyWrapper) => {

純粋なjs querySelector

if (jqBodyWrapper[0].querySelector('.pager-last a')) {

次に、cy.getを起動します

cy.get('.pager-last a').then(jqWrapper => {
0
Patryk Janik