How to set a token in localStorage before test in Cypress

当使用Cypress进行端到端测试时，处理身份验证是一个常见的任务。在某些情况下，应用程序可能会使用localStorage来存储令牌（token），用于维护用户的登录状态。在Cypress中设置localStorage可以在测试开始前模拟用户已经登录的状态，从而避开登录界面，直接测试应用程序的核心功能。

要在Cypress测试中设置localStorage，可以使用Cypress的cy.setLocalStorage()命令。这里有一个简单的例子展示如何在测试前设置令牌：

示例：

假设我们有一个应用程序，用户登录后会在localStorage中保存一个名为auth_token的令牌。我们需要在每个测试运行前设置这个令牌。

javascript
describe('用户仪表板测试', () => {
  beforeEach(() => {
    // 在每次测试前设置localStorage中的令牌
    cy.setLocalStorage('auth_token', 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ.SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c');
    
    // 确保在继续之前localStorage中的值已经设置好
    cy.getLocalStorage('auth_token').should('eq', 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiaWF0IjoxNTE2MjM5MDIyfQ.SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c');
    
    // 访问用户的仪表板页面
    cy.visit('/dashboard');
  });

  it('应该显示用户的专属数据', () => {
    cy.contains('您的数据').should('be.visible');
  });
});

在上述代码中，beforeEach 钩子函数确保在每个测试开始前，auth_token 都被设置在localStorage中。这样，当测试访问需要认证的页面（如用户仪表板）时，应用程序将识别这个令牌，并允许测试继续进行，无需手动登录。

这种方法提高了测试的效率和速度，因为它跳过了登录过程，直接进行主要功能的测试。此外，这还可以帮助我们在不同的测试用例中重用相同的登录状态，使得测试脚本更简洁、更易维护。