1. small : Screen width upto 590.
2. medium : Screen width upto 1025.
3. large : Screen width uptp 1280.
Very soon we will add new category,
4. xlarge : above 1280+ ;)
Now all things are fine, but until you didn't write acceptance test, you can't make sure that your design is working fine for all screen.
Before taking responsive web design into consideration, we have already written feature specs using rspec + capybara (selenium).
So here we want handy configuration which will not affect existing feature spec and should treat existing specs meant to be written for large screen.
So here is, how I have added configuration for my rspec suite to target testing responsive design.
With above configuration, if you write any feature spec without :device_size then it will run that spec against 'large' screen. And if you want to write a spec for 'small' and 'medium' devices you can write by using metadata 'device_size => :small' or 'device_size => :medium'
feature "XYZ" do scenario "abc", :js => true do # spec with default screen size i.e large end scenario "abc", :js => true, :device_size => :small do # spec with small screen size end endWith the help of 'config.include ScreenSize, :type => :feature' you can directly change screen size into example.
feature "XYZ" do scenario "abc", :js => true do set_screen_size(:medium) # spec with default screen size i.e large end endIf you want to some special configuration based on device size you can do that using,
config.before(:each, :device_size => :small) do # special configuration ......... endTODO :
I want to split a test suite into feature/small/*.rb for small devices, feature/large/*.rb for large devices and so on.. and apply specific metadata configuration based on type of suite.