水豚'拖&下降不起作用

发布于 2024-12-10 12:31:42 字数 387 浏览 0 评论 0原文

我在 Mac 上使用 Cucumber/capybara/selenium/firefox。除了 d&d 之外，一切都运行良好。可通过 drag_node.drag_to(drop_node) 进行拖放。调用时，它不会引发任何错误，但实际的拖放从未发生。

现在，我不再是复制粘贴零碎内容，而是找到了这个示例应用程序（由一个人编写）谁显然有类似的问题）证明了这个问题。

然而，Google 并不知道 drag_to() 已被破坏。据我所知。这给人一种希望，那就是我错过了一些东西，而不是一个错误。那么它是什么？我缺少什么？一个错误？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

神魇的王 2024-12-17 12:31:42

对我来说，#drag_to 确实有效，但是，它的功能似乎有限。

为了将 UI 可排序表行向下移动，我必须创建一个包含三行的表，然后运行此代码（在 Cucumber 步骤中）：

element = find('tbody tr:nth-child(1)')
target = find('tbody tr:nth-child(3)')

element.drag_to target

这会将第一行与第二行交换。我的解释是水豚拖得不够远，所以我给了它一个超出我实际目标的目标。

注意：我已使用 tolerance: 'pointer' 配置了 UI-sortable。

For me, #drag_to did work, however, its powers seem to be limited.

In order to move a UI-sortable table row down, I had to create a table with three rows, then run this code (in a Cucumber step):

element = find('tbody tr:nth-child(1)')
target = find('tbody tr:nth-child(3)')

element.drag_to target

This would swap the first with the second row. My interpretation is that Capybara does not drag far enough, so I gave it a target beyond my actual target.

Note: I have configured UI-sortable with tolerance: 'pointer'.

回复收藏 0 原文

烟凡古楼 2024-12-17 12:31:42

我遇到了同样的问题，并通过直接进入 selenium-webdriver 解决了它。

我使用 selenium-webdriver 2.20.0 和 Capybara 1.1.2，

这适用于这个 HTML

<!DOCTYPE html>
<html>
  <head>
    <title>Cabybara Drag And Drop</title>
    </style>
    <style type="text/css" media="screen">
      #list_1 { background:#2C4999; }
      #list_2 { background:#99752A; }
      .list { padding:10px; width:200px; }
      .item { background:#FFF; margin:10px; }
    </style>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js"></script>

    <script type="text/javascript">
      $().ready(function(){
        $( "#list_1" ).sortable({ connectWith:"#list_2" });
        $( "#list_2" ).sortable({ connectWith:"#list_1" });
      });
    </script>
  </head>
  <body>
    <ol id='list_1' class='list'>
      <li id='item_1' class='item'>Item 1</li>
      <li id='item_2' class='item'>Item 2</li>
      <li id='item_3' class='item'>Item 3</li>
      <li id='item_4' class='item'>Item 4</li>
      <li id='item_5' class='item'>Item 5</li>
    </ol>
    <ol id='list_2' class='list'>
      <li id='item_6' class='item'>Item 6</li>
      <li id='item_7' class='item'>Item 7</li>
      <li id='item_8' class='item'>Item 8</li>
      <li id='item_9' class='item'>Item 9</li>
      <li id='item_10' class='item'>Item 10</li>
    </ol>

  </body>
</html>

现在在 Ruby 代码之前。
从水豚调用 page.driver.browser 获取 selenium-webdriver

require 'test_helper'

class DragDropTest < ActionDispatch::IntegrationTest
  setup do
    Capybara.current_driver = Capybara.javascript_driver # :selenium by default
  end

  def test_drag_item_1_to_list_2
    visit '/drag_drop'
    element = page.find(:id, 'item_1')
    target  = page.find(:id, 'list_2')

    selenium_webdriver = page.driver.browser
    selenium_webdriver.mouse.down(element.native)
    selenium_webdriver.mouse.move_to(target.native, 0, 10)
    selenium_webdriver.mouse.up
    sleep 2
  end
end

I have had the same proble and solved it by going directly to the selenium-webdriver.

I an using selenium-webdriver 2.20.0 and Capybara 1.1.2

this works with this HTML

<!DOCTYPE html>
<html>
  <head>
    <title>Cabybara Drag And Drop</title>
    </style>
    <style type="text/css" media="screen">
      #list_1 { background:#2C4999; }
      #list_2 { background:#99752A; }
      .list { padding:10px; width:200px; }
      .item { background:#FFF; margin:10px; }
    </style>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js"></script>

    <script type="text/javascript">
      $().ready(function(){
        $( "#list_1" ).sortable({ connectWith:"#list_2" });
        $( "#list_2" ).sortable({ connectWith:"#list_1" });
      });
    </script>
  </head>
  <body>
    <ol id='list_1' class='list'>
      <li id='item_1' class='item'>Item 1</li>
      <li id='item_2' class='item'>Item 2</li>
      <li id='item_3' class='item'>Item 3</li>
      <li id='item_4' class='item'>Item 4</li>
      <li id='item_5' class='item'>Item 5</li>
    </ol>
    <ol id='list_2' class='list'>
      <li id='item_6' class='item'>Item 6</li>
      <li id='item_7' class='item'>Item 7</li>
      <li id='item_8' class='item'>Item 8</li>
      <li id='item_9' class='item'>Item 9</li>
      <li id='item_10' class='item'>Item 10</li>
    </ol>

  </body>
</html>

Now fore the Ruby code.
Getting at the selenium-webdriver from capybara call page.driver.browser

require 'test_helper'

class DragDropTest < ActionDispatch::IntegrationTest
  setup do
    Capybara.current_driver = Capybara.javascript_driver # :selenium by default
  end

  def test_drag_item_1_to_list_2
    visit '/drag_drop'
    element = page.find(:id, 'item_1')
    target  = page.find(:id, 'list_2')

    selenium_webdriver = page.driver.browser
    selenium_webdriver.mouse.down(element.native)
    selenium_webdriver.mouse.move_to(target.native, 0, 10)
    selenium_webdriver.mouse.up
    sleep 2
  end
end

回复收藏 0 原文

懒猫 2024-12-17 12:31:42

这是 selenium-webdriver 在可排序列表方面存在问题。这篇文章介绍了解决方法：http://www.dixis.com/?p=626

回复收藏 0 原文

雨夜星沙 2024-12-17 12:31:42

#drag_to 不适用于可排序列表，大概是因为您没有像拖动设定的距离和方向那样拖动“到”元素。 Selenium 的 #drag_by 是您正在寻找的，但 Capybara 目前不支持。

另请参阅：

https://github.com/jnicklas/capybara/issues/222

< a href="https://github.com/jnicklas/capybara/issues/119" rel="nofollow">https://github.com/jnicklas/capybara/issues/119

回复收藏 0 原文

洋洋洒洒 2024-12-17 12:31:42

这对我有用：

def drag_n_drop(item:, location:)
  # this is from Selenium
  page.driver.browser.action.click_and_hold(item.native).perform

  # this is from Capybara
  item.drag_to(location)
end

背景：

我正在测试的页面使用 SortableJS 库（https://github.com /SortableJS/Sortable)
Rspec + Capybara + Selenium Chrome (无头)

警告：我通过反复试验发现了这一点，实际上我不确定它为什么有效。 YMMV 并自行承担使用风险。

This has worked for me:

def drag_n_drop(item:, location:)
  # this is from Selenium
  page.driver.browser.action.click_and_hold(item.native).perform

  # this is from Capybara
  item.drag_to(location)
end

Background: