44

opacity: 0偽のボタンがあり、重なっているファイルフィールドがあります。さまざまなブラウザ間で一貫して表示される一種の「アップロードボタン」を偽造する一般的なCSSテクニック。

attach_fileカピバラは私がその入力を呼び出すことを許可していません。エラーはSelenium::WebDriver::Error::ElementNotVisibleError: Element is not currently visible and so may not be interacted withです。

カピバラに目に見えない要素と相互作用させる方法を知っている人はいますか？

答えはまだ答えられていませんが、回避策を見つけました。インテリジェントなものは何もありません。単純なスクリプトで要素を表示するだけです。

  page.execute_script %Q{
    $('#photos').css({opacity: 1, transform: 'none'});
  }

記録のために投稿します。

4

7 に答える 7

75

visible: falseカピバラのプロパティを使用して、非表示の要素を操作できます。

非表示の要素をクリックする場合は、次を使用します。

find("#photos", visible: false).click

click_button('#photo')直接使用しないでください

于 2013-07-22T13:19:16.713 に答える
19

Capybaraの作成者は、非Capybara.ignore_hidden_elements表示の要素を表示する必要がある直前に設定し、後でリセットすることをお勧めします。

Capybara.ignore_hidden_elements = false
click_button 'my invisible button'
Capybara.ignore_hidden_elements = true
于 2014-06-18T17:02:27.600 に答える
8

一般に、Capybaraを使用している場合、非表示の要素との対話は不可能です（visible: false/hiddenほとんどのファインダーのオプションを使用してそれらを見つけることができますが、実際には何もしません）。ただし、ファイル入力は特殊なケースです。これは、要素を非表示にすることが一般的であり、セキュリティ上の制限により、ページに表示される要素を操作して実際にファイルを追加する方法が他にないためです。このため、Capybaraに要素を表示させ、ファイルを添付してから、CSSを元の設定にリセットするために使用できるオプションがありますattach_file。make_visible

attach_file('photos', file_path, make_visible: true)
于 2017-06-08T19:14:08.697 に答える
0

ミケル、workaraundに感謝します。

Selenium Webdriver2.35およびFirefox24のC＃バインディングで隠しファイル入力を操作する場合にも同様の問題があります。ファイル選択を機能させるには、同様のトリックを実行しました。

((IJavaScriptExecutor)webdriver).ExecuteScript("$('#fileUploadInput').css({opacity: 1, transform: 'none'});");

IWebElement e = webdriver.FindElement(By.CssSelector("input#fileUploadInput")));

e.SendKeys("c:\\temp\\inputfile.txt");
于 2013-10-18T15:13:00.990 に答える
0

私はそれを別のルートで解決することになりました。

execute_script()（FireFoxでのテストの実行がフリーズする）苦労していたので、これが私がしたことです：

私はすでに適切なjavascriptファイルを持っていました。以下を追加しました

<% if ENV["RAILS_ENV"] == "test" %>
  $('#photos').show()
<% end %>

.erbまた、Railsアセットを適切に処理するために、JavaScriptファイルに追加する必要がありました。

そして私のテストファイルでは、私はすでに設定していましたENV["RAILS_ENV"] = "test"

このようにして、テストのためにUIを単純化するだけで、本番環境のルックアンドフィールを維持することができました。

于 2014-04-30T20:13:48.763 に答える
0

display:none;CSSスタイルが設定されている要素を使用してこのようにしました。

page.execute_script("$('.all-hidden-elements').show();");
all('.all-hidden-elements').first.click
于 2015-11-11T21:44:06.067 に答える
0

非表示の要素が表示されている親要素にネストされている場合（たとえば、表示されているラベル内の非表示の入力）、代わりに親をクリックできます。それでもIDで入力を検索する場合は、次のように親に移動できます。

find('#hidden_input').find(:xpath, '..').click
于 2016-01-22T21:46:33.590 に答える