单击 WebGL 中选择的坐标 (canvas)

Question

我正在使用一个嵌入了 WebGL 播放器的应用程序。

<body>
  <div class="application_layout">
    <header class="header clearfix">
      <nav class="header__left">
        <ul class="clearfix">
          <li class="menu__item menu__item--back">
            <a title="Back" class="link--back"></a>
          </li>
        </ul>
      </nav>
    </header>
    <div id="unity-webgl">
      <canvas style="cursor: default;" id="#canvas" width="1596" height="386"></canvas>
    </div>
  </div>
</body>

在 RSpec 和 capybara 的验收测试中，我试图模拟页面上的点击操作。

做的时候

execute_script("$(document.elementFromPoint(100, 20).click();")
# the position of the "Back" link

显然一切正常，脚本可以正确点击 "Back" link。

但是当尝试点击 WebGL 的任何区域时 div 类似

var event = $.Event('click');
event.clientX = 200;
event.clientY = 100;
$('#canvas).trigger(event);

什么都没发生。

WebGL有没有办法模拟鼠标点击div？

Answer 1

您不应该尝试模拟点击 - 您应该只告诉 Capybara 进行点击。如果您需要偏移点击，请使用点击方法可用的选项。

element.click(x: 200, y: 100)

任何时候你使用 JS 来触发页面上的事件你都在减少你的测试useful/valid因为它允许做用户永远做不到的事情。

Answer 2

另一种选择是使用rumousegem。但它不适用于 headless，它需要 window 焦点并且坐标是系统范围的。

单击 WebGL 中选择的坐标 (canvas)

Clicking on choosen coordinates in WebGL (canvas)

javascript

jquery

testing

capybara

unity-webgl