Sublime编写Puppeteer自动化测试脚本_模拟用户操作与页面截图-sublime-PHP中文网

Sublime编写Puppeteer自动化测试脚本_模拟用户操作与页面截图

尼克

发布： 2025-12-15 08:21:34

原创

677人浏览过

Sublime Text 可作为高效编辑器编写 Puppeteer 脚本，需本地安装 Node.js（v16+）和 Puppeteer，配置 Node.js 构建系统后可快捷运行；关键在语法正确、环境就绪、时机与选择器匹配。

sublime编写puppeteer自动化测试脚本_模拟用户操作与页面截图

Sublime Text 本身不直接运行 Puppeteer，但它可以作为高效的代码编辑器来编写和管理 Puppeteer 自动化测试脚本。关键在于：写对语法、配好环境、用对 Node.js 执行方式，截图和模拟操作就能顺利跑起来。

确保 Node.js 和 Puppeteer 环境就绪

Sublime 不自带运行环境，必须本地装好 Node.js（建议 v16+），再通过终端安装 Puppeteer：

在项目根目录执行：npm init -y && npm install puppeteer
首次运行时 Puppeteer 会自动下载 Chromium，约 170MB，可加 --no-sandbox 参数适配某些系统
检查 node_modules/puppeteer/.local-chromium/ 是否存在，确认浏览器已就位

在 Sublime 中编写标准 Puppeteer 脚本

新建 test.js，用 Sublime 编辑，内容示例（带注释）：

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch({ headless: true });
  const page = await browser.newPage();

  // 模拟用户访问与操作
  await page.goto('https://example.com', { waitUntil: 'networkidle2' });
  await page.type('#search-input', 'hello world');
  await page.click('#search-btn');
  await page.waitForSelector('.result-item', { timeout: 5000 });

  // 截图保存到本地
  await page.screenshot({ path: 'search-result.png', fullPage: true });

  await browser.close();
})();

登录后复制

Sublime 支持 JavaScript 语法高亮和 Emmet 补全，装上 Nodejs 插件还能一键运行（需配置 build system）。

Kreado AI

Kreado AI是一个多语言AI视频创作平台，只需输入文本或关键词，即可创作真实/虚拟人物的多语言口播视频。为创作者提供AI赋能

182

查看详情

用 Sublime 快速运行脚本的小技巧

按 Ctrl+Shift+B（Windows/Linux）或 Cmd+Shift+B（macOS），选择 Nodejs 构建系统
若没安装插件，可手动配置：Tools → Build System → New Build System，填入：

{
  "cmd": ["node", "$file"],
  "selector": "source.js"
}

登录后复制

保存为 Nodejs.sublime-build，之后就能快捷运行当前 JS 文件。

调试截图与交互问题的实用建议

常见失败点不是代码写错，而是时机或选择器不匹配：

截图空白？试试加 await page.waitForTimeout(1000) 或换 fullPage: false 先截可视区
点击无效？用 page.$(selector) 检查元素是否存在，或改用 page.click(selector, { delay: 100 }) 模拟真实鼠标
想看页面行为？临时把 headless: true 改成 false，Puppeteer 会弹出真实浏览器窗口

基本上就这些。Sublime 轻量高效，配合 Puppeteer 写自动化测试完全够用——重点不在编辑器多强大，而在脚本逻辑是否贴合页面实际行为。

以上就是Sublime编写Puppeteer自动化测试脚本_模拟用户操作与页面截图的详细内容，更多请关注php中文网其它相关文章！