Roots Discourse

Bedrock + Percy.io Visual Testing within 10 lines of code

#1

Catch visual bugs before they’re released to your customers

https://percy.io/visual-testing

Prepare

  1. Get a percy.io account
  2. Install system requirements
  3. Install the percy-capybara-bedrock gem
    $ cd /path/to/bedrock
    $ bundle add percy-capybara-bedrock
    

Define your tests

# <bedrock>/percy.rb
require "percy/capybara/bedrock/anywhere"

# URL pointing to the local or remote host
server = "http://localhost:8080"

# Absolute path to a web root directory
web_root = File.expand_path("../web/", __FILE__)

# Path where your webserver hosts the WordPress site
assets_base_url = "/"

Percy::Capybara::Bedrock::Anywhere.run(server, web_root, assets_base_url) do|page|
  page.visit("/")
  sleep(2)
  Percy::Capybara.snapshot(page, name:"Homepage")
end

More examples at https://github.com/ItinerisLtd/percy-capybara-bedrock#usage

Make sure your Bedrock site is up and running

Easilest way to make it runs at http://localhost:8080:

$ cd /path/to/bedrock
$ wp server --docroot=web

Run the tests

$ cd /path/to/bedrock
$ PERCY_TOKEN=my-secret-token PERCY_BRANCH=local PERCY_DEBUG=1 bundle exec ruby percy.rb

Challenge

If you have a simpler / more elegant solution, we are hiring.

Alt text

7 Likes

#2

Anyone tried this with trellis + bedrock + sage setup?

0 Likes

#3

I do.
Just run $ yarn build:production before starting the server.

0 Likes

#4

Ah great,

  1. Where/how did you place your percy settings files? I placed my in the top dir. percy, site, trellis

  2. Do you see any issues with this setup?

# &lt;bedrock&gt;/percy.rb

require "percy/capybara/bedrock/anywhere"

# URL pointing to the local or remote host

server = "http://my-site.test"

# Absolute path to a web root directory

web_root = File.expand_path("../../site/web", __FILE__)

# Path where your webserver hosts the WordPress site

assets_base_url = ""

# Capybara.register_driver :poltergeist do |app|

# Capybara::Poltergeist::Driver.new(app, {js_errors: false})

# end

Percy::Capybara::Bedrock::Anywhere.run(server, web_root, assets_base_url) do|page|

page.visit("/")

sleep(3)

Percy::Capybara.snapshot(page, name:"Homepage")

end
0 Likes

#5

As long as web_root is pointing to the correct folder, where to put percy.rb and Gemfile (or gems.rb) doesn’t matter.
It’s up to you to organize your code.

0 Likes

closed #6

This topic was automatically closed after 42 days. New replies are no longer allowed.

0 Likes