如何用黄瓜和水豚处理动态元素

Question

(Click for image) 我正在开发一个项目来编写一个场景来测试登录功能。出于某种原因，水豚没有访问动态元素。

重现步骤：

1) 访问Redfin.com(例如)

2) 点击登录按钮

3) 出现动态弹出对话框

4) 点击 "continue with email" 并尝试输入详细信息并点击提交。

我无法使用 find(#) 找到任何元素，因此无法点击提交或输入详细信息。

另外我相信 webapp 是用 React 构建的。请让我知道如何处理。

<div class="emailSignInButtonWrapper" style="position: relative;">
  <button class="button Button tertiary emailSignInButton v3" type="button" tabindex="0" data-rf-test-name="submitButton">
    <span>
      <span class="signInText">Continue with Email</span>
    </span>
  </button>

Answer 1

您正在谈论的

None 个元素具有 ID，因此使用 #<id> (find('#my_button').click) 的 CSS 查找将不起作用。但是，要单击该按钮，您应该能够做到

click_button('Continue with Email') # case of the text matters

或

click_button(class: 'emailSignInButton')

这一切都假设您使用的是支持 JS 的 Capybara 驱动程序 - https://github.com/teamcapybara/capybara#drivers

这里的代码表明如果使用支持 JS 的驱动程序，它是有效的

require 'capybara/dsl'
require 'selenium-webdriver'

session = Capybara::Session.new(:selenium_chrome)
session.visit "https://www.redfin.com"

session.click_link('Sign In', href: nil)

session.click_button('Continue with Email')

Answer 2

以下是 redfin 网站上对我有用的内容：

scenario "bring up signup form on redfin" do
  visit 'https://www.redfin.com'
  find('a', :text => 'Sign In').click
  click_button('Continue with Email')
end

如何用黄瓜和水豚处理动态元素

How to handle dynamic elements with cucumber and capybara

ruby

selenium

rspec

cucumber

capybara