26

div タグに特定の CSS スタイルがあるかどうかをどのようにテストしますか? display:none;またはがあるかどうかをテストしようとしていdisplay:blockます。

次のことを試しましたが、エラーが発生しました。

it {should have_selector('signup_server_generic_errors', /display:\s*none/)}
4

4 に答える 4

41

css スタイルを見つけようとする代わりに、css クラス名を見つけるテストを作成することをお勧めします。

このようにして、クラスを同じに保ちながら、基礎となる css スタイルを変更することができ、テストは引き続きパスします。

根底にあるスタイルを探すのは脆い。スタイルは頻繁に変わります。特定のスタイル要素を見つけることに基づいて rspec を作成すると、テストがより脆弱になります。div のルック アンド フィールを変更するだけでは、テストが失敗する可能性が高くなります。

CSS クラスの検索に基づいてテストを行うと、テストがより堅牢になります。ページのスタイルを変更するときにコードを変更する必要がなく、コードが正しく機能していることを確認できます。

この場合、具体的には、要素を非表示にするために.hidden設定するという名前の css クラスを定義することが 1 つのオプションです。display:none;

このような：

CSS:

.hidden {
  display:none;
}

html:

<div class="hidden">HIDE ME!</div>

カピバラ：

it {should have_css('div.hidden') }

このカピバラは、クラスを持つ div を探すだけhiddenです。必要に応じて、このマッチャーをより洗練されたものにすることができます。

しかし、要点はこれです。スタイルを css クラス名に添付してから、テストをスタイルではなくクラスに結び付けます。

于 2012-06-29T04:11:50.133 に答える
12

has_css?マッチャーを使用できます。オプションを受け入れることができ:visibleます。詳細については、ドキュメントを確認できます: http://rdoc.info/github/jnicklas/capybara/Capybara/Node/Matchers#has_css%3F-instance_method

たとえば、次のことを試すことができます。

it { should have_css('div.with-some-class', :visible => true) }
于 2012-07-02T07:03:04.143 に答える
9

要素に特定のクラスがあることを確認する私の方法:

let(:action_items) { page.find('div.action_items') }

it "action items displayed as buttons" do
  action_items.all(:css, 'a').each do |ai|
    expect(ai[:class]).to match(/btn/)
  end
end

またはこのようなもの

expect(ai[:style]).to match(/color: red/)

ここで見つけました：http://rubydoc.info/github/jnicklas/capybara/Capybara/Node/Element#%5B%5D-instance_method

于 2014-06-10T10:21:00.343 に答える
2

Capybara のassert_matches_style、または Rspec HaveStyleマッチャー (下で assert_matches_style を使用しています) を使用できます。

assert_matches_style を直接使用すると、次のようになります。

find(".element").assert_matches_style("font-size" => "46px")

私は Rspec 構文にあまり詳しくありませんが、次のようなものにする必要があります。

it { should match_style("font-size" => "46px") }
于 2020-07-03T09:23:33.630 に答える