Puppeteer – 鼠标模拟

Pupeteer中可以模拟鼠标操作，表示鼠标的对象是mouse对象。每个页面含有一个mouse对象，使用mouse类可以模拟鼠标移动、点击等操作。

鼠标移动

要模拟鼠标移动，可以使用mouse.move方法：

const puppeteer = require('puppeteer');

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

  await page.setViewport({ width: 1920, height: 1080 });
  await page.goto('https://www.qikegu.com');

  // 等待"后端开发"这部分内容呈现
  await page.waitForSelector('#pos-backend');

  // 将鼠标悬停在"后端开发"第一个条目处
  await page.mouse.move(560, 530);

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

上面模拟的场景是，打开指定网页，把鼠标移动到”后端开发”类别中的首个条目。

鼠标点击

要模拟鼠标点击，可以使用mouse.click方法：

const puppeteer = require('puppeteer');

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

  await page.setViewport({ width: 1920, height: 1080 });
  await page.goto('https://www.qikegu.com');

  // 等待"后端开发"这部分内容呈现
  await page.waitForSelector('#pos-backend');

  // 点击"后端开发"第一个条目，在1000ms后触发“mouseup”事件
  await page.mouse.click(560, 530, { delay: 1000 });

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

click会依次触发mousemove、mousedown和mouseup事件，click方法中还可以控制鼠标按钮(左、中、右)和点击次数，详情可参考官方API文档。

鼠标拖放

结合使用move，down，up可以模拟鼠标拖放操作。

const puppeteer = require('puppeteer');

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

  await page.setViewport({ width: 1920, height: 1080 });
  await page.goto('https://www.qikegu.com');

  // 将鼠标从一个点上拖动
  await page.mouse.move(0, 0);
  await page.mouse.down();

  // 将鼠标放到另一个点
  await page.mouse.move(100, 100);
  await page.mouse.up();

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

如上所示，模拟的场景是把鼠标移动到一处，按下，拖动，松开。