Comment tester la propriété css dans rspec?

Question

J'utilise le plugin tabnav pour Rails et je veux utiliser rpsec pour m'assurer qu'il est bien mis en surbrillance.

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 

Cependant, le code ci-dessus ne semble pas fonctionner. J'utilise webrat avec rspec btw. De l'aide? Merci.

Answer 1

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 

, en particulier pour « ne met pas en évidence sur l'action erronée » scénarios, mais je pense c'est assez bon.

Answer 2

La seule vraie chose à tester ici est de savoir si un nom de classe particulier est appliqué ou non, si la mise en évidence provient d'un nom de classe. Si oui, vous pouvez faire have_tag("li.highlighted", :text => "Account Settings"). Sinon, vous ne devriez probablement pas automatiser vos tests pour savoir si les sélecteurs CSS sont correctement appliqués ou non. Ceci est un détail purement de présentation, et ce n'est pas vraiment ce qu'une suite de tests est conçue pour tester. Je suppose que Webrat ne prend pas la peine de passer votre feuille de style et de l'appliquer, il est donc impossible de tester ce détail, sans parler du fait que vous pouvez vérifier avec une seule page si cela fonctionne ou non - après tout, sans doute tester votre feuille de style que vous le concevez.

Quoi qu'il en soit. Votre question ne précise pas vraiment ce que vous essayez vraiment de tester, mais vous ne devriez pas tester la présentation, de toute façon. Test de la structure du document HTML est bon, mais la confirmation de la façon dont le programme client interprète le document est le rôle d'un concepteur, pas un programmeur. (Si vous portez deux chapeaux, de sorte que ce soit, mais ne vont pas mélanger vos aliments.) Vous pouvez écrire test plus

Answer 3

Si vous utilisez Sass vous pouvez analyser avec l'analyseur Sass:

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

Il retourne un arbre d'analyse que vous pouvez tester en plongeant en elle. Par exemple:

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')