3

コンテキスト:ユーザーがログインして自分のプロファイルを参照している場合、ユーザーは自分のアバターをクリックできます。このクリックにより、[アバターのアップロード] オプションを含むドロップダウン メニューが表示されます。ユーザーがこのオプションをクリックすると、アバターの新しい画像をアップロードするためのフォームを含むモーダルが開きます。ドロップダウン (およびモーダル) を処理するために Twitter ブートストラップを使用しています。

もちろん、私はこれをテストしたいと思います。しかし、方法がわかりません。

モーダル テストはおそらくほぼ同じなので、ドロップダウン機能に集中しましょう。

最初はカピバラを使おうと思っていたのですが、CSSプロパティdisplay: noneやdisplay: block. hiddenカピバラのようなクラスをチェックするようにアドバイスする人もいると読みました。ただし、この場合、私は Twitter Bootstrap を使用しているdropdownため、たとえばインスタンスしかありません。

そして、テストできるようにするためだけにブートストラップの動作を変更したくありません。それはにおいになります。

これが私のrspecスイートのサンプルです:

describe 'should display a dropdown menu' do
   let(:user) { FactoryGirl.create :user }
   before do
     sign_in_as user
     # I have routes just like that: /1/firstname-lastname
     visit(profile_path(id: user.id, first: user.first_name.downcase, last: user.last_name.downcase))

     click_link 'avatar-dropdown'
   end
   it { should have_css('.dropdown-menu', visible: true) }
   describe 'with an upload link' do [...] end
end

HTML は次のようになります。

<div class="dropdown" id="avatar-menu">
  <a class="dropdown-toggle" id="avatar-dropdown" data-toggle="dropdown" href="#avatar-menu">
    <%= @user.avatar %>
  </a>
  <ul class="dropdown-menu">
    <li><a class="upload-avatar" href="#">Upload an image</a></li>
  </ul>
</div> <!-- #upload-menu -->

もちろん、 はtwitter ブートストラップの CSS によって設定されvisible: trueているため、 では機能しません。display: none

そこで、Jasmine でこの動作をテストしようと考えました (飛び込む良い機会です) が、そうすると、ユーザーをどのように登録すればよいでしょうか? テストデータベースを共有しているかどうかはわかりませんが、ファクトリーガールを使用してJasmineで新しいユーザーを生成できるとは思いませんか? Jasmine の登録ページにアクセスして (可能であれば?)、フォームを送信するだけで問題が解決するかどうかさえわかりません。認証も同様。

これらの動作をテストするにはどうすればよいですか? カピバラ(コツとかある？)かジャスミン(じゃあどうすればいいの？)

ありがとう ！

4

2 に答える 2

2

さて、私はなんとかカピバラをうまく動かすことができました。他のすべてのケースでうまくいくかどうかはわかりませんが、私の場合はうまくいきました：

またはのいずれかに渡して、Capybara のSeleniumをアクティブ化する必要があります。js: truedescribeit

describe 'should display a dropdown menu', js: true do
   let(:user) { FactoryGirl.create :user }
   before do
     sign_in_as user
     # I have routes just like that: /1/firstname-lastname
     visit(profile_path(id: user.id, first: user.first_name.downcase, last: user.last_name.downcase))

     click_link 'avatar-dropdown'
   end
   it { should have_css('.dropdown-menu', visible: true) }
   describe 'with an upload link' do [...] end
end

このようにして、カピバラは属性が表示されているかどうかを実際にチェックしているようです。また、テストを実行するたびに Firefox が起動するので、かなり面倒です。

于 2012-07-12T06:45:59.407 に答える
1

最初はカピバラを使うことを考えていましたが、CSSプロパティdisplay：noneまたはdisplay：blockで要素が表示されているかどうかを確認する方法はありません。

あなたは次のようなことをすることはできません：

page.has_xpath?("/xpath/here[contains(@style, 'display: block')]")

ここで、「display：none」は、非表示の場合、「display：block」を置き換えます。

于 2012-07-31T17:52:13.803 に答える