如何使用 GitHub 操作将环境变量发送到赛普拉斯？

Question

我正在尝试使用 GitHub 操作运行我的 Cypress 测试，但无法弄清楚如何将环境变量发送到 Cypress 以覆盖我的本地配置。

目前我将 baseUrl 设置为 https://localhost:3000 但想在我的开发环境中运行时发送另一个 URL。我还想发送在 beforeEach 函数中使用的标头（令牌），以便允许我的所有请求进入我的开发环境。

我尝试过使用 process.env.CYPRESS_XYZ 和 Cypress.env('XYZ') 都没有成功。并且还尝试在 with: 部分下的 yaml 文件中设置 config: baseUrl=https://xyz。

该设置在我本地运行时有效，因此只有在尝试为我的开发环境设置新的 baseUrl 时才会遇到这些问题。

有什么想法可以将我的 BASE_URL 和 DEV_TOKEN 从我的工作流获取到我的赛普拉斯配置中吗？

赛普拉斯.config.ts

import { addCucumberPreprocessorPlugin } from '@badeball/cypress-cucumber-preprocessor';
import createEsbuildPlugin from '@badeball/cypress-cucumber-preprocessor/esbuild';
import createBundler from '@bahmutov/cypress-esbuild-preprocessor';
import { defineConfig } from 'cypress';
import * as fs from 'fs';

export default defineConfig({
  blockHosts: [
    '*.googletagmanager.com',
    '*.google-analytics.com',
  ],
  chromeWebSecurity: false,
  defaultCommandTimeout: 10000,
  e2e: {
    baseUrl: process.env.CYPRESS_BASE_URL || 'https://localhost:3000',
    experimentalRunAllSpecs: true,
    async setupNodeEvents(
      on: Cypress.PluginEvents,
      config: Cypress.PluginConfigOptions,
    ): Promise<Cypress.PluginConfigOptions> {
      // This is required for the preprocessor to be able to generate JSON reports after each run, and more,
      await addCucumberPreprocessorPlugin(on, config);

      on(
        'file:preprocessor',
        createBundler({
          plugins: [createEsbuildPlugin(config)],
        }),
      );

      on('after:spec', async (_, results) => {
        if (results && results.video) {
          // Do we have failures for any retry attempts?
          const failures = results.tests?.some((test) =>
            test.attempts.some((attempt) => attempt?.state === 'failed'),
          );
          if (!failures) {
            // delete the video if the spec passed and no tests retried
            fs.unlink(results.video, (err) => {
              if (err) throw err;
              return;
            });
          }
        }
      });

      // Make sure to return the config object as it might have been modified by the plugin.
      return config;
    },
    specPattern: '**/*.feature',
  },
  env: {
    login_email: 'user@test.com',
    login_password: 'test123!',
  },
  projectId: 'xxxxx',
  screenshotsFolder: './cypress/screenshots',
  video: false,
  videosFolder: './cypress/videos',
  viewportHeight: 768,
  viewportWidth: 1024,
});

e2e.ts

import './commands';

Cypress.on('uncaught:exception', () => {
  return false;
});

beforeEach(() => {
  cy.intercept(`${Cypress.config('baseUrl')}**`, req => {
      req.headers['dev_token'] = Cypress.env('DEV_TOKEN')
  });
});

e2e.yaml

name: e2e tests

on:
  workflow_call:
    inputs:
      E2E_BASE_URL:
        type: string
        description: Cypress target URL
        default: false
        required: false
    secrets:
      CYPRESS_RECORD_KEY:
        required: true
      DEV_TOKEN:
        required: true

jobs:
  e2e-test:
    name: Cypress run
    runs-on: ubuntu-latest
    strategy:
      fail-fast: false
      matrix:
        containers: [1, 2, 3, 4]
    steps:
      - name: Checkout
        uses: actions/checkout@v3

      - name: Cypress run
        uses: cypress-io/github-action@v5
        with:
          browser: chrome
          record: true
          parallel: true
        env:
          DEV_TOKEN: ${{ secrets.DEV_TOKEN }}
          CYPRESS_BASE_URL: ${{ inputs.E2E_BASE_URL }}
          CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }}
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

工作流操作中的错误消息

Cypress could not verify that this server is running:

  > https://localhost:3000

We are verifying this server because it has been configured as your baseUrl.

Cypress automatically waits until your server is accessible before running tests.

We will try connecting to it 3 more times...
We will try connecting to it 2 more times...
We will try connecting to it 1 more time...

Cypress failed to verify that your server is running.

Answer 1

我在我的用户名项目中是这样做的，类似地适用于任何类型的变量：

1. 您首先通过 GitHub 界面定义 Actions 秘密

2. 始终以柏_请记住，这将被截断

3. 然后在工作流yml中做一步：

   - name: set approx
     run: echo "CYPRESS_AUTOMATED_TESTS_USERNAME1=${{secrets.CYPRESS_AUTOMATED_TESTS_USERNAME1}}" >> $GITHUB_ENV
   

4. 然后直接在测试中使用 Cypress.env("AUTOMATED_TESTS_USERNAME1"),

   This video 帮助我回到过去。