Subscribe now

Using Formulae and Testing [09.08.2017]

  • How we created the gem
    • How we wrapped the API
    • How we tested the API
  • Using Formulae in a Rails project

In previous episodes, we saw the back-end of Formulae and the front-end. Today, we will see how we built our ruby library to be used with any ruby project, and check how Formulae can be used inside a Rails project.

We have here at DailyDrip two interesting episodes that can help you create a gem for Ruby.

First episode is [wrapping a REST API into a gem]((https://www.dailydrip.com/topics/rails/drips/wrapping-a-rest-api).

The second episode is Testing HTTP requests using VCR.

I will get the best parts of these two episodes: explaining how we wrap our Formulae API library into a gem, and test the HTTP requests.

How our Gem should be

Our API has some endpoints: Form, Sections, Questions and others. We need to have a way to interact with this API from a ruby code. We will worry only with the Form endpoint.

With this in mind, our gem should have have at least two functionalities:

  • Get all Forms
FormulaeRuby::FormClient.new(api_key: 'API_KEY').all
  • Get a Specific Form
FormulaeRuby::FormClient.new(api_key: 'API_KEY').find(1)

We will have a FormClient class, we pass the API_KEY and then we can look for a specific form or get all the forms.

Wrapping the REST Api

To make requests to our API, we will need to use some library to make HTTP requests, we will use Faraday.

We have in our gem clients and resources. The clients connect with the API and the resources store the data we receive.

We created a gem to do that. Here you can see the gemspec and the dependencies we are using.

vim formulae_ruby.gemspec
...
  # Development Dependencies

  spec.add_development_dependency 'bundler', '~> 1.14'
  spec.add_development_dependency 'rake', '~> 10.0'
  spec.add_development_dependency 'rspec', '~> 3.0'
  spec.add_development_dependency 'byebug'
  spec.add_development_dependency 'webmock'

  # Dependencies
  spec.add_dependency 'faraday'
  spec.add_dependency 'faraday_middleware'
  spec.add_dependency 'json'
end

Faraday to handle the HTTP requests, rspec to our tests and webmock. We will talk more about tests in a minute.

On this file, we import all the files we are using:

vim lib/formulae_ruby.rb
require 'faraday'

# Base
require 'formulae_ruby/version'
require 'formulae_ruby/config'
require 'formulae_ruby/clients/base_client'
require 'formulae_ruby/json_converter'

# Form
require 'formulae_ruby/resources/form'
require 'formulae_ruby/clients/form_client'

# Section
require 'formulae_ruby/resources/section'

# Question
require 'formulae_ruby/resources/question'

# QuestionDependency
require 'formulae_ruby/resources/question_dependency'

# Choice
require 'formulae_ruby/resources/choice'

Here are all the endpoints we have and the FormClient, the only client we are using for the moment.

Testing our API

We used rspec and webmock to test our app. Rspec to test our models and webmock to help us with the client test. We shouldn't rely on our API to make tests. Additionally, our tests make HTTP requests. It can make our API slow, especially if your API has a rate limit.

Here is an example of how we are testing our api using webmock.

      def all
        json = JSON.parse(File.read('./spec/responses/form_all.json'))

        stub_request(:get, 'http://localhost:3000/api/v1/forms/')
          .with(headers: headers)
          .to_return(status: 200, body: json)
      end
...

Here we are mocking our requests. So, our requests coming from here will return what we want and they will not touch the API. Take some time watching these two episodes they will give you an overview on testing an API and Wrapping it into a gem.

Using Formulae in a Rails project

Let's take a look at how we can use a Formulae in a rails application. We have a Rails 5.1 project, and we want to import use of our formulae library on it. How can we use it?

In our package.json we can add the formulae_react as a npm package.

...
  "name": "formulae_example",
  "private": true,
  "dependencies": {
    "@dailydrip/formulae_react": "0.3.8",
    "autoprefixer": "^7.1.1",
...

Now you can just use it in inside your rails project. We will put this inside of our javascript pack.

We can import our formulae_react.

import {
  RespondToForm,
  AdministerForm,
  Api,
  Stores
} from "@dailydrip/formulae_react";

And we can use it. In our pack, we pass our store and we render the element in a div.

  ReactDOM.render(
      <Provider store={RespondToFormStore}>
        <div>
          <RespondToForm displaySectionsAs="HEADINGS" />
        </div>
      </Provider>,
      document.getElementById("respond-to-form")
    );

    // Example for AdministerForm
    ReactDOM.render(
      <Provider store={AdministerFormStore}>
        <AdministerForm />
      </Provider>,
      document.getElementById("administer-form")
    );

In our rails view, we can call the function we created in our pack and pass the arguments from our rails controller. Running it with webpack will make our component work :)

<div id="respond-to-form"></div>

<script>
  var el = document.getElementById("respond-to-form");
  loadRespondToForm(el, "<%= @form_id %>", "<%= @form_display %>");
</script>

Summary

We saw we wrapped our API into a gem, how we tested this gem and how to use our Formulae react library in a Rails project using webpack.

Resources