web-dev-qa-db-ja.com

サイプレスのテスト全体でcookie / localStorageセッションを保持する

cy.request()で設定されたcookieまたはlocalStorageトークンを保存/永続化/保存したいので、すべてのテストでカスタムコマンドを使用してログインする必要はありません。これは、クライアントのlocalStorageに保存されているjwt(json Webトークン)のようなトークンで機能するはずです。

12
bkucera

サイプレスから docs

永続的なCookieの場合:デフォルトでは、サイプレスは各テストの前にすべてのCookieを自動的にクリアして、状態が構築されないようにします。

Cypress.Cookies apiを使用して、特定のCookieをホワイトリストに登録し、テスト全体で保持することができます。

// now any cookie with the name 'session_id' will
// not be cleared before each test runs
Cypress.Cookies.defaults({
  whitelist: "session_id"
})

永続的なlocalStorageの場合:ATMに組み込まれていませんが、ローカルストレージをクリアするメソッドがCypress.LocalStorageとして公開されているため、今すぐ手動で実現できます。晴れ。

このメソッドをバックアップし、送信されたキーに基づいてオーバーライドできます。

const clear = Cypress.LocalStorage.clear

Cypress.LocalStorage.clear = function (keys, ls, rs) {
  // do something with the keys here
  if (keys) {
    return clear.apply(this, arguments)
  }

}
15
bkucera

このスレッドを更新するために、(@ bkuceraによる)cookieを保存するためのより良いソリューションがすでにあります。しかし、現在、テスト間でローカルストレージを保存および復元するための回避策があります(必要な場合)。私は最近この問題に直面しました。このソリューションが機能していることがわかりました。

この解決策は、ヘルパーコマンドを使用してテスト内で使用することです。

内側-cypress/support/<some_command>.js

let LOCAL_STORAGE_MEMORY = {};

Cypress.Commands.add("saveLocalStorage", () => {
  Object.keys(localStorage).forEach(key => {
    LOCAL_STORAGE_MEMORY[key] = localStorage[key];
  });
});

Cypress.Commands.add("restoreLocalStorage", () => {
  Object.keys(LOCAL_STORAGE_MEMORY).forEach(key => {
    localStorage.setItem(key, LOCAL_STORAGE_MEMORY[key]);
  });
});

次にテストで、

beforeEach(() => {
  cy.restoreLocalStorage();
});

afterEach(() => {
  cy.saveLocalStorage();
});

参照: https://github.com/cypress-io/cypress/issues/461#issuecomment-392070888

11

ここに私のために働いた解決策があります:

 Cypress.LocalStorage.clear = function (keys, ls, rs) {
    return;
 before(() => {
    LocalStorage.clear();
    Login();
  })

Cookieクリアの制御はサイプレスでサポートされています: https://docs.cypress.io/api/cypress-api/cookies.html

0
Leo Davtyan

ここにあなたのような私の問題を解決する便利なリンクがあります: 複数のテストを通じてCookieを保持する

私のコードのような:

const login = () => {
    cy.visit('http://0.0.0.0:8080/#/login');
    cy.get('#username').type('username');
    cy.get('#password').type('1234password$');
    cy.get('#login-button').click();
}

describe('UI', () => {
  // beforeEach(login);
    beforeEach(() => {
        login();
        Cypress.Cookies.preserveOnce('session_id', 'remember_token');
  });

});

願っています。

0
li xin

独自のログインコマンドをサイプレスに追加し、 cypress-localstorage-commands パッケージを使用して、テスト間でlocalStorageを永続化できます。

support/commands

import "cypress-localstorage-commands";

Cypress.Commands.add('loginAs', (UserEmail, UserPwd) => {
  cy.request({
    method: 'POST',
    url: "/loginWithToken",
    body: {
      user: {
        email: UserEmail,
        password: UserPwd,
      }
    }
  })
    .its('body')
    .then((body) => {
      cy.setLocalStorage("accessToken", body.accessToken);
      cy.setLocalStorage("refreshToken", body.refreshToken);
    });
});

テストの内部:

describe("when user FOO is logged in", ()=> {
  before(() => {
    cy.loginAs("[email protected]", "fooPassword");
    cy.saveLocalStorage();
  });

  beforeEach(() => {
    cy.visit("/your-private-page");
    cy.restoreLocalStorage();
  });

  it('should exist accessToken in localStorage', () => {
    cy.getLocalStorage("accessToken").should("exist");
  });

  it('should exist refreshToken in localStorage', () => {
    cy.getLocalStorage("refreshToken").should("exist");
  });
});
0
Javier Brea

GoogleトークンCookieを保持するために、cypress-social-loginというライブラリがあります。
他のOAuthプロバイダーがマイルストーンとしてあるようです。
これはサイプレスチームによって推奨されており、サイプレスプラグインページにあります。

https://github.com/lirantal/cypress-social-logins

このサイプレスライブラリを使用すると、GitHub、Google、Facebookなどのサービスに対してサードパーティログイン(oauthなど)を実行できます。

これは、ログインプロセスを、ログインを実行し、テスト中のアプリケーションのCookieを返すパペットフローに委任することで行われます。これにより、テストの期間中、サイプレスフローの呼び出しによってCookieを設定できます。

0
Gal Margalit