{"id":1635,"date":"2017-07-03T10:18:03","date_gmt":"2017-07-03T04:48:03","guid":{"rendered":"https:\/\/www.botreetechnologies.com\/blog\/?p=1635"},"modified":"2021-01-11T10:37:47","modified_gmt":"2021-01-11T05:07:47","slug":"test-rails-app-using-mocha-js-chai-js","status":"publish","type":"post","link":"https:\/\/www.botreetechnologies.com\/blog\/test-rails-app-using-mocha-js-chai-js\/","title":{"rendered":"How to Test Rails App using Mocha JS and Chai JS?"},"content":{"rendered":"\n

It has been quite some time since we started writing RSpecs<\/a> for our Rails applications. We had written tests for our rails models<\/b>, views<\/b> and controllers<\/b>. So whole MVC<\/b><\/a> part was covered with tests.<\/p>\n\n\n\n

In the beginning we had very less JavaScript code in our applications but with the time passing by our app’s Javascript code increased exponentially. With more than 1000<\/i> Javascript functions, we started to feel we need tests for this since we cannot test all this manually.<\/p>\n\n\n\n

After digging many links and resources we found following popular Javascript testing frameworks which works with our rails app.<\/p>\n\n\n\n

  1. Konacha<\/a> (Mocha JS<\/a> and Chai JS<\/a>)<\/li>
  2. Teaspoon<\/a><\/li><\/ol>\n\n\n\n

    We were amused by the syntax provided by konacha gem.<\/p>\n\n\n\n

    expect(add(1, 2)).to.equal(3);<\/pre>\n\n\n\n
    \"syntax
    Sounds similar (The DeadPool style)!!<\/figcaption><\/figure><\/div>\n\n\n\n
    This is very similar to our RSpec syntax. And since we were familiar to rspecs we decided to choose konacha<\/b> gem as our alternative. So why to wait, let us start integrating this with our rails app.<\/p>\n\n\n\n
    How to add?<\/h3>\n\n\n\n
    We just need to add it to our gemfile<\/p>\n\n\n\n
    group :test, :development do\ngem 'konacha'\nend<\/pre>\n\n\n\n
    Just do $ bundle install<\/code> in your command line. And we are good to go!<\/p>\n\n\n\n
    How it can be used?<\/h3>\n\n\n\n
    Now we need to create a directory named javascripts<\/code> in our spec<\/code> folder. The following command will take care of it!<\/p>\n\n\n\n
    $ mkdir spec\/javascripts<\/pre>\n\n\n\n
    Any test files that we add in this folder must have suffix<\/b> as _spec<\/code> or _tests<\/code>.<\/p>\n\n\n\n
    Note: We can change the above suffix in the config\/initializers\/konacha.rb<\/code>but I advise not to change that configuration and try to keep things simple \ud83d\ude42<\/p><\/blockquote>\n\n\n\n
    Life is really simple, but we insist on making it complicated… – Confucius<\/p><\/blockquote>\n\n\n\n
    We can write our tests in Javascript(.js<\/code>)or CoffeeScript(.coffee<\/code>). Lets take a very simple Javascript example. Suppose you want to test the Javascript code written in file at app\/assets\/javascripts\/calculator.js<\/code><\/p>\n\n\n\n