EzDevInfo.com

expect.js

Minimalistic BDD-style assertions for Node.JS and the browser.

making jasmine to work with expect.js

I am using expect.js for assertion.

Now I need to write tests using jasmine. I would like to continue using expect.js.

However, when I try, async tests don't fail nicely

it('should fail nicely', function(done){

    setTimeout(function(){
         expect(1+1).to.be(3); // will not output which test+assertion failed
         done();
    }

})

when I use jasmine's expect, everything seems to work nicely, and the reporters say which test failed properly.

I can use try/catch on every test and call fail, but that is a real bummer.

How can I make this work easily?


Source: (StackOverflow)

Testing, do I need to add more Return statements to my functions?

I would like to start using a test framework, mocha + expect seem good to me.

Say i have this function,

/*
 * Hides or shows loading .gif
 * show : boolean
 */
function loadingMsg(show) {
    var $loader = $("#loader");
    if(show){
        $loader.show();
    }
    else{
        $loader.hide();
    }
}

To make it testable, do I need to add Return statements like below?

/*
 * Hides or shows loading .gif
 * show : boolean
 */
function loadingMsg(show) {
    var $loader = $("#loader");
    if($loader){
        if(show){
            $loader.show();
            return "loader shown";
        }
        else{
            $loader.hide();
            return "loader shown";
        }
    }
    else {
        return "$loader undefined";
    }
}

Or should I be testing the dom element "loader"?


Source: (StackOverflow)

Advertisements

Expect.js validation issue on Codeacademy Lesson

I am creating a lesson on codeacademy that enables users to learn about the creation of HTML forms. This is mostly for my own entertainment, just so we're all on the same page. After reading the submission test guidelines and API I decided to use expect.js to handle the bulk of my validation since I need to traverse the DOM.

So the lesson I am creating asks the users to create two label elements (with content inside the label tags) and two input fields (with the type attribute defined and the value set to text). So again, the criteria are as follows:

  1. Create two <label> elements inside the <form> element. Be sure to indicate what the user will be filling out!
  2. Create two <input> elements below each of the <label> elements. Be sure to include and define the type attribute!

Let's assume I have the following code:

<!DOCTYPE html>
<html>
    <head>
        <title></title>
    </head>
    <body>
        <form>
            <label>Foo</label>
            <input type="text">
            <label>Bar</label>
            <!-- should below here here -->
            <input>
        </form>
    </body>
</html>

This will pass. From my understanding of how expect.js operates and my current validation, it should not pass because the user neglected to add the second type="text" attribute

My validation criteria are as follows:

// do the items exist?
$expect('form > label').to.have.items(2, 'Did you forget to create two <label></label> tags?').and.to.have.text(/[a-zA-Z0-9]{1,}/i, 'Do the label tags have information inside of them? <label>My Label</label>');
$expect('form > input').to.have.items(2, 'Did you forget to create two <input> tags?').and.to.have.attr('type', 'text');

// do input fields exist below labels?
$expect('label').to.have.siblings('input', "Are the input fields below the labels?");

If the user submits the HTML code then it should fail, however it is passing. My disconnect is when the user enters the second set of <label> and <input> tags. If they omit content within the second <label> and/or the type attribute with a value of text it will still pass.

Is there something special or unique that I am missing here? I have tried the validation code supplied above with and without out method chaining with no avail.

What I have Tried

  1. Looked on Codeacademy for any hints on how to rectify this issue
  2. Looked on expect.js README for any hints
  3. Looking on StackOverflow for any hints
  4. Removed method chaining and reestablished method chaining

Source: (StackOverflow)

Socket.IO server not receiving message from client

I'm playing around with Node, Socket.IO and BDD by creating a chat application. During one of the tests, I get a timeout error stating:

Error: timeout of 2000ms exceeded. Ensure the done() callback is being called in this test.

The affected test is

it('#must be able to receive a message', function(done)
{
    chatterServer.on('chatterMessage', function(data)
    {
        console.log('Incoming message!');
        expect(data).to.have.property('message');
        expect(data.message).to.be('Hello, world!');
        done();
    });

    console.log('Sending message!');
    chatterClient.send('chatterMessage', { message: 'Hello, world!' });
    console.log('Sent!');
});

I found that the cause of this issue is that the chatterMessage event is not being caught by the server. Whilst I did specify it.

The console's output is:

Sending message!
Sent!
Error: timeout of 2000ms exceeded. Ensure the done() callback is being called in this test.

I'm probably doing something wrong. I'm not too familiar with Node and Socket.IO, so I'm sorry if this question is very obvious.

I looked around Google with the search terms 'socket.io server not receiving from client', but from what I found, nothing helped me to solve my issue so far.

I did however try the solution in this question, but that didn't fix it for me.

I'm using Mocha and expect.js

The complete test is:

var util = require('util');
var Chatter = require('../src/index');
var ChatterServer = Chatter.Server;
var ChatterClient = Chatter.Client;
var express = require('express');
var expect = require('expect.js');
var socketIO = require('socket.io');
var socketIOClient = require('socket.io-client');

var host = 'http://localhost';
var port = 8080;

describe('Chatter', function()
{
    'use strict';

    var chatterServer;
    var chatterClient;
    var server;

    before(function()
    {
        var app = express();

        server = app.listen(port);
    });

    beforeEach(function()
    {
        chatterServer = new ChatterServer(socketIO(server));
        chatterClient = new ChatterClient(socketIOClient, util.format('%s:%s', host, port.toString()));
    });

    ...

    it('#must be able to receive a message', function(done)
    {
        chatterServer.on('chatterMessage', function(data)
        {
            console.log('Incoming message!');
            expect(data).to.have.property('message');
            expect(data.message).to.be('Hello, world!');
            done();
        });

        console.log('Sending message!');
        chatterClient.send('chatterMessage', { message: 'Hello, world!' });
        console.log('Sent!');
    });
});

My Client (ChatterClient) is:

(function()
{
    'use strict';

    function Client(socketIO, url)
    {
        this.socketIO = socketIO(url);
    }

    Client.prototype.send = function(event, data)
    {
        this.socketIO.emit(event, data);
    };

    Client.prototype.on = function(event, callback)
    {
        this.socketIO.on(event, callback);
    };

    if (module !== undefined && module.hasOwnProperty('exports')) {
        module.exports = Client;
    } else {
        window.Chatter = {
            Client: Client,
        };
    }
}());

The Server (ChatterServer) is:

(function()
{
    'use strict';

    function Server(socketIO)
    {
        this.socketIO = socketIO;
        this.connectedUsers = {};

        this.on('connection', (function(user)
        {
            var userID = user.client.id;

            this.connectedUsers[userID] = user;

            user.emit('chatterConnectionAcknowledged', { id: userID });
        }).bind(this));
    }

    Server.prototype.on = function(event, handler)
    {
        this.socketIO.on(event, handler);
    };

    module.exports = Server;

}());

Source: (StackOverflow)

Mocha.js with expect.js and superagent.js -- How to dump response upon failure?

I am using mocha.js with expect.js and superagent to do HTTP API testing. Sometimes I use node.js and sometimes I must use a browser.

Normally I don't care to see the HTTP response body I am testing against when tests pass.

However, if a test fails I would like to list the HTTP response to figure out what went wrong.

Is there a hook to post an "on failure" function to run only if an it() function fails? Or is there a variable or function so I can progamatically sense if an it() function failed.

Stated another way, when all is well, green check marks are output to the report window. Whenever a red X is output, I want to catch the event and dump the prior http response for analysis.

Can anyone suggest a clean way to achieve this need?


Source: (StackOverflow)

How to get assertion error message to be displayed on HTML?

I've been trying to learn how to use expect.js assertion plugin for my project. My problem is i want to get the error message which only displayed on console section of my browser's inspect element to be alerted into my HTML page when i click my button. Here's what i've been doing so far

<body>
    <script>mocha.setup('bdd')</script>
    <div id="mocha"></div>
    <ol>
        <li>tes</li>
        <li>tes</li>
        <li>tes</li>
        <li>tes</li>
        <label></label>
        <div class="post">

        </div>
        <button id="klik">Klik</button>
    </ol>

    <script type="text/javascript">
    var salah="";
    describe("Index", function () {
        it("should have div",function(){
            $expect('input').to.exist(function (willThrow) {
            // Some cleanup code.
                return 'Please add a input to the page.';
            });
        });
        it("should have img",function()
        {
            $expect('img').to.exist('Please add a img to the page!');
        });
        it("should have li 4",function()
        {
        $expect('ol > li').to.have.items(4);
        });
    });
    mocha.run();

      var fn = function(){
            var missingPorHMsg = "Your div should surround the h2 and two p's";
      $expect('div.post').to.exist('Make sure your new div has a class name of "post"!')
               .and.to.have.children('h2', missingPorHMsg)
               .and.to.have.children('p', missingPorHMsg)
                            .that.has.elements(4, missingPorHMsg).end()
               .and.to.have.css( 'border'
                               , '1px dashed #ccc'
                               , "Make sure you give your post div a border!");
    };
    $('#klik').click(function(e){
        alert(fn());
    });
    </script>
</body>

When i click the button the error will show on console when i check inspect element from my browser. What I'm trying to do is get the error message and alert the message when i click the button.


Source: (StackOverflow)