用Selinum+Capybara模拟剪贴板复制/粘贴

Question

const copyTextarea = document.querySelector("#copy-link-button");
copyTextarea.focus();
copyTextarea.select();
document.execCommand('copy');

1. 使用“复制链接”按钮复制链接
2. 导航到其他输入/文本字段
3. 用Ctrl+V粘贴到字段中，并读取该字段的内容以验证

我的测试：

# Copy the link
page.find("#copy-link-button").click
wait_for_ajax

# Visit some other page that I know has an input/text field
visit account_settings_path

input = page.find("#user_email")

# Clear the field
fill_in("user[email]", with: "")

# Paste in the contents of the clipboard
input.base.send_keys([:control, "v"])

# Validate
expect(input.value).to eq("some value");

但是，没有任何内容粘贴到该输入(input.value和input.textreturn“”)。

谢了！

Answer 1

注意：由于Chrome的最初发布已经改变了可用的权限类型。对于headless解决方案，请访问https://chromedevtools.github.io/devtools-protocol/tot/browser/#type-permissiontype，查看当前可用的权限类型

关于剪贴板内容的访问有很多安全规则，所以试图从Capybara获得粘贴工作真的是一项令人沮丧的练习。此外，当Ctrl/Command v作为击键发送时，大多数浏览器实际上不会执行任何操作，因为这是系统触发的操作，而不是浏览器触发的操作。

但是，由于您只想验证复制是否有效，实际上并不需要触发粘贴，您只需要绕过使用剪贴板API的权限要求。如果您正在使用Chrome（在非headless配置中--当前不使用headless），可以通过在驱动程序注册中设置profile.content_settings.exceptions.clipboard首选项来实现

Capybara.register_driver :chrome do |app|
  options = Selenium::WebDriver::Chrome::Options.new
  options.add_preference('profile.content_settings.exceptions.clipboard', {
    '*': {'setting': 1}
  })
  Capybara::Selenium::Driver.new(app, browser: :chrome, options: options)
end

如果您在headless模式下运行，并使用最新的Capybara和selenium和Chrome，另一个选择是使用CDP来授予权限

page.driver.browser.execute_cdp('Browser.grantPermissions', origin: page.server_url, permissions: ['clipboardRead', 'clipboardWrite'])

一旦确定了权限，就可以使用evaluate_async_script访问剪贴板数据

clip_text = page.evaluate_async_script('navigator.clipboard.readText().then(arguments[0])')

备注：

null