Question

我正在尝试为网站创建网络自动化。我在模拟点击。通常我会在下面的元素中添加ID，并使用Chrome开发者控制台触发点击，它始终有效。

p.s：下面的问题已经过时了。我实际上是想点击web.whatsapp.com上下文菜单中的项目

symfony/var-dumper

或者，如果它不起作用，我会使用纯粹的JavaScript来使用<div id="myapp">button1</div> <script> $("#myapp").click(); </script>事件，如下所示，它将顺利运行。

mousedown

现在我的问题是：这不适用于通过jQuery contextMenu插件生成的菜单。

您可以看到contextMenu here的演示，我正在通过开发者控制台测试上述内容。

因此，当您右键单击上下文菜单时，会列出一个包含function triggerMouseEvent(node, eventType) { var clickEvent = document.createEvent('MouseEvents'); clickEvent.initEvent(eventType, true, true); node.dispatchEvent(clickEvent); } var targetNode = document.querySelector("#myapp"); triggerMouseEvent(targetNode, "mousedown");和ul标记的菜单项列表。我手动将ID li添加到其中一个菜单中，并在下方代码它也通过开发者控制台选择正确的元素。

#myapp

但是我无法触发通过上下文菜单生成的菜单项的单击。我挣扎了24个多小时。我尝试过我能想到的所有JavaScript事件，例如var targetNode = document.querySelector("#myapp"); targetNode;，mouseup和mousedown。

Answer 1

您只能在创建上下文菜单时单击菜单项，这是由插件动态完成的。所以，我们首先需要触发菜单。

据我所知，触发本机上下文菜单是不可能的。触发右键点击is possible，您需要使用contextmenu事件。

特别是，使用$(el).trigger('contextmenu')似乎工作正常。这似乎有效，因为插件显式supports this。完成后，我们需要触发单击要单击的菜单项。

// first, trigger the context menu
$('.button-that-has-contextmenu').trigger('contextmenu');
// then click the menu item you want to click
// substitute the correct index in `eq(X)` here
$('.context-menu-item:eq(1)').trigger('mouseup');

由于此插件未托管在CDN上，因此在此处创建代码段并不容易。然而，我创建了一个JSFiddle来完全演示，我将插件源复制+粘贴到小提琴中。

在评论中，您询问了web.whatsapp.com。我碰巧有一个WhatsApp帐户并在那里进行了测试。它们似乎不使用jQuery contextMenu插件。确实定义了$函数，但它似乎不是jQuery，而只是document.querySelector的快捷方式。

他们的自定义上下文菜单代码是我不知道的，但我确实设法触发它。基本上，我使用上面代码的vanilla JS版本然后必须弄清楚触发哪个元素。后者比我想象的要容易。有一个打开的聊天列表.infinite-list-item元素。他们在DOM中的顺序与视觉顺序不匹配，但是找到所需的顺序可以使用浏览器检查器完成。鉴于您有这个，您需要该列表项中的.chat元素。假设我们对第二项感兴趣，我们可以按如下方式选择：

var target = $('.infinite-list-item:nth-child(2) .chat');

您可以在浏览器控制台中检查您是否拥有正确的元素。然后，按如下方式触发事件。

var evt = new MouseEvent('contextmenu', {
      bubbles: true,
      cancelable: true,
      view: window,
      buttons: 2
    });
target.dispatchEvent(evt);

这使用现代MouseEvent构造函数，代码基于this example。

以上将打开浏览器左上角的上下文菜单。您可以通过将clientX和clientY属性传递到MouseEvent构造函数来更改位置，该构造函数表示窗口中的位置。

完成后，您可以单击上下文菜单中的项目。除非您无法使用JavaScript自动执行此操作。我查看了源代码，这些菜单项的单击处理程序检查event.isTrusted是否为Selenium 2.0，这意味着您无法以编程方式触发对它们的点击。

您可能希望尝试使用可以模仿较低级别点击的内容，例如WebdriverIO（WebDriver），或者使用Python process consuming increasing amounts of system memory, but heapy shows roughly constant usage之类的包装器。

JavaScript - 模拟单击contextmenu

1 个答案:

JavaScript - 模拟单击​​contextmenu

1 个答案:

JavaScript - 模拟单击contextmenu