如何从源码构建 Puppeteer 并运行它的测试【免费下载链接】puppeteerJavaScript API for Chrome and Firefox项目地址: https://gitcode.com/GitHub_Trending/puppeteer1/puppeteer这篇文章面向需要修改 Puppeteer 源码、给项目提补丁或在本地验证行为变化的开发者目标是完成一条连续的操作路径克隆仓库、安装依赖、用 wireit 构建全部或单个包再用项目自带的 mocha-runner 运行测试并处理单测运行、失败重试与测试期望文件这几件日常会碰到的事。前置条件只有一个明确的版本要求仓库各包在package.json中声明了engines: { node: 22.12.0 }见 packages/puppeteer/package.json文档 docs/contributing.md 同时要求运行单元测试需要 Node 22因此开始前请确认本机 Node 满足该版本。克隆仓库并安装依赖git clone https://gitcode.com/GitHub_Trending/puppeteer1/puppeteer cd puppeteer npm installnpm install会安装所有 workspace 的依赖并在安装过程中下载兼容的 Chrome。如果想让默认下载的浏览器换成 Firefox按 docs/contributing.md 的写法使用PUPPETEER_BROWSERfirefox npm install仓库的 workspace 结构可以参考 docs/contributing.md 的项目结构说明packages是全部公开源码puppeteer、puppeteer-core、browsers等test是测试源码test-d是用tsd做的类型测试tools/mocha-runner是自定义测试运行器的源码。构建所有包并确认构建产物npm run build构建由 wireit 中wireit.build.dependencies列出了browsers、ng-schematics、puppeteer-core、puppeteer、testserver、test、test/installation及工具包的构建任务一次命令把所有依赖包自动构建完整。构建是否成功可以直接检查产物是否存在。以puppeteer包为例它的入口声明为./lib/puppeteer/puppeteer.js、CLI 入口为./lib/puppeteer/node/cli.js见 packages/puppeteer/package.json所以构建后应能看到ls packages/puppeteer/lib/puppeteer/puppeteer.js如果你只改了一个包不必每次都全量构建npm run build --workspace puppeteer # 例puppeteer文档说明由于 wireit 的依赖追踪指定单个包即可其依赖包会被自动构建。开发中需要持续重建时可用 watch 模式注意一次只能 watch 一个包否则会“不按预期工作”npm run build --watch --workspace puppeteer还有一类需要留意的情况部分生成产物文档举例为packages/puppeteer-core/src/types.ts依赖构建系统无法感知的条件可能变得陈旧。清理这些产物用npm run clean # 或只清理某个包 npm run clean --workspace package其中package替换为你要清理的包名例如puppeteer。运行测试测试代码本身是 TypeScript先构建再跑文档特别强调了这一点npm run build --workspacepuppeteer-test/test npm testnpm test实际执行的是npx ./tools/mocha-runner见 package.json即一个跑在 Mocha 之上、读取 test/TestSuites.json 和 test/TestExpectations.json 的自定义运行器。默认情况下它会运行当前平台适用的所有测试套件docs/contributing.md 的说法是默认npm test覆盖 headless 的 Chrome 与 Firefox“一般已经足够”。要只跑某一个套件用--test-suite参数套件名定义在test/TestSuites.json中仓库 package.json 的 wireit 脚本给出了现有套件chrome-headless、chrome-headful、chrome-bidi、chrome-headless-shell、chrome-pipe、firefox-headless、firefox-headfulnpm run test -- --test-suite chrome-headless # 等价的 npm script 形式 npm run test:chrome:headless运行器支持的完整 CLI 参数见 test/README.md参数类型用途--no-coverageboolean不生成覆盖率报告--no-suggestionsboolean不生成更新TestExpectations.json的建议--save-stats-tostring保存本次运行数据到指定文件--reporterstring指定自定义 Mocha reporter 文件--retriesnumber失败测试的重试次数--timeoutnumber超时阈值--no-parallelboolean不并行运行测试文件--fullTraceboolean失败时生成完整堆栈--test-suitestring指定TestSuites.json中的套件名如何判断结果是否符合预期运行器会把每次结果与 test/TestExpectations.json 对照某配置下预期失败或应跳过的测试就记录在那里字段为testIdPattern、platforms、parameters、expectations规则见 tools/mocha-runner/README.md。如果某次运行结果与期望不一致运行器会输出对期望文件的建议修改文档要求这类改动是手工确认后写回TestExpectations.json的。跑单个测试与调试只跑一个测试时把测试源码中的it换成it.only改完记得还原避免提交... it.only(should work, async function() { const {server, page} await getTestState(); const response await page.goto(server.EMPTY_PAGE); expect(response.ok).toBe(true); });临时禁用某个测试则用it.skip。测试的公共状态来自mocha-utils.js的getTestState()其中包含puppeteer、server、page等已在测试间自动重置的对象写法可以参考test/src下的现有测试。用 VSCode 调试测试的流程见 docs/contributing.md把仓库提供的.vscode/launch.template.json复制为.vscode/launch.json然后先构建测试代码再用集成调试器启动npm run build --workspace puppeteer-test/test针对不稳定flaky的测试mocha-runner 提供了专用环境变量PUPPETEER_DEFLAKE_TESTS[navigation.spec] * npm run test:chrome:headlessPUPPETEER_DEFLAKE_TESTS接收与TestExpectations.json相同语法模式的测试名或模式命中的测试默认会被重复运行 100 次次数可用PUPPETEER_DEFLAKE_RETRIES调整PUPPETEER_DEFLAKE_RETRIES1000 PUPPETEER_DEFLAKE_TESTS[navigation.spec] * npm run test:chrome:headless其他测试入口按需选择以下命令来自 docs/contributing.md 的 “Comprehensive testing” 一节和 test/README.md按任务选择不必每次全跑npm run unit # 不启动浏览器、只测代码的单元测试使用 Node 测试运行器要求 Node 22 npm run test:chrome:headful # Chrome 有界面模式测试 npm run test-types # 用 tsd 校验 puppeteer 的 TypeScript 类型对应 test-d/ npm run test-install # 验证 puppeteer 与 puppeteer-core 能否正确安装并可用 BINARY/path/to/chrome npm run test:chrome:headless # 用自定义浏览器可执行文件跑测试最后一条中BINARY是环境变量替换为你本地浏览器可执行文件的路径test:chrome:headless也可以换成npm run test:firefox对应的 Firefox 套件。提交前还可以跑风格检查与自动修复规则由 eslint.config.mjs 和 prettier.config.js 定义npm run lint # 检查 npm run format # 尝试修复验证构建产物可被使用可选构建完成后如果想确认产物能被真实脚本使用examples/README.md 给了一个最直接的验证方式——在npm install与npm run build都成功之后运行单个示例NODE_PATH../ node examples/search.js能正常执行并完成页面操作说明构建出的库是可导入、可运行的。最后回到结果判断整套流程完成的标志是npm test或你选定的--test-suite跑完且没有超出TestExpectations.json记录的意外失败若某个测试在你的环境下持续失败而属于已知问题按 tools/mocha-runner/README.md 的说明把期望写回TestExpectations.json而不是改动被测代码。【免费下载链接】puppeteerJavaScript API for Chrome and Firefox项目地址: https://gitcode.com/GitHub_Trending/puppeteer1/puppeteer创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考