使用Mocha测试基于PDFjs的PDFLoader时，getDocument在JSDom环境不执行

问题背景 #

在使用Mocha+Chai测试自研的PDFLoader（基于PDF.js）时，发现pdfjsLib.getDocument函数在JSDom环境下无法进入then回调，正常浏览器环境可正常执行，执行仓库的npm run test可复现该问题。

核心原因 #

JSDom并非完整的浏览器环境，缺少PDF.js运行依赖的部分API（如Canvas渲染接口）；同时原代码的getDocument参数传递不符合PDF.js标准调用方式，且测试环境下远程PDF的网络请求可能被拦截或无法正常处理。

解决方案 #

1. 补全JSDom缺失的浏览器API #

PDF.js依赖Canvas进行渲染，JSDom本身未实现Canvas相关接口，需手动补充：

• 安装依赖包：

  npm install canvas jsdom-global --save-dev
  

• 在测试文件头部添加环境初始化代码：

  import 'jsdom-global/register';
  import { createCanvas } from 'canvas';
  
  // 挂载Canvas相关对象到全局
  global.HTMLCanvasElement = createCanvas().constructor;
  global.Image = global.HTMLCanvasElement;
  

2. 修正getDocument的调用方式 #

原代码的参数传递不符合PDF.js标准规范，改用配置对象形式，并优先使用本地PDF数据避免网络问题：

import fs from 'fs';
import pdfjsLib from 'pdfjs-dist';
import pdfjsWorker from 'pdfjs-dist/build/pdf.worker.entry';

// 手动指定Worker路径，确保测试环境能正确加载
pdfjsLib.GlobalWorkerOptions.workerSrc = pdfjsWorker;

// 读取本地PDF文件作为测试数据，避免远程请求的不确定性
const pdfBuffer = fs.readFileSync('./test/fixtures/document.pdf');
const pdfData = new Uint8Array(pdfBuffer);

pdfjsLib.getDocument({ data: pdfData })
  .promise.then(pdfDoc => {
    return pdfDoc.getPage(1);
  })
  .then(handlePages)
  .catch(err => {
    console.error('PDF加载失败:', err.message);
  });

3. 调整Mocha测试配置 #

在项目根目录创建.mocharc.js，确保JSDom的脚本执行权限和资源加载能力：

module.exports = {
  require: ['jsdom-global/register'],
  timeout: 10000, // 延长超时时间，适配PDF加载的耗时
  env: {
    NODE_ENV: 'test'
  }
};

4. 验证修复效果 #

修改完成后，执行npm run test，检查getDocument是否正常进入then回调，PDF页面是否能正常获取。

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