Как проверить свойство CSS в rspec? - PullRequest
Новая
       18

Как проверить свойство CSS в rspec?

3 голосов
/ 15 мая 2010

Я использую плагин tabnav для Rails и хочу использовать rpsec, чтобы убедиться, что он подсвечивается правильно. 

describe 'account navigation links' do
  it 'should have account settings link' do
   get '/account/settings'
   response.should have_tag("li", :text => "Account Settings")
end

 it 'should be highlighted' do
   get '/account/settings'
   response.should have_tag("li", :color => "Account Settings")
 end
end

Однако приведенный выше код не работает. Я использую вебрат с rspec, кстати. Любая помощь? Спасибо.

Ответы [ 3 ]

4 голосов
/ 15 мая 2010

Единственная реальная вещь, которая будет здесь протестирована, это то, применяется ли конкретное имя класса или нет, если выделение происходит из имени класса. Если это так, вы могли бы сделать have_tag("li.highlighted", :text => "Account Settings").

В противном случае вам, вероятно, не следует автоматизировать тестирование на предмет правильности применения селекторов CSS. Это чисто презентационная деталь, и не совсем то, для чего предназначен тестовый набор. Я подозреваю, что Webrat не потрудился пройти и применить вашу таблицу стилей для вас, поэтому тестирование этой детали неосуществимо, не говоря уже о том, что вы можете проверить с помощью загрузки только одной страницы, работает ли она или нет - в конце концов, вы возможно тестирование вашей таблицы стилей в процессе ее разработки .

Во всяком случае. Ваш вопрос на самом деле не дает четкого представления о том, что вы на самом деле пытаетесь проверить, но в любом случае вам не следует проверять презентацию. Тестирование структуры HTML-документа хорошо, но подтверждение того, как клиентская программа интерпретирует документ, является ролью дизайнера, а не программиста. (Если вы носите обе шляпы, пусть будет так, но не смешивайте свою еду.)

2 голосов
/ 15 мая 2010 
describe 'highlighting' do
  it 'should highlight account/settings' do
    get '/account/settings'
    response.should have_tag("a.active[href=?]", account_settings_path, /Account Settings/i)
  end

  it 'should highlight account/profile' do
    get '/account/profile'
    response.should have_tag("a.active[href=?]", account_profile_path, /Profile Information/i)
  end

  it 'should highlight account/picture' do
    get '/account/picture'
    response.should have_tag("a.active[href=?]", account_picture_path, /Profile Picture/i)
  end

  it 'should highlight account/notifications' do
    get '/account/notifications'
    response.should have_tag("a.active[href=?]", account_notifications_path, /Notifications/i)
  end

  it 'should not highlight Profile' do
    get '/account/profile'
    response.should_not have_tag("a.active[href=?]", account_settings_path, /Account Settings/i)
  end

  it 'should not highlight Notifications' do
    get '/account/profile'
    response.should_not have_tag("a.active[href=?]", account_notifications_path, /Notifications/i)
  end

  it 'should not highlight Picture' do
    get '/account/profile'
    response.should_not have_tag("a.active[href=?]", account_picture_path, /Profile Picture/i)
  end
end

Вы могли бы написать больше тестов, особенно для сценариев "не выдвигать на первый план неправильное действие", но я думаю, что это достаточно хорошо.

1 голос
/ 27 июня 2012

Если вы используете Sass, вы можете проанализировать его с помощью анализатора Sass: 

root = Sass::SCSS::Parser.new('.error { color: red; }', 'example.scss').parse

Возвращает дерево разбора, которое вы могли проверить, погрузившись в него. Например: 

prop = root.children.select {|child| child.rule.flatten.include?('.error')}.first
prop_strings = prop.children.map {|p| [p.name.flatten.first, p.value].join(':')}
prop_strings.should include?('color:red')
...