0

rspecでjQueryのfadeIn/fadeOutの動作をテストする方法を見つけようとしています。次のシナリオがあります。

ページにはチェックボックスがあります。チェックボックスにチェックを入れると、追加の入力フィールドが表示されます。そうでない場合、入力フィールドは非表示になります。入力フィールドの表示と非表示に使用するアニメーションは、jQuery フェードイン/フェードアウト効果です。

私の機能テストでは、チェックボックスにチェックを入れると入力フィールドがページに表示され、チェックされていない場合は入力フィールドが表示されないことを確認したいと思います。問題は、rspec 内で check('#checkbox_recurring') を呼び出してすぐにテストすると、入力フィールドがページ上にある場合、jQuery アニメーションがまだ完了していないため、おそらく失敗することです。

そのようなシナリオをどのようにテストしますか?

ご協力いただきありがとうございます！

4

1 に答える 1

1

jQuery フェードインを機能させる方法がわかりませんでしたが、トグルを使用しました。これで問題ないことを願っています。

<html>
<head>
<style>
  #input {
    font-weight: bold;
    font-size: 16px;
  }
 </style>
 <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
 </head>
 <body>
<input type='checkbox' id='check'>Toggle</button>
<input id = 'input' placeholder = 'name'></input>
<script>
$( "#check" ).click(function() {
  $( "#input" ).toggle( "slow" );
});
</script>
</body>
</html>

sleep (time)jQuery/AJAX 要素が終了するまで待つには、ruby を使用する必要があります。これは、 Watir の待機メソッドを説明するリンクです。

Rspec と Watir-Webdriver を使用してブラウザーを自動化しました。これは簡単なスニペットです。これはよりクリーンになる可能性がありますが、達成しようとしていることの方向性を示すはずです。

require 'rspec'
require 'watir-webdriver'


describe 'fade' do
  before(:all) do
    @browser = Watir::Browser.new :chrome
    @browser.goto('file:///C:/Users/bashir.osman/Desktop/test.html')
  end
  it 'checks fade' do
   puts "so...#{@browser.input(:id, 'check').exists?}"
   @browser.input(:id, 'check').click
   sleep 1
   exists1 = @browser.input(:id, 'input').visible?
   if exists1 == false
     puts 'Currently input is not visible'
     puts 'Will click input again'
     @browser.input(:id, 'check').click
     sleep 1
     exists2 = @browser.input(:id, 'input').visible?
     exists2.should == true
   end
  end
end

テストの内容は次のとおりです。

  1. チェックボックスのクリック
  2. が表示されているかどうかを確認し#inputます。これは false を返すはずです。
  3. チェックボックスをもう一度クリックします
  4. `#input が表示されているかどうかを確認します。これはtrueを返すはずです

.exists?要素がDOMに存在するため、これは常にtrueを返すため、使用しません。present?要素が存在し、ページに表示されている場合は true を返します。visible?要素が表示されているかどうかに応じて true/false を返します。

于 2013-09-20T16:29:17.317 に答える