Now Playing Tracks

CukeUp 2014, London and Me

CukeUp 2014, London

CukeUp 2014  is an amazing conference organised by @skillsmatter, London. I am one of the lucky person who got last moment opportunity to speak at Cukeup 2014. There are many interesting talks including @aslak_hellesoy creator of Cucumber and @everzet creator of Behat.

There are many interesting speakers including Matt Wyne, Seb Rose and Many more ..More info found on CukeUp Programmes page

CukeUp Conference & Me

How I spoken at CukeUp?

There is an interesting story, how I became part  of CukeUp, London. My talk on “Headless BDD” put forward by SkillsMatter just a day before Conference and interesting thing is I haven’t seen the email on that day. I saw this email on the day of conference and contacted SkillsMatter if there is still possibility that I can talk. We agreed and my talk put forward and I got an chance to join an amazing conference . I prepared myself in couple of hour and got ready to speak.

I don’t think my preparation was good enough, my talk wasn’t great but it was OK considering time I got for preparation. Here are the Skill-Cast of the my talk, you need to be registered with SkillsMatter in order to watch it.

Day 1: Panel Discussion

I reached SkillsMatter at around 1 PM and need to prepare slides of my talk. The friendly SkillsMatter guys helped me to get relaxed. I just heard few talks from @everzet and @sebrose then there was my ill prepared talk.

After my talk, there were nice beers and pizza waiting for us. Panel discussion was very interesting, It was nice to hear thoughts of BDD practitioners from  @cucumber_pro and many other interesting panel member.

pannel Discussion

 After the discussion, we headed to nice bar ‘1920‘ for discussion in the pub.

Day 2 : Workshops

BDD in PHP with Behat

There were few hands-on workshops on the second day of the cukeup. It was very difficult choice to choose one from them. I been to ‘Impact Mapping’ one but in 5 minutes, I realised that it wasn’t for me. I want to learn something technical so, I decided to go for BDD in PHP with Behat. I was familier with Behat but there were many new things I learned from this workshop,

  • BDD Process in detail
  • Impact Mapping
  • Feature Mapping
  • User Story
  • Application development with BDD and Behat.

Thanks @everzet for such a informative session.

Cucumber JS with node, AngularJS and friends

Second session was on CucumberJS. NodeJS seems interesting but I was ended up just by typing code from screen.

Conclusion

In Summary, It was an awesome conference arranged by the SkillsMatter. Look forward to attend more conferences related to BDD.

The post CukeUp 2014, London and Me appeared first on BDD Test Automation & Open-Source Tools.



via BDD Test Automation & Open-Source Tools http://ift.tt/1qlzZaD

Behat Mink and headless ZombieJS [Updated]

Behat-Zombie

Hope you had enjoyed my previous blog post about setting up Behat-Mink and Zombie driver. It was broken due to latest changes in the driver.

Here are some updates, you need to do in order to get it working

Upgrade Node

$ brew upgrade node

Upgrade npm

$ sudo npm update npm

Once you upgrade node and npm then you need to update behat.yml pointing to node_module as shown in the video below.

Watch Video Demo

 

 

The post Behat Mink and headless ZombieJS [Updated] appeared first on BDD Test Automation & Open-Source Tools.



via BDD Test Automation & Open-Source Tools http://ift.tt/1onjzky

Javascript Coverage & Continuous Integration with Jenkins, QUnit and Grunt

QUnit and Grunt

QUnit is a powerful a javascript unit testing framework. Like other unit testing frameworks, it would be quite useful to measure code coverage of the JavaScript code using some modern code coverage tools.

Grunt is a javascript task runner. Like other build tools Rake, Ant, maven, phing, Grunt is a build tool for JavaScript tasks. In this short post, we will see how to setup continuous integration  for JavaScript code coverage using Grunt and other useful grunt plug-ins. I have forked source-code of  ”Qunit-Demo-Advance” from GitHub. Source-Code for this demo is available on GitHub ” Modern-Toolkit” repo.

Grunt plug-ins used in this Demo are

 Configuration

Pre-requisite:

Assuming you got awesome project using all cutting edge tools so you must using nodeJS and Grunt. In your ‘package.json’ file you have all node related dependencies. Im your ‘package.json’  add following Grunt plug-ins to generate javaScript code coverage and JUnit kind of reporting

$ vim package.json

Add following Devdependencies,

