如何使用puppeteer对模拟设备执行拖动缩放

Question

当页面处于模拟设备模式时，是否有人设法模拟与puppeteer的拖动缩放交互。要以用户身份执行此操作，请在拖动鼠标的同时按住SHIFT键。

不幸的是，以下不起作用

const cx = 160;
const cy = 284;
await page.mouse.move(cx, cy);
await page.keyboard.down('Shift');
await page.mouse.down();
await page.mouse.move(cx, cy - 300, {steps: 300});
await page.mouse.up();
await page.keyboard.up('Shift');

Answer 1

根据this issue的这次谈话，他们不打算添加这样的功能。我会引用他们的回复，

我不喜欢为WebPlatform的事件添加puppeteer级别的API。 Puppeteer的点击次数与WebPlatform的document.createEvent不同;将它们作为唯一的一流API强调它们是点击页面上的东西的推荐方式。

我建议使用一组辅助方法来满足您的需求。

但是你可以这样做，

await this._client.send('Input.dispatchMouseEvent', {
      type: 'mousePressed',
      button: this._button,
      x: this._x,
      y: this._y,
      modifiers: this._keyboard._modifiers,
      clickCount: (options.clickCount || 1)
});

这是另一个触发一个小鼠标事件的代码片段（与.evaluate函数一起使用）。

function triggerMouseEvent (node, eventType) {
    var clickEvent = document.createEvent ('MouseEvents');
    clickEvent.initEvent (eventType, true, true);
    node.dispatchEvent (clickEvent);
}