gitlab - Cypress/GitLab CI/CD 集成 - Cypress 不会以 headless 模式启动

Question

在 Cypress 中编写了几个测试并以 headless 和有头方式在本地进行了尝试(两种方式都很好)后，在集成过程中插入测试后，我无法让我们的 GitLab 以 headless 方式启动 Cypress。这似乎是一个问题:[FAILED] Your system is missing the dependency: Xvfb为什么我需要 Xvfb 在 Cypress 中运行 headless 测试？我现在已经坚持了两天，任何帮助或想法将不胜感激。
.gitlab-ci.yml 中的测试配置:

test:
  image: node:latest
  stage: test
  script:
    - npm ci
    - npm start &
    - npm test

package.json 中的相关行:

"start": "ng serve --proxy-config proxy.conf.json --port 4222 -o"
"test": "cypress run --spec cypress/integration/test_zber/test.spec.js"

成功通过后尝试运行测试时的gitlab输出 npm ci

$ npm start &
$ npm test
> sdcl@0.1.30 start
> ng serve --proxy-config proxy.conf.json --port 4222 -o
> sdcl@0.1.30 test
> cypress run --spec cypress/integration/test_zber/test.spec.js
It looks like this is your first time using Cypress: 8.6.0
[STARTED] Task without title.
[FAILED] Your system is missing the dependency: Xvfb
[FAILED] 
[FAILED] Install Xvfb and run Cypress again.
[FAILED] 
[FAILED] Read our documentation on dependencies for more information:
[FAILED] 
[FAILED] https://on.cypress.io/required-dependencies
[FAILED] 
[FAILED] If you are using Docker, we provide containers with all required dependencies installed.
[FAILED] 
[FAILED] ----------
[FAILED] 
[FAILED] Error: spawn Xvfb ENOENT
[FAILED] 
[FAILED] ----------
[FAILED] 
[FAILED] Platform: linux (Debian - 10.11)
[FAILED] Cypress Version: 8.6.0
Your system is missing the dependency: Xvfb
Install Xvfb and run Cypress again.
Read our documentation on dependencies for more information:
https://on.cypress.io/required-dependencies
If you are using Docker, we provide containers with all required dependencies installed.
----------
Error: spawn Xvfb ENOENT
----------
Platform: linux (Debian - 10.11)
Cypress Version: 8.6.0
Warning: Entry point 'ng2-ace-editor' contains deep imports into '/builds/D7tLJUkz/0/uvz/evz/sdc/sdcl-fe/node_modules/brace/theme/monokai'. This is probably not a problem, but may cause the compilation of entry points to be out of order.

在本地运行时控制台输出:

PS C:\projectlocation> npm test

> sdcl@0.1.30 test C:\projectlocation
> cypress run --spec cypress/integration/test_zber/test.spec.js


[10644:1014/090627.480:ERROR:display_layout.cc(559)] PlacementList must be sorted by first 8 bits of display_id

====================================================================================================

  (Run Starting)

  ┌────────────────────────────────────────────────────────────────────────────────────────────────┐
  │ Cypress:    8.6.0                                                                              │
  │ Browser:    Electron 93 (headless)                                                             │
  │ Specs:      1 found (test_zber/test.spec.js)                                                   │
  │ Searched:   cypress\integration\test_zber\test.spec.js                                         │
  └────────────────────────────────────────────────────────────────────────────────────────────────┘


────────────────────────────────────────────────────────────────────────────────────────────────────

  Running:  test_zber/test.spec.js                                                          (1 of 1)


  simple_statement_test
    √ test1 (3090ms)
    √ test2 (4969ms)
    √ test3 (882ms)
    √ test4 (2489ms)
    √ test5 (503ms)


  5 passing (14s)


  (Results)

  ┌────────────────────────────────────────────────────────────────────────────────────────────────┐
  │ Tests:        5                                                                                │
  │ Passing:      5                                                                                │
  │ Failing:      0                                                                                │
  │ Pending:      0                                                                                │
  │ Skipped:      0                                                                                │
  │ Screenshots:  0                                                                                │
  │ Video:        true                                                                             │
  │ Duration:     13 seconds                                                                       │
  │ Spec Ran:     test_zber/test.spec.js                                                           │
  └────────────────────────────────────────────────────────────────────────────────────────────────┘


  (Video)

  -  Started processing:  Compressing to 32 CRF
  -  Finished processing: C:\projectlocation\cypress\videos\test_zber\test.     (1 second)
                          spec.js.mp4


====================================================================================================

  (Run Finished)


       Spec                                              Tests  Passing  Failing  Pending  Skipped  
  ┌────────────────────────────────────────────────────────────────────────────────────────────────┐
  │ √  test_zber/test.spec.js                   00:13        5        5        -        -        - │
  └────────────────────────────────────────────────────────────────────────────────────────────────┘
    √  All specs passed!                        00:13        5        5        -        -        -  

Answer 1

解决方案是使用 Cypress 指南提供的 docker 镜像，位于 https://docs.cypress.io/guides/continuous-integration/gitlab-ci#Testing-in-Chrome-and-Firefox-with-Cypress-Docker-Images
.gitlab.ci.yml 中的配置

test:
  image: cypress/browsers:node12.14.1-chrome85-ff81
  stage: test
  script:
    # install dependencies
    - npm ci
    # start the server in the background
    - npm start &
    # run Cypress tests
    - npx cypress run --browser chrome