{
    "version": "0.1.1-1",
    "description": "Demo of the latest Tools",
    "engine": "node 1.1.x",
    "devDependencies": {
        "grunt-cli": "0.1.6",
        "grunt": "~0.4.0",
        "grunt-contrib-clean": "~0.4.0",
        "grunt-contrib-jshint": "~0.7.0",
        "grunt-contrib-qunit": "~0.3.0",
        "grunt-contrib-connect": "~0.6.0",
        "grunt-qunit-junit": "~0.1.0",
        "grunt-qunit-cov": "~0.3.2",
        "grunt-qunit-istanbul" : "*",
        "grunt-contrib-csslint": "*",
        "grunt-parallel-behat" : "*"
    }

Note, we have got “grunt-qunit-junit” and “grunt-qunit-istanbul” to generate coverage and reports. Now, let’s install those dependencies.

$ npm install

This will install all our dependencies in the ‘node_modules’ directory.

Now that, we need to configure ‘Gruntfile.JS’ to generate code coverage and JUnit reports. Let’s add following tasks to our existing ‘Gruntfile.JS’

 grunt.registerTask('default', ['qunit_junit', 'qunit']);
 grunt.loadNpmTasks('grunt-contrib-qunit');
    grunt.loadNpmTasks('grunt-qunit-istanbul');
    gruntConfig.qunit = {
        src: ['static/test/index.html'],
        options: {
        coverage: {
          src: ['static/js/**/*.js'],
          instrumentedFiles: 'temp/',
          htmlReport: 'report/coverage',
          coberturaReport: 'report/',
          linesThresholdPct: 20
        }
        }
    };
    grunt.loadNpmTasks('grunt-qunit-junit');
    gruntConfig.qunit_junit = {
        options: {
            dest: 'report/'
        }
    };

We have now configured “quint” task to generate HTML, and coburtura code coverage reports and “quint-junit” task to generate JUnit style reporting.

Now, Let’s run grunt to see it in action

$ ./node_modules/.bin/grunt

This will create all sort of reports in the ‘report’ directory.

grunt-qunit

Now that, we have all xml reports in the ‘report’ directory and HTML reports in the ‘reports/coverage’ directory. In the next section, we will configure it with Jenkins Continuous Integration server.

Jenkins and JS Code Coverage

Setting CI Job

Let’s set up CI job to generate Code Coverage reports. We need to install few basic Jenkins plug-ins like ‘Cobertura‘ and HTML Publisher‘, ‘JUnit reports’ etc. Now  we will create a new job ‘Jenkins-Grunt’ pointing SCM as Git repo “Modern-Toolkit

New-Project-Grunt

Now, we will configure NPM PATH and all reports as follows

config

Let’s save this config and run a build. Once we ran the build we will get following Dashboard with all sort of reports:

jenkins-grunt

Now, we got Code Coverage report, Cobertura report and HTML reports. Following those links, we will see

Cobertura Report

cobertura-reports

JS Coverage HTML Report

html-coverage-qunit

Video Demo

You can watch video demo on Youtube

Source – Code

Modern-Toolkit” GitHub

Conclusion

Grunt is awesome task runner for JavaScript and Generate JavaScript Code Coverage reports on CI using awesome Grunt plug-ins became so simple. Thanks to Jenkins and Grunt!

The post Javascript Coverage & Continuous Integration with Jenkins, QUnit and Grunt appeared first on BDD Test Automation & Open-Source Tools.



via BDD Test Automation & Open-Source Tools http://ift.tt/1hSkfFN

Cucumber, BDD and 21st Century Hackable Atom Editor

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

$ apm install atom-dark-ui
$ apm install ninja-syntax

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

Atom DarkUI and ninja

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

$ apm search git

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

$ apm install git-diff
$ apm install git-difftool
$ apm install language-git
$ apm install github-web

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

$ apm search cucumber

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

cucumber

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

$ apm install behat-atom

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

$ apm install capybara-snippets
$ apm install rspec
$ apm install rspec-snippets

Ruby, Bundler and Travis Related

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

$ apm install test-status
$ apm install ruby-bundler
$ apm install travis-ci-status

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

$ git clone http://ift.tt/1aX5IuN
$ cd Cuke_Experiement
$ 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.

ruby-bundler

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.

cucumber-runner

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

'test-status':
  'Rakefile': 'rake test'
  'Gruntfile.*': 'grunt spec'
  'gulpfile': 'gulp test'

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.

Rake-atom

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 !!

The post Cucumber, BDD and 21st Century Hackable Atom Editor appeared first on BDD Test Automation & Open-Source Tools.



via BDD Test Automation & Open-Source Tools http://ift.tt/1gbHXQI
To Tumblr, Love Pixel Union