Translate

Saturday 23 August 2014

KnockoutJS, Jasmine but why PhantomJS ? - II

However, since Jasmine is based on testing Behavior against expectations, it is necessary to mention Behavior Driven Development (BDD) and the artifacts that matter for BDD like user stories, scenarios and enhancing code quality through better testability provided by tools like Slim (which enable creation of Scenarios and testing them (thereby, increasing the quality of code because in Agile, the simple thumb of rule is, the more testable the code, the better the quality of code.)), this brings us to the most relevant point of them all (that which is directly related to Agile) - how to select the right tool for an Agile team, not in terms of technical correctness but in terms of fitting in with the underlying development model!).

The tool must be selected in accordance to the basic principles of the model. For instance, BDD stresses on testing behavior foremost so Jasmine, Slim. But what about KnockoutJS?

KnockoutJS is the most compatible tool for an Agile development model like BDD because it allows for testing the changes to the View through the ViewModel ! This does not mean that to be Agile-compatible, a language has to provide for measures to test its view through the viewmodel but that the abilty to abstract the viewmodel away from the view allows for testing 'model' code independently!

To make it more clear, in HTML, if you were to enable instant change reflection to the client page, you will have to wire the onchange or keyup event for the control but can you test if it is working correctly? No. Because the code is wired within the HTML DOM and although there may be ways to access the HTML DOM (so to say), it is cumbersome, not possible to test independently and not suited for Agile. It is more like how fitNesse was used in .Net - contrived and hard-wired.

In the previous part, the reference to PhantomJS's console runner was only to enable GUI reporting of the Jasmine tests.

But, having said, it is not just for a web UI based test report that you need to use another tool; you could as well use the Jasmine test runner and achieve the same results as below:


The script is the same (as in part I) except that the Jasmine Test runner's HTML will no longer refer to PhantomJS's ConsoleRunner but instead to Jasmine's HTMLReporter !

Below is the HTML for the Jasmine's Test Runner.

<!DOCTYPE HTML>
<html>
<head>
  <title>Jasmine Test Runner</title>
  <link rel="stylesheet" type="text/css" href="Jasmine\lib\jasmine-1.2.0\jasmine.css" />
    <script type="text/javascript" src="Jasmine\lib\jasmine-1.2.0\jasmine.js"></script>
    <script type="text/javascript" src="Jasmine\lib\jasmine-1.2.0\jasmine-html.js"></script>
     
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
  <script type="text/javascript" src="knockoutjs.3.2.0\content\scripts\knockout-3.2.0.js"></script>
  <!-- SOURCE FILES -->
  <script type="text/javascript" src="helloko-script.js"></script>

  <!-- TEST FILES -->
  <script type="text/javascript" src="helloko-script-spec.js"></script>
</head>
<body>
<script type="text/javascript">
    (function() {      
        var jasmineEnv = jasmine.getEnv();      
        jasmineEnv.updateInterval = 1000;      
        var htmlReporter = new jasmine.HtmlReporter();      
        jasmineEnv.addReporter(htmlReporter);      
        jasmineEnv.specFilter = function(spec) {        
            return htmlReporter.specFilter(spec);      
        };
      
        var currentWindowOnload = window.onload;      
        window.onload = function() {        
            if (currentWindowOnload) {          
                currentWindowOnload();        
            }        
            execJasmine();      
        };      
        function execJasmine() {        
            jasmineEnv.execute();      
        }  
    })();
</script>
</body>
</html>

Alright, but what exactly am I driving at?

That, this much has only been unit testing of code.

If you want to use an Agile development method like BDD or TDD, the reporting plus the test tools themselves may have to be different due to many other artifacts of the Agile development life cycle like CI, E2E, Code Coverage etc.

And this is where tools like Slim come in. If you have already read my earlier post on using Jasmine and Slim, then the next part will have nothing new.

Next part - how to use Slim with KnockoutJS and Jasmine to enable BDD.


No comments: