Chapter 5.2 - Add Structure with RSpec

RSpec is a behavior-driven framework for Ruby and offers multiple libraries that can be used to work together. There are four different parts of RSpec:

rspec-core, which provides the spec runner and provides a way to organize code examples
There's rspec-expectations, which provides a readable API to express expected outcomes of code
There's also rspec-mocks
As well as rspec-rails

But for the purpose of this course, we will only be sticking to using these first two libraries, rspec-core and rspec-expectations.

So, let's go ahead now and start by using rspec-core.

To use rspec-core, I’ll need to add a “describe” block to my test, then I need to add an “it” block, which specifies what the test is doing.

First what I'll need to do, in order to use its API, is
```
require "rspec"
```
Then after that, I'll skip a line, and I need to write a describe block which specifies what this test is doing, which is automating a form
```
describe "automating a form" do
```
Then I'll at an it block to describe the purpose of this test, which is to submit a form
```
it "submits a form" do
```
Then I'll need to arrange the steps of the test so that they fit inside the describe and the it block, so I'll copy those and cut them, and then insert them on line 6 and then go ahead and save that.

# Form Test Example Code with RSpec Structure

require "selenium-webdriver"

require "rspec"

  describe "automating a form" do

    it "submits a form" do

      driver = Selenium::WebDriver.for :chrome

      driver.navigate.to "https://formy-project.herokuapp.com/form"

      driver.find_element(id: 'first-name').send_keys('John')

      driver.find_element(id: 'last-name').send_keys('Doe')

      driver.find_element(id: 'job-title').send_keys('QA')

      driver.find_element(id: 'radio-button-2').click

      driver.find_element(id: 'checkbox-2').click

      driver.find_element(css: 'option[value="2"]').click

      driver.find_element(id: 'datepicker').send_keys('05/25/2025')

      driver.find_element(id: 'datepicker').send_keys :return

      driver.find_element(css: '.btn.btn-lg.btn-primary').click

      driver.quit

    end

  end

And it's that easy to use rspec-core.

Now I want to make one more modification to this test, because each test should have a way to confirm the behavior being tested works as expected.

To confirm the form can be submitted, let's add a step for that using rspec-expectations.

Back at the test application, I filled out each element of the page and after submitting the page, it takes me to a thanks page where I see that the form was successfully submitted.

Now I can use rspec-expectations to express the expected outcome and confirm that this form was in fact submitted.

There are many ways to express outcomes, by equivalence, identity, comparisons and so on.

So, let's go ahead and use rspec-expectations' library to confirm that. A common way to express outcome is by equivalence, as you can see here, which expects an actual result to equal the expected result.

So here what we can do is write a statement to expect the actual banner text to equal the expected banner text, and again, the banner text is this text here that shows the form was successfully submitted. So, let's go ahead and write a step for this.

Going back to my test, before quitting the driver, what I want to do is to write an expectation. So that will look like expect the actual result dot to space equal the actual result — expect().to eql().

Next, I need to fill in the contents of this expectation, so first what I need to do is to grab the actual result. Popping over to the test application, what I can do is inspect this banner, and if I'm doing so, I see that it has a specific class here of “alert” and “alert_success”. So, I'm going to go ahead and just focus on this first class here.

Going back over to my test, inside expect I can get the text of that class with the name of “alert”
```
expect(driver.find_element(class: 'alert').text)
```
Then what I want to do is confirm that the text is equal to the text shown here on the screen, “The form was successfully submitted!'”. So, I'll copy that, go back over to the test and paste that string into the eql().
```
expect(driver.find_element(class: 'alert').text).to eql('The form was successfully submitted!')
```

Now that this class is complete, I'll save it and get ready to move onto to fun part of running the test.

Resources

Quiz

The quiz for Chapter 3 can be found at the end of Section 5.3

Add AI to your existing test scripts in minutes!