Abstract

GitHub has just launched Atom Editor, I am using it quite a lot and posted a blog on how to install and setup atom editor on Mac OSX. Since the Atom has grown rapidly and community is adding lots of packages to improve experience of Atom.

While working in the Behaviour Driven Development (BDD), we use various BDD tools like Cucumber (@cucumber_pro) and Behat (@BehatPHP) and we expect editor support to make our life easier. Sublime Text has been my favourite editor as of now as it supports BDD tools very well. Since Atom comes in place, it looks promising.

In this short tutorial, we will see

• Decorating Atom Editor 
• Installing Cucumber and BDD related packages(Cucumber, Ruby, Bundler, TravisCI, Rake)
• Using Atom Packages in the Cucumber Project
• Video Demo

Decorating Atom

You can decorate Atom editor with UI Themes and Syntax Themes and have experimented many UI and Syntax themes and liked combination of UI theme ‘Atom Dark‘ and Syntax theme ‘Ninja-syntax“. You can install them by following commands

You can them configure these themes from the Atom settings by pressing “cmd + ,” key from your Mac. Now My Atom is looking like this:

Now, you can setup your favourite font size and font-family from the Atom setting.

Installing BDD related Packages

You need few basic set of packages from the existing packages available on Atom’s website. Here we will see some useful packages

Git Related Packages:

Here are some useful packages required to configure with GitHub. You can install these packages from the command line. Let’s search all Git related packages and install them

This will give you list of packages related to git and you can pick some useful and install. I have installed following packages

This will give us enough to config github with Atom Editor. There is nice blog post to see Git integration for the Atom.

BDD Related Packages:

Cucumber

There are some cucumber related packages available for cucumber

I have installed cucumber, cucumber-runner, and cucumber steps packages.

There is some Gherkin related packages available for Atom for behat.

If you are using Capybara/Rspec you can use some snippets

Ruby, Bundler and Travis Related

There some nice packages related to ruby, RubyGems, Bundler and TravisCI. You can install these packages

These packages will be enough to get started with Cucumber project.

Using Packages in the Atom

Now that, we have all necessary packages installed for Aom. Let’s see how to use them in our Cucumber Project. I have used Demo project “Cuke-Experiement” . Clone the project and launch atom

Using Ruby-Bundler

We have installed Ruby-Bundler package for Atom.  Let’s open ‘Gemfile’ in our project and in the fuzzy-finder (cmd+Shift+P) type “Bundler” we will see “Bundle Install” and Bundle List” commands.

Bundle Install will install bundler and ‘Bundle List’ will show all the RubyGems installed. You will watch it in the Video Demo below.

 

Using Cucumber-Runner

Cucumber Runner is another important package which runs Cucumber in the Atom editor. You just need to open an ‘feature’ file you want to run. Right click will give you an options

Run Feature File: This will run an entire feature file with Cucumber.

Run Cucumber at Line: This will run Cucumber for only that particular step.

 

Using Test-Status

Test-Status is cool package which will scan ‘Rakefile’, ‘Gruntfile in your project and run test. Rakefile will use ‘rake test’ and Gruntfile will use ‘grunt test’ . We need to add following snippet to our “./atom/config.cson” file

Now that, in our project we got an Rakefile, from fuzzy finder type “test status”  this will give an option to ‘Test Status: Run Test’

This will run ‘rake test’ and log output. While tests are running, output status will turn orange and will turn back to Green or Red as per test status.

You can also track status of TravisCI build in the status bar. It’s Green at the moment.

Video Demo

HAPPY BDD with GitHub’s 21 Century Editor !!