如何在水豚中立即设置/发送文本区域答案

【问题标题】：how to instantly set/send_keys a textarea in capybara如何在水豚中立即设置/发送文本区域
【发布时间】：2017-10-26 12:11:58
【问题描述】：

出于测试目的，我需要立即用很长的string 填充textarea。

set/send_keys 模拟打字，对于Sauce Labs 来说太慢导致超时。

有没有办法在Capybara 中立即填写textarea？

【问题讨论】：

标签： selenium capybara saucelabs

【解决方案1】：

立即执行此操作的唯一方法是使用 execute_script 通过 JS 设置值

element = find('textarea') # however you locate the element
execute_script('arguments[0].value = arguments[1]', element, text_to_set)

注意：这不会触发用户在输入到 textarea 时生成的所有事件

【讨论】：

我还会发出更改事件arguments[0].dispatchEvent(new Event('change')); 使其像复制/粘贴一样。
谢谢...我过去曾尝试过，但我不断收到Failure/Error: execute_script('arguments[0].value = arguments[1]', textarea, long_text) ArgumentError: wrong number of arguments (given 3, expected 1)
@dinky 更新您的 Capybara - 在 2.12 中添加了传递给 execute_script 的参数。并且能够从 evaluate_script 返回元素是在 2.13 中添加的
Gemfile.lock 说我正在使用capybara (= 2.7.1)
@dinky 一年多了——升级到 Capybara 的最新版本

【解决方案2】：

TL;DR: 使用 Javascript/JQuery（.val() 函数）通过 .execute_script()/.evaluate_script() 函数设置字段的 value。它将自动发送完整的字符串。您在下面有更多详细信息。

示例：

def execute_script(script)
  browser.execute(function() { 
    $('<yourSelectorHere>').val("blablabla"); 
  })
  nil
end

Selenium 团队决定采用 LOOOONG 方式返回以使其以这种方式工作，因为它实际上会模拟用户填写 input/textarea/field/etc 的真实方式.

注意：我在WebdriverIO 中编写了命令，但现在也更新为Capybara。

确实，使用.setValue()/.set() 或.keys()/.send_keys() 方法将对目标元素（可能是<input>）发出POST操作字符数组的形式。见例子：

命令： browser.setValue('input[connectqa-input="rename-device"]','stackoverflowstackoverflowstack');

输出：

> browser.setValue('input[connectqa-input="rename-device"]','stackoverflowstackoverflowstack')
{ state: 'pending' }
> [21:52:25]  COMMAND   POST     "/wd/hub/session/3d830ffd-21c6-4e5f-a6b3-4f8a03821991/elements"
[21:52:25]  DATA                {"using":"css selector","value":"input[connectqa-input=\"rename-device\"]"}
[21:52:25]  RESULT              [{"ELEMENT":"6"}]
[21:52:25]  COMMAND     POST     "/wd/hub/session/3d830ffd-21c6-4e5f-a6b3-4f8a03821991/element/6/clear"
[21:52:25]  DATA                {}
[21:52:25]  COMMAND     POST     "/wd/hub/session/3d830ffd-21c6-4e5f-a6b3-4f8a03821991/element/6/value"
[21:52:25]  DATA                {"value":["s","t","a","c","k","o","v","e","r","f","(21 more items)"],"text":"stackoverflowstackoverflowstack"}

避免这种情况的一种快速简便的方法是继续通过.execute()/.executeScript() 方法滥用.val() JQuery 函数：

命令： browser.execute(function() { $('input[connectqa-input="rename-device"]').val("dwadawdawdawdawdawdwadawawdadawdawdaw"); }) (WebdriverIO)

有关Capybara 语法，请参阅此question。它涵盖了.execute_script() 和.evaluate_script()。（我不想嘲笑他们的观点）。您还应该事先记录方法here。

输出：

> [21:59:38]  COMMAND   POST     "/wd/hub/session/3d830ffd-21c6-4e5f-a6b3-4f8a03821991/execute"
[21:59:38]  DATA                {"script":"return (function () { $('input[connectqa-input=\"rename-device\"]').val(\"dwadawdawdawdawdawdwadawawdadawdawdaw\"); }).apply(null, arguments)","args":[]}

希望对您有所帮助！

【讨论】：

@dinky 来自conEmu 或GitBash 控制台。我正在通过WebdriverIO 进行模拟。我已经设置了一个带有一些输入的测试用例，并在调试中停止了更多（.debug()）。由于所有驱动程序（chromedriver、geckodriver 等）都在实现 Selenium W3C 标准，因此它应该在与所述驱动程序集成的每个框架上都可以正常工作。
我从 chrome 控制台得到了这个：> browser VM3737:1 Uncaught ReferenceError: browser is not defined at <anonymous>:1:1
@dinky 然后用您的驱动程序实例化/声明更新您的问题。一些 sn-p 代码将帮助我们查明问题。