rivets-error-binder.spec.js 6.14 KB
define(function(require) {
    'use strict';

    var $ = require('jquery');
    window.jQuery = $;
    var RivetsErrorBinder = require('rivets-error-binder');
    var _ = require('underscore');
    var Backbone = require('backbone');
    var rivets = require('rivets');
    require('backbone-validation');
    require('rivets-backbone-adapter');
    _.extend(Backbone.Model.prototype, Backbone.Validation.mixin);
    //rivets.config.rootInterface = ':';

    describe('RivetsErrorBinder', function() {
        it('exists', function() {
            expect(RivetsErrorBinder).toBeUndefined();
        });
    });
    describe('RivetsErrorBinder', function() {
        var Model, Collection;
        var scope;
        var test;
        var view;
        var render;
        function createTestModel(constantValue) {
            var test = new Model({
                constant: constantValue
            });
            test.validation = {
                constant: {required: true}
            };
            return test;
        };
        beforeEach(function() {
            render = function(el, cmd, errorList) {
                render.lastCmd = cmd;
                render.lastErrorList = errorList;
                switch (cmd) {
                    case 'focus':
                        render.counts.focus++;
                        break;
                    case 'blur':
                        render.counts.blur++;
                        break;
                    case 'validated':
                        if (errorList) {
                            render.counts.validatedError++;
                        } else {
                            render.counts.validatedClean++;
                        }
                        break;
                }
            };
            render.counts = {focus: 0, blur: 0, validatedError: 0, validatedClean: 0};

            jasmine.Clock.useMock();
            Model = Backbone.Model.extend();
            Collection = Backbone.Collection.extend({model: Model});

            scope = new Model({
                test: test = createTestModel('CONSTANT')
            });
        });
        afterEach(function() {
            view.unbind();
        });
        function triggerEvents($e, val) {
            $e.triggerHandler('focus');
            $e.val(val);
            $e.triggerHandler('input');
            $e.triggerHandler('change');
            $e.triggerHandler('blur');
            jasmine.Clock.tick(1);
        }


        it('existing-no-render', function() {
            var $node = $($.parseHTML('<div><form><input id="_1" rv-error-value="test:constant" /></form></div>'));
            $(document).find('body').append($node[0]);
            var $1 = $node.find('#_1');
            expect($1.length).toEqual(1);
            expect($1.val()).toEqual('');
            expect(render.counts).toEqual({focus : 0, blur : 0, validatedError : 0, validatedClean : 0});
            view = rivets.bind($node, scope.attributes);
            expect(view).toBeTruthy();
            expect($1.val()).toEqual('CONSTANT');
            //expect($node.html()).toBe('');
            test.set('constant', 'one');
            expect($1.val()).toEqual('one');
            test.set('constant', '');
            expect($1.val()).toEqual('');
            test.set('constant', 'CONSTANT');
            expect($1.val()).toEqual('CONSTANT');

            expect(render.counts).toEqual({focus : 0, blur : 0, validatedError : 0, validatedClean : 0});
            triggerEvents($1, 'one');
            expect(test.get('constant')).toEqual('one');
            expect(render.counts).toEqual({focus : 0, blur : 0, validatedError : 0, validatedClean : 0});

            triggerEvents($1, '');
            expect(test.get('constant')).toEqual('');
            expect(render.counts).toEqual({focus : 0, blur : 0, validatedError : 0, validatedClean : 0});
            jasmine.Clock.tick(1);
            expect(render.lastErrorList).toBeUndefined();
            scope.set('test', null);
            scope.set('test', test = createTestModel(test.get('constant')));
        });
        it('existing-with-render', function() {
            /* global requirejs */
            requirejs.config({config: {'rivets-error-binder': { render: render } } });
            var $node = $($.parseHTML('<div><form><input id="_1" rv-error-value="test:constant" /></form></div>'));
            $(document).find('body').append($node[0]);
            var $1 = $node.find('#_1');
            expect($1.length).toEqual(1);
            expect($1.val()).toEqual('');
            expect(render.counts).toEqual({focus : 0, blur : 0, validatedError : 0, validatedClean : 0});
            view = rivets.bind($node, scope.attributes);
            expect(view).toBeTruthy();
            expect($1.val()).toEqual('CONSTANT');
            //expect($node.html()).toBe('');
            test.set('constant', 'one');
            expect($1.val()).toEqual('one');
            test.set('constant', '');
            expect($1.val()).toEqual('');
            test.set('constant', 'CONSTANT');
            expect($1.val()).toEqual('CONSTANT');

            expect(render.counts).toEqual({focus : 0, blur : 0, validatedError : 0, validatedClean : 1});
            triggerEvents($1, 'one');
            expect(test.get('constant')).toEqual('one');
            expect(render.counts).toEqual({focus : 1, blur : 1, validatedError : 0, validatedClean : 2});

            triggerEvents($1, '');
            expect(test.get('constant')).toEqual('');
            expect(render.counts).toEqual({focus : 2, blur : 2, validatedError : 1, validatedClean : 2});
            jasmine.Clock.tick(1);
            expect(render.lastErrorList).toEqual(jasmine.any(String));
        });
        it('missing', function() {
            var $node = $($.parseHTML('<div><form><input id="_1" rv-error-value="test:missing:child" /></form></div>'));
            $(document).find('body').append($node[0]);
            var $1 = $node.find('#_1');
            expect($1.length).toEqual(1);
            expect($1.val()).toEqual('');
            view = rivets.bind($node, scope.attributes);
            expect(view).toBeTruthy();
            expect($1.val()).toEqual('');

            triggerEvents($1, 'one');
        });
    });
});