7.1.3 Testing the user show page (with factories)

Now that we have a minimal working profile, it’s time to start working
on the version mocked up in Figure 7.1. As with the creation of static
pages (Chapter 3) and the User model (Chapter 6), we’ll proceed using
test-driven development.

Recall from Section 5.4.2 that we have elected to use integration tests
for the pages associated with the Users resource. In the case of the
signup page, our test first visits the signup_path and then checks for
the right h1 and title tags, as seen in Listing 5.34 and reproduced in
Listing 7.6. (Note that we’ve omitted the full_title helper from Section
5.3.4 since the full title is already adequately tested there.)
7.1.4 A Gravatar image and a sidebar

Having defined a basic user page in the previous section, we’ll now
flesh it out a little with a profile image for each user and the first
cut of the user sidebar. When making views, we’ll focus on the visual
appearance and not worry too much about the exact structure of the page,
which means that (at least for now) we won’t be writing tests. When we
come to more error-prone aspects of view, such as pagination (Section
9.3.3), we’ll resume test-driven development.

We’ll start by adding a “globally recognized avatar”, or Gravatar, to
the user profile.6 Originally created by Tom Preston-Werner (cofounder
of GitHub) and later acquired and scaled by Automattic (the makers of
WordPress), Gravatar is a free service that allows users to upload
images and associate them with email addresses they control. Gravatars
are a convenient way to include user profile images without going
through the trouble of managing image upload, cropping, and storage; all
we need to do is construct the proper Gravatar image URL using the
user’s email address and the corresponding Gravatar image will
automatically appear.7

Our plan is to define a gravatar_for helper function to return a
Gravatar image for a given user, as shown in Listing 7.12.
7.2.1 Tests for user signup

In the days before powerful web frameworks with full testing
capabilities, testing was often painful and error-prone. For example, to
test a signup page manually, we would have to visit the page in a
browser and then submit alternately invalid and valid data, verifying in
each case that the application’s behavior was correct. Moreover, we
would have to remember to repeat the process any time the application
changed. With RSpec and Capybara, we will be able to write expressive
tests to automate tasks that used to have to be done by hand.

We’ve already seen how Capybara supports an intuitive web-navigation
syntax. So far, we’ve mostly used visit to visit particular pages, but
Capybara can do a lot more, including filling in the kind of fields we
see in Figure 7.11 and clicking on the button.
7.2 Signup Form

Now that we have a working (though not yet complete) user profile page,
we’re ready to make a signup form for our site. We saw in Figure 5.9
(shown again in Figure 7.10) that the signup page is currently blank:
useless for signing up new users. The goal of this section is to start
changing this sad state of affairs by producing the signup form mocked
up in Figure 7.11.