Getting started with Jasmine (Part 1)


Recently i got a chance to work with jasmine, it is really very nice JavaScript open source framework for writing the unit test case. In coming days i will continue to write more article on this topic.

what is the Jasmine ?
Jasmine is an open source testing framework for JavaScript code. Jasmine follows Behavior Driven Development (BDD) procedure to ensure that each line of JavaScript statement is properly unit tested.

How to implement the Jasmine test case for JavaScript code ?

we can include the jasmine framework either online or offline, for offline we have to download the library from this path https://jasmine.github.io/ or we can include the CDN online path laike below example.

In below example we will write the sample java-script function and test case in jasmine.

Step 1: Include the jasmine library as given below.



<html>
<head>
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.3.3/jasmine.min.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.3.3/jasmine.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.3.3/jasmine-html.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.3.3/boot.min.js"></script>


    <!--<link rel="shortcut icon" type="image/png" href="../lib/jasmine-3.3.0/jasmine_favicon.png">
    <link rel="stylesheet" href="../lib/jasmine-3.3.0/jasmine.css">
    <script src="../lib/jasmine-3.3.0/jasmine.js"></script>
    <script src="../lib/jasmine-3.3.0/jasmine-html.js"></script>
    <script src="../lib/jasmine-3.3.0/boot.js"></script>-->

    <script type="text/javascript">

        var calculator = {
            sum: function (x, y) {
                return x + y;
            },
            subtract: function (x, y) {
                return x - y;
            },
            divide: function (x, y) {
                return (y === 0) ? 0 : x / y;
            }
        }

        // The tests
        describe('calculator', function () {

            describe('sum', function () {
                it('1 + 1 should equal 2', function () {
                    expect(calculator.sum(1, 1)).toBe(2);
                });
            });

            describe('subtract', function () {
                it('3 - 2 should equal 1', function () {
                    expect(calculator.subtract(3, 2)).toBe(1);
                });
            });

            describe('divide', function () {
                it('10 / 5 should equal 2', function () {
                    expect(calculator.divide(10, 5)).toBe(2);
                });

                it('zero divisor should equal 0', function () {
                    expect(calculator.divide(10, 0)).toBe(0);
                });
            });
        });

    </script>
</head>
<body>
</body>

</html>
  

Explanation: In the above example we show that we have written simple java-script function for summation, subtraction and division.

We have also written the Jasmine test case to validate the functionality. In jasmine framework,

describe : is used for giving the details about the test case.

It: It takes a string that explains expected behavior and a function that tests it.

expect : what would be the expected value on basis of given input. It validate the java script function with expected output value.

tobe: what should be the expected value on basis of input.