Cypress+MeteorJS E2E测试异常：用户执行中自动登出

我之前在做Meteor应用的Cypress测试时，也碰到过一模一样的问题——手动操作完全正常，但测试跑起来就莫名登出，大概率是下面这几个原因导致的，咱们一个个来解决：

1. 测试用例的隔离性清空了认证状态 #

Cypress为了保证每个it测试用例的独立性，默认会在每个测试块执行前清除所有cookie、localStorage这类存储数据。你把登录逻辑放在单独的it('Can login')里，等后面的收藏、取消收藏测试执行时，之前的认证会话早就被清空了，自然就显示登出状态了，而手动测试是在同一个浏览器会话里操作，所以不会有这个问题。

解决办法： #

• 方案一：用before钩子统一完成登录
  把登录逻辑放到before里，这样整个测试套件只登录一次，所有后续的it块都会复用这个认证状态：

  describe('RouteCard', function() {
    before(function() {
      // 在所有测试开始前完成登录
      const testUsername = 'debtdrie'
      const testPassword = 'absenceearly-morning'
      cy.visit('http://localhost:3000/routes')
      cy.get('#loginform').within(() => {
        cy.get('[name="idcard"]').type(testUsername)
        cy.get('[name="password"]').type(testPassword)
        cy.get('.btn').click()
      })
      // 用断言确保登录真的完成，而不是靠固定等待
      cy.window().its('Meteor.user()').should('exist')
    })
  
    it('Renders Routes page', function() {
      cy.contains('Public Routes')
    })
  
    const getFavCount = user => user?.profile?.favorites?.length ?? 0
    it('Can favorite route', function() {
      let initialFavoriteCount
      cy.window().then(win => {
        initialFavoriteCount = getFavCount(win.Meteor.user())
      })
      cy.get('.is-not-favorite > .ion-ios-heart-outline').first().click()
      cy.window().then(win => {
        const newFavoriteCount = getFavCount(win.Meteor.user())
        expect(initialFavoriteCount + 1).to.equal(newFavoriteCount)
      })
    })
  
    it('Can unfavorite route', function() {
      let initialFavoriteCount
      cy.window().then(win => {
        initialFavoriteCount = getFavCount(win.Meteor.user())
      })
      cy.get('.is-favorite > .ion-ios-heart').first().click()
      cy.window().then(win => {
        const newFavoriteCount = getFavCount(win.Meteor.user())
        expect(initialFavoriteCount - 1).to.equal(newFavoriteCount)
      })
    })
  })
  

• 方案二：配置Cypress保留认证cookie
  如果你的测试需要更灵活的会话管理，可以在cypress.config.js里指定保留Meteor的认证cookie：

  module.exports = defineConfig({
    e2e: {
      // 保留指定的认证cookie，避免被清空
      cookies: {
        preserve: ['meteor_login_token'] // 这个是Meteor默认的登录token cookie名
      }
    }
  })
  

2. 固定等待时间不可靠，导致认证未完全生效 #

你代码里用cy.wait(1000)来等待登录完成，但网络请求的快慢是不确定的——有时候1秒足够，有时候可能因为环境原因，登录请求还没处理完，就进入了下一个测试，这时候客户端还没拿到认证状态，看起来就像登出了。

解决办法： #

把固定等待替换成基于断言的等待，确保登录操作真正完成后再继续：

// 替换原来的cy.wait(1000)
cy.window().its('Meteor.user()').should('exist')
// 或者等待页面上的登录状态标识出现，比如用户头像、用户名
cy.contains('debtdrie').should('be.visible')

3. Meteor反应式数据未同步导致的状态异常 #

Meteor的Meteor.user()是反应式数据，有时候你直接获取的时候，数据还没从服务器同步到客户端，拿到的是undefined，看起来就像是登出了。

解决办法： #

用Cypress的cy.wrap结合断言，等待反应式数据更新完成：

cy.window().then(win => {
  // 等待用户数据存在，并且收藏列表也存在
  cy.wrap(win.Meteor.user()).should('not.be.undefined')
  cy.wrap(win.Meteor.user()).its('profile.favorites').should('be.an', 'array')
}).then(user => {
  initialFavoriteCount = getFavCount(user)
})

先试试第一个方案（用before钩子统一登录），这个是最常见的原因，应该能直接解决你的问题。如果还有问题，再排查后面的等待时间和反应式数据同步的问题。

内容的提问来源于stack exchange，提问作者Fullhdpixel