I have an application (Rails 4.0.4) that I upgraded from Bourbon 3.2 to Bourbon 4.0.0. After the upgrade, all my tests pass on my local machine, and everything looks fine when I click around in development. However, when I run the build on Travis, I get a handful of errors like these:
Failure/Error: click_link 'Yesterday' Capybara::Webkit::ClickFailed: Failed to click element /html/body/div[2]/div[2]/ul/li[1]/a because of overlapping element /html/body/nav[2]/div[1] at position 856, 49; A screenshot of the page at the time of the failure has been written to /tmp/click_failed_NA6879.png
However, it’s hard to get access to these screenshots. I’m working on the issue with Travis, but was wondering if any thoughtboters had similar problems when upgrading to Bourbon 4.
I’m not sure what the problem is, but I can suggest a couple of things. Have you tried running your app in production locally?
rake assets:precompile RAILS_ENV=production
rails s -e production
This will build your assets and start your server in production so you can see what travis is seeing. The troubles I usually have with assets and production is that they’re not compiling correctly. I often forget to add any extra base css files to my production.rb:
config.assets.precompile = %w( admin.css )
@edwardloveall, I managed to get the screenshots downloaded from Travis, and the images look nothing like my app in either development or production. Elements on the page are smushed (for lack of a better term) together and overlapping in unexpected ways. I can’t tell if this is a bug with Capybara-webkit or Webkit itself. For now I’m just locking on Bourbon 3.x, and I’m going to return to this in a bit.