如何在多个赛普拉斯测试中使用 cookie？

Question

我正在使用cypress 来测试我的注册和登录表单。我想在我的register.js 测试中设置cookie，然后在我的login.js 测试中使用它们。

我将 cookie 保存在 cypress/support/index.js 中：

Cypress.Cookies.defaults({
  preserve: ['test_email', 'test_password'],
});

我的 register.js 测试如下所示：

describe('Create new account', () => {
  it('Visit Register', () => {
    cy.visit(Cypress.env('URL_REGISTER'));

    cy.setCookie('test_email', 'fake@email.com');
    cy.setCookie('test_password', 'abc123');
  });

  it('Fill out register form', async () => {
    const email = await cy.getCookie('test_email');
    const password = await cy.getCookie('test_password');

    cy.get('[data-cy="register-email"]').type(email.value);
    cy.get('[data-cy="register-password"]').type(password.value);
  });
});

当我运行这个测试时，我得到这个错误：

无法读取未定义的属性“值”

我知道cy.getCookie() 返回一个对象并且是异步的，这就是我尝试使用await 的原因，但由于某种原因，这似乎不起作用。如何在多个 cypress 测试中设置和获取 cookie？

Answer 1

使用Cypress.preserveOnce() 或beforeEach() 为所有测试保留测试之间的cookie。

beforeEach(() => {
  Cypress.Cookies.preserveOnce('test_email')
})

it('set cookie', async () => {
  cy.setCookie('test_email', 'fake@email.com')
})

it('once', async () => {
  const email = await cy.getCookie('test_email')
  expect(email).to.have.property('value', 'fake@email.com')  // passes
})

it('twice', async () => {
  const email = await cy.getCookie('test_email')
  expect(email).to.have.property('value', 'fake@email.com')  // passes
})

it('thrice', async () => {
  const email = await cy.getCookie('test_email')
  expect(email).to.have.property('value', 'fake@email.com')  // passes
})

---

您应该坚持使用 getCookie 的文档化方式。

如果我跑步

const email = await cy.getCookie(...)

在cy.visit() 之后，我得到未定义。

如果我使用

cy.getCookie(...).then(...) 

在下一行获取值。

由于赛普拉斯没有在任何地方记录 await 语法，您可能会得到一些不稳定的结果。

标准模式是：

it('once', () => {
  cy.getCookie('test_email').then(email => {
    expect(email).to.have.property('value', 'fake@email.com')  // passes
  })
})

---

如果您在 CI 中运行测试，它们可能会并行运行，因此最好在 before() 或 beforeEach() 中设置Cookie。

before(() => {
  cy.setCookie('test_email', 'fake@email.com')
})

beforeEach(() => {
  Cypress.Cookies.preserveOnce('test_email')
})

it('uses cookie once', () => {
  ...
})

it('uses cookie twice', () => {
  ...
})

it('uses cookie thrice', () => {
  ...
})