GitLab CI无头模式下运行PhantomJS出现超时问题

咱们来一步步排查这个GitLab CI里PhantomJS超时的问题——本地跑QUnit测试全绿，一到CI流程就卡壳超时，大概率是环境差异、资源限制或者依赖缺失搞的鬼，给你几个实用的排查方向：

1. 先确认CI环境的依赖是否齐全 #

PhantomJS无头模式运行需要一些系统依赖包，很多默认的GitLab CI镜像可能没预装这些。你可以在.gitlab-ci.yml的before_script里加上安装步骤：

before_script:
  - apt-get update && apt-get install -y libfontconfig1 libfreetype6 libx11-6 libxext6 libxrender1

另外，一定要保证CI环境里的Node.js、Grunt和PhantomJS版本和你本地完全一致——版本不兼容是这类问题的常见诱因。可以在CI脚本里打印版本对比：

node -v
grunt -v
phantomjs -v

2. 调整Grunt QUnit的超时与性能配置 #

CI服务器的资源通常比本地机器弱，启动PhantomJS或加载测试页面可能需要更长时间。你可以在Gruntfile.js里加大超时时间，同时关闭不必要的资源加载来提速：

qunit: {
  options: {
    timeout: 15000, // 把默认超时从5秒改成15秒，根据实际情况调整
    port: 9001, // 换个不常用的端口，避免CI环境里的端口冲突
    phantomjsOptions: [
      '--load-images=no', // 禁用图片加载，减少资源消耗
      '--disk-cache=true' // 启用磁盘缓存，加快重复加载速度
    ]
  },
  all: ['test/**/*.html']
}

3. 开启PhantomJS调试日志定位根因 #

如果上面的调整没用，咱们让PhantomJS输出详细日志，看看到底卡在哪个环节。修改Grunt配置：

qunit: {
  options: {
    phantomjsOptions: [
      '--debug=true',
      '--logfile=phantomjs-debug.log'
    ]
  }
}

然后在CI脚本里添加after_script来打印日志：

after_script:
  - cat phantomjs-debug.log || echo "No debug log generated"

这些日志能帮你区分是PhantomJS本身启动失败，还是测试页面加载超时。

4. 考虑替换PhantomJS为Headless Chrome #

PhantomJS已经停止维护好几年了，很多现代CI环境对它的支持不如Headless Chrome友好。你可以尝试切换到Headless Chrome来运行测试：

1. 先安装依赖包：

npm install --save-dev chrome-launcher

2. 修改Gruntfile里的QUnit配置：

qunit: {
  options: {
    browser: 'ChromeHeadless',
    timeout: 10000
  },
  all: ['test/**/*.html']
}

3. 在CI环境里安装Chrome（如果镜像没预装的话）：

before_script:
  - apt-get update && apt-get install -y google-chrome-stable

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