Angular NX项目E2E测试如何访问环境变量实现多登录方式验证

E2E测试运行在独立的Node进程中，和浏览器内运行的Angular应用完全隔离，Angular的依赖注入是应用运行时的能力，E2E测试无法直接调用应用内的注入器获取environment配置，你可以选择以下两种常用方案实现需求：

方案1：直接导入同一份环境文件 #

你的项目中environment.ts本身是普通的TS导出对象，只要配置正确的相对路径，就可以在E2E测试文件中直接导入使用，和你应用内使用的是完全相同的配置，无需额外改造现有逻辑：

// 调整为你主应用环境文件对应的相对路径即可
import { environment } from '../../your-main-app/src/environments/environment';

describe('Login Page', () => {
  it('Login should succeed', () => {
    if (environment.authType === 'password') {
      // 密码登录测试逻辑
    } else if (environment.authType === 'oauth') {
      // oauth登录测试逻辑
    }
  });
});

NX运行不同环境的E2E测试时，会自动替换对应环境的环境文件（如environment.prod.ts），无需额外配置。

方案2：通过NX测试注入环境变量 #

适合多应用统一配置、需要动态切换配置的场景，你可以在项目的project.json中给E2E运行命令注入自定义环境变量：

// 对应应用的e2e target配置
{
  "targets": {
    "e2e": {
      "executor": "@nx/cypress:cypress",
      "options": {
        "cypressConfig": "apps/your-app-e2e/cypress.config.ts",
        "env": {
          "AUTH_TYPE": "password"
        }
      }
    }
  }
}

你也可以在运行测试命令时动态传值：

# 运行时指定auth类型为oauth
NX_AUTH_TYPE=oauth nx e2e your-app-e2e

测试中读取变量的方式根据你使用的E2E工具调整即可：

• Cypress：使用Cypress.env('AUTH_TYPE')读取
• Playwright：使用process.env.NX_AUTH_TYPE读取

内容的提问来源于stack exchange，提问作者Konstantin Schütte