サイト上のCapybaraのfill_inプリズムのページオブジェクトが機能しません

Question

ページオブジェクトにフィーチャースペックを書き直しましたが、fill_inメソッドに問題があります。

Pageオブジェクト：

class LoginPage < SitePrism::Page 
set_url '/login' 

section :navbar, NavbarSection, '.navbar-collapse' 
section :drop_menu, DropMenuSection, '.popover-content' 
element :email, 'input[name=email]' 
element :password, 'input[type=password]' 
element :submit, 'button[type=submit]' 
element :help, 'a', text: "Help! I can't sign in" 
end 

仕様：入力フィールドは次のように定義される

require 'spec_helper' 

feature 'Login', js: true do 
    let(:app) { App.new } 
    let(:login_page) { app.login } 

    scenario 'with invalid credentials results in error message' do 
    login_page.load 
    login_page.fill_in login_page.email, with: 'wrong@mail.com' 
    login_page.fill_in login_page.password, with: 'bad password' 
    login_page.submit.click 
    expect(login_page).to have_content 'Invalid credentials' 
    end 

次のよう

コードが

<input class="form-control input-lg ng-pristine ng-untouched 
ng-invalid ng-invalid-required" name="email" 
ng-model="login.credentials.email" placeholder="Email" 
required="" tabindex="0" aria-required="true" 
aria-invalid="true">` 

Iをテストを実行すると、私はf ollowingエラー：

[2] pry(#<RSpec::ExampleGroups::Login>)> login_page.fill_in login_page.email, 
with: 'wrong@mail.com' 
Capybara::ElementNotFound: Unable to find field #<Capybara::Node::Element 
tag="input" path="/html/body/div[1]/div/div/div/div/div[2]/div/form/div[1]/div/input"> 

しかし、このフィールドは検索可能です：

[1] pry(#<RSpec::ExampleGroups::Login>)> login_page.email 
=> #<Capybara::Node::Element tag="input" 
path="/html/body/div[1]/div/div/div/div/div[2]/div/form/div[1]/div/input"> 

私はそれはCSSを使用した場合にfill_inがfind使用する方法で接続されるかもしれないと思います。

エンドユーザーがフォームとやり取りする方法にできるだけ近い方法で対応する方法はありますか？ を使用したくないのですが、setはフィールドが実際にクリック可能/埋め可能で、一部の要素によって隠されていないかどうかは気にしないためです。

Answer 1

これが働くことが判明：

login_page.fill_in login_page.email[:name], with: 'wrong@mail.com' 

[:name]シンボルは、任意のユニークな入力は、コードを持っているかもしれ属性です。

は、これは基本的に find(:fillable_field, "the id/name/label text").set("value to set")として実装されてCapbaras #fill_inくれ How to use fill_in with find in Capybara (if possible)

Answer 2

を助けました。 Site-prismは、検索動作を要素に移動しますが、要素を指定するときに使用されるセレクタを指定できます。だから、むしろ

element :email, "some css to find the email field" 

を行うよりも、あなたはカピバラのFILL_INを使用するlogin_page.email.set("xyz")が同等にする必要があります

element :email, :fillable_field, "the id/name/label you would have passed to fill_in" 

を行うことができます。チェックボックス、ラジオボタンなどでも同じことができます。