diff --git a/GruntFile.js b/GruntFile.js index af1799f..dbfce9e 100644 --- a/GruntFile.js +++ b/GruntFile.js @@ -32,10 +32,32 @@ module.exports = function(grunt) { } }, jasmine: { - src: ['src/handlebars.form-helpers.js'], - options: { - specs: 'spec/**/*.spec.js', - vendor: ['components/handlebars.js/dist/handlebars.js'] + browserGlobal: { + src: ['src/handlebars.form-helpers.js'], + options: { + specs: 'spec/**/*.spec.js', + vendor: ['components/handlebars.js/dist/handlebars.js'] + } + }, + browserAMD: { + src: ['src/handlebars.form-helpers.js'], + options: { + specs: 'spec/**/*.spec.js', + template: require('grunt-template-jasmine-requirejs'), + templateOptions: { + requireConfig: { + baseUrl: '', + paths: { + handlebars: "components/handlebars.js/dist/handlebars" + }, + shim: { + handlebars: { + exports: "Handlebars" + } + } + } + } + } } } }); diff --git a/package.json b/package.json index 4081141..2875f1f 100644 --- a/package.json +++ b/package.json @@ -21,6 +21,7 @@ "grunt": "~0.4.1", "grunt-contrib-uglify": "~0.1.2rc7", "grunt-contrib-jshint": "~0.1.1", - "grunt-contrib-jasmine": "~0.3.3" + "grunt-contrib-jasmine": "~0.3.3", + "grunt-template-jasmine-requirejs": "~0.1.2" } } \ No newline at end of file diff --git a/spec/handlebars.form-helpers.spec.js b/spec/handlebars.form-helpers.spec.js index 635f2d9..35b51bc 100644 --- a/spec/handlebars.form-helpers.spec.js +++ b/spec/handlebars.form-helpers.spec.js @@ -1,479 +1,500 @@ -describe('Handlebars form helpers', function() { - - /** @TODO field_errors */ +(function (root, factory) { + if (typeof exports === 'object') { + // Node/CommonJS + factory( + require('handlebars-form-helpers'), + require('handlebars') + ); + } else if (typeof define === 'function' && define.amd) { + // AMD + define([ + 'src/handlebars.form-helpers', + 'handlebars' + ], factory); + } else { + // Browser globals + factory(root.HandlebarsFormHelpers, root.Handlebars); + } +}(this, function factory(HandlebarsFormHelpers, Handlebars) { + + describe('Handlebars form helpers', function() { + + /** @TODO field_errors */ + + describe('Public API', function() { + + it('Has \'register\' and \'namespace\' methods', function() { + expect(HandlebarsFormHelpers).not.toBe(undefined); + expect(typeof HandlebarsFormHelpers).toBe('object'); + expect(typeof HandlebarsFormHelpers.register).toBe('function'); + expect(typeof HandlebarsFormHelpers.namespace).toBe('function'); + }); - describe('Public API', function() { + it('Exposes the form helper functions', function() { - it('Has \'register\' and \'namespace\' methods', function() { - expect(typeof HandlebarsFormHelpers).toBe('object'); - expect(typeof HandlebarsFormHelpers.register).toBe('function'); - expect(typeof HandlebarsFormHelpers.namespace).toBe('function'); - }); + expect(typeof HandlebarsFormHelpers.helpers).toBe('object'); - it('Exposes the form helper functions', function() { + var helpers = [ + 'form', 'input', 'label', 'button', 'submit', 'select', + 'checkbox', 'radio', 'file', 'hidden', 'password', 'textarea', + 'label_validation', 'input_validation', 'select_validation', + 'checkbox_validation', 'radio_validation', 'file_validation', + 'password_validation', 'textarea_validation', 'field_errors' + ]; - expect(typeof HandlebarsFormHelpers.helpers).toBe('object'); + for (var i = 0, l = helpers.length; i < l; i++) { + expect(typeof HandlebarsFormHelpers.helpers[helpers[i]]).toBe('function'); + } + }); - var helpers = [ - 'form', 'input', 'label', 'button', 'submit', 'select', - 'checkbox', 'radio', 'file', 'hidden', 'password', 'textarea', - 'label_validation', 'input_validation', 'select_validation', - 'checkbox_validation', 'radio_validation', 'file_validation', - 'password_validation', 'textarea_validation', 'field_errors' - ]; + it('Sets or gets the config', function() { - for (var i = 0, l = helpers.length; i < l; i++) { - expect(typeof HandlebarsFormHelpers.helpers[helpers[i]]).toBe('function'); - } - }); + var config = JSON.parse(JSON.stringify(HandlebarsFormHelpers.config())); - it('Sets or gets the config', function() { + HandlebarsFormHelpers.config({ validationErrorClass: 'bar' }); - var config = JSON.parse(JSON.stringify(HandlebarsFormHelpers.config())); + expect(HandlebarsFormHelpers.config()).toEqual({ + validationErrorClass: 'bar' + }); - HandlebarsFormHelpers.config({ validationErrorClass: 'bar' }); + // Reset config + HandlebarsFormHelpers.config(config); + }); - expect(HandlebarsFormHelpers.config()).toEqual({ - validationErrorClass: 'bar' + it('Sets or gets the namespace', function() { + HandlebarsFormHelpers.namespace('test'); + expect(HandlebarsFormHelpers.namespace()).toBe('test-'); + // Reset namespace + HandlebarsFormHelpers.namespace(''); }); - // Reset config - HandlebarsFormHelpers.config(config); - }); + it('Registers the form helpers with the namespace', function() { - it('Sets or gets the namespace', function() { - HandlebarsFormHelpers.namespace('test'); - expect(HandlebarsFormHelpers.namespace()).toBe('test-'); - // Reset namespace - HandlebarsFormHelpers.namespace(''); - }); + HandlebarsFormHelpers.namespace('test'); + HandlebarsFormHelpers.register(Handlebars); - it('Registers the form helpers with the namespace', function() { + expect(typeof Handlebars.helpers['test-form']).not.toBe('undefined'); - HandlebarsFormHelpers.namespace('test'); - HandlebarsFormHelpers.register(Handlebars); + // Reset namespace + HandlebarsFormHelpers.namespace(''); + }); - expect(typeof Handlebars.helpers['test-form']).not.toBe('undefined'); + it('Registers the form helpers with custom config', function() { - // Reset namespace - HandlebarsFormHelpers.namespace(''); - }); + var config = JSON.parse(JSON.stringify(HandlebarsFormHelpers.config())); - it('Registers the form helpers with custom config', function() { + HandlebarsFormHelpers.register(Handlebars, { + validationErrorClass: 'test123' + }); - var config = JSON.parse(JSON.stringify(HandlebarsFormHelpers.config())); + expect(HandlebarsFormHelpers.config()).toEqual({ + validationErrorClass: 'test123' + }); - HandlebarsFormHelpers.register(Handlebars, { - validationErrorClass: 'test123' + // Reset config + HandlebarsFormHelpers.config(config); }); - - expect(HandlebarsFormHelpers.config()).toEqual({ - validationErrorClass: 'test123' - }); - - // Reset config - HandlebarsFormHelpers.config(config); }); - }); - describe('Form', function() { + describe('Form', function() { - it('Generates the form tag with the URL as action and contents wrapped', function() { + it('Generates the form tag with the URL as action and contents wrapped', function() { - var data = { url: '/test/url' }; - var source = '{{#form url}}test{{/form}}'; - var template = Handlebars.compile(source); - var html = template(data); + var data = { url: '/test/url' }; + var source = '{{#form url}}test{{/form}}'; + var template = Handlebars.compile(source); + var html = template(data); - expect(html).toBe('
test
'); - }); + expect(html).toBe('
test
'); + }); - it('Allows custom form attributes', function() { + it('Allows custom form attributes', function() { - var data = { url: '/url' }; - var source = '{{#form url class="form"}}test{{/form}}'; - var template = Handlebars.compile(source); - var html = template(data); + var data = { url: '/url' }; + var source = '{{#form url class="form"}}test{{/form}}'; + var template = Handlebars.compile(source); + var html = template(data); - expect(html).toBe('
test
'); - }); + expect(html).toBe('
test
'); + }); - it('Allows overriding the URL and action via the custom attributes', function() { + it('Allows overriding the URL and action via the custom attributes', function() { - var data = { url: '/test/url' }; - var source = '{{#form url action="test" method="GET"}}test{{/form}}'; - var template = Handlebars.compile(source); - var html = template(data); + var data = { url: '/test/url' }; + var source = '{{#form url action="test" method="GET"}}test{{/form}}'; + var template = Handlebars.compile(source); + var html = template(data); - expect(html).toBe('
test
'); + expect(html).toBe('
test
'); + }); }); - }); - describe('Input', function() { + describe('Input', function() { - it('Generates the input tag with the first argument as the input id and second argument as value', function() { + it('Generates the input tag with the first argument as the input id and second argument as value', function() { - var data = { - person: { - name: 'Richard' - } - }; - var source = '{{input "firstname" person.name}}'; - var template = Handlebars.compile(source); - var html = template(data); - - expect(html).toBe(''); - }); + var data = { + person: { + name: 'Richard' + } + }; + var source = '{{input "firstname" person.name}}'; + var template = Handlebars.compile(source); + var html = template(data); - it('Prevents falsey attributes from being added', function() { + expect(html).toBe(''); + }); - var data = { - person: { - name: 'Richard' - } - }; - var source = '{{input "firstname" person.name id=false}}'; - var template = Handlebars.compile(source); - var html = template(data); + it('Prevents falsey attributes from being added', function() { - expect(html).toBe(''); - }); + var data = { + person: { + name: 'Richard' + } + }; + var source = '{{input "firstname" person.name id=false}}'; + var template = Handlebars.compile(source); + var html = template(data); - it('Adds validation error classes', function() { - var data = { - errors: { - name: [ - 'Please enter a name' - ] - }, - person: { - name: '' - } - }; - var source = '{{input_validation "name" person.name errors}}'; - var template = Handlebars.compile(source); - var html = template(data); + expect(html).toBe(''); + }); - expect(html).toBe(''); + it('Adds validation error classes', function() { + var data = { + errors: { + name: [ + 'Please enter a name' + ] + }, + person: { + name: '' + } + }; + var source = '{{input_validation "name" person.name errors}}'; + var template = Handlebars.compile(source); + var html = template(data); + + expect(html).toBe(''); + }); }); - }); - describe('Label', function() { + describe('Label', function() { - it('Generates the label tag with the first argument as the label id and second argument as label text', function() { + it('Generates the label tag with the first argument as the label id and second argument as label text', function() { - var data = {}; - var source = '{{label "name" "Please enter your name"}}'; - var template = Handlebars.compile(source); - var html = template(data); + var data = {}; + var source = '{{label "name" "Please enter your name"}}'; + var template = Handlebars.compile(source); + var html = template(data); - expect(html).toBe(''); - }); - - it('Block level - Generates the label tag around body', function() { + expect(html).toBe(''); + }); - var data = {}; - var source = '{{#label}}Here is a label{{/label}}'; - var template = Handlebars.compile(source); - var html = template(data); + it('Block level - Generates the label tag around body', function() { - expect(html).toBe(''); - }); + var data = {}; + var source = '{{#label}}Here is a label{{/label}}'; + var template = Handlebars.compile(source); + var html = template(data); - it('Adds validation error classes', function() { - - var data = { - errors: { - name: [ - 'Please enter a name' - ] - }, - person: { - name: '' - } - }; - var source = '{{label_validation "name" "Enter your name" errors}}'; - var template = Handlebars.compile(source); - var html = template(data); + expect(html).toBe(''); + }); - expect(html).toBe(''); + it('Adds validation error classes', function() { + + var data = { + errors: { + name: [ + 'Please enter a name' + ] + }, + person: { + name: '' + } + }; + var source = '{{label_validation "name" "Enter your name" errors}}'; + var template = Handlebars.compile(source); + var html = template(data); + + expect(html).toBe(''); + }); }); - }); - describe('Button', function() { + describe('Button', function() { - it('Generates the button tag with the first argument as the button text', function() { + it('Generates the button tag with the first argument as the button text', function() { - var data = {}; - var source = '{{button "save" "Submit form"}}'; - var template = Handlebars.compile(source); - var html = template(data); + var data = {}; + var source = '{{button "save" "Submit form"}}'; + var template = Handlebars.compile(source); + var html = template(data); - expect(html).toBe(''); + expect(html).toBe(''); + }); }); - }); - describe('Submit', function() { + describe('Submit', function() { - it('Generates the submit button tag with the first argument as the button text', function() { + it('Generates the submit button tag with the first argument as the button text', function() { - var data = {}; - var source = '{{submit "save" "Submit form"}}'; - var template = Handlebars.compile(source); - var html = template(data); + var data = {}; + var source = '{{submit "save" "Submit form"}}'; + var template = Handlebars.compile(source); + var html = template(data); - expect(html).toBe(''); + expect(html).toBe(''); + }); }); - }); - - describe('Select', function() { - it('Generates the select tag with the first argument as the element id and second argument as the list of options', function() { + describe('Select', function() { - var data = { - people: [{ - value: 1, - text: 'Richard' - }, { - value: 2, - text: 'John' - }] - }; - var source = '{{select "people" people []}}'; - var template = Handlebars.compile(source); - var html = template(data); + it('Generates the select tag with the first argument as the element id and second argument as the list of options', function() { - expect(html).toBe(''); - }); + var data = { + people: [{ + value: 1, + text: 'Richard' + }, { + value: 2, + text: 'John' + }] + }; + var source = '{{select "people" people []}}'; + var template = Handlebars.compile(source); + var html = template(data); - it('Generates the select tag with with an option selected using a single selected value', function() { - - var data = { - people: [{ - value: 1, - text: 'Richard' - }, { - value: 2, - text: 'John' - }], - selected: 1 - }; - var source = '{{select "people" people selected}}'; - var template = Handlebars.compile(source); - var html = template(data); - - expect(html).toBe(''); - }); + expect(html).toBe(''); + }); - it('Generates the select tag with with an option selected using an array of selected values', function() { - - var data = { - people: [{ - value: 1, - text: 'Richard' - }, { - value: 2, - text: 'John' - }], - selected: [1] - }; - var source = '{{select "people" people selected}}'; - var template = Handlebars.compile(source); - var html = template(data); - - expect(html).toBe(''); - }); + it('Generates the select tag with with an option selected using a single selected value', function() { + + var data = { + people: [{ + value: 1, + text: 'Richard' + }, { + value: 2, + text: 'John' + }], + selected: 1 + }; + var source = '{{select "people" people selected}}'; + var template = Handlebars.compile(source); + var html = template(data); + + expect(html).toBe(''); + }); - it('Adds validation error classes', function() { - - var data = { - titles: [{ - value: 'mr', - text: 'Mr' - }], - errors: { - title: [ - 'Please enter a Title' - ] - }, - person: { - title: 'mr' - } - }; - var source = '{{select_validation "title" titles person.title errors}}'; - var template = Handlebars.compile(source); - var html = template(data); + it('Generates the select tag with with an option selected using an array of selected values', function() { + + var data = { + people: [{ + value: 1, + text: 'Richard' + }, { + value: 2, + text: 'John' + }], + selected: [1] + }; + var source = '{{select "people" people selected}}'; + var template = Handlebars.compile(source); + var html = template(data); + + expect(html).toBe(''); + }); - expect(html).toBe(''); + it('Adds validation error classes', function() { + + var data = { + titles: [{ + value: 'mr', + text: 'Mr' + }], + errors: { + title: [ + 'Please enter a Title' + ] + }, + person: { + title: 'mr' + } + }; + var source = '{{select_validation "title" titles person.title errors}}'; + var template = Handlebars.compile(source); + var html = template(data); + + expect(html).toBe(''); + }); }); - }); - describe('Checkbox', function() { + describe('Checkbox', function() { - it('Generates the checkbox tag with the first argument as the name, 2nd as value, 3rd as checked', function() { + it('Generates the checkbox tag with the first argument as the name, 2nd as value, 3rd as checked', function() { - var data = {}; - var source = '{{checkbox "food[]" "apples" true}}{{checkbox "food[]" "pears" false}}'; - var template = Handlebars.compile(source); - var html = template(data); + var data = {}; + var source = '{{checkbox "food[]" "apples" true}}{{checkbox "food[]" "pears" false}}'; + var template = Handlebars.compile(source); + var html = template(data); - expect(html).toBe(''); - }); + expect(html).toBe(''); + }); - it('Generates the checkbox tag with an id attribute if the name does not contain the multiple character sequence', function() { + it('Generates the checkbox tag with an id attribute if the name does not contain the multiple character sequence', function() { - var data = {}; - var source = '{{checkbox "food" "apples" true}}'; - var template = Handlebars.compile(source); - var html = template(data); + var data = {}; + var source = '{{checkbox "food" "apples" true}}'; + var template = Handlebars.compile(source); + var html = template(data); - expect(html).toBe(''); - }); + expect(html).toBe(''); + }); - it('Adds validation error classes', function() { + it('Adds validation error classes', function() { - var data = { - errors: { - title: [ - 'Please enter a Title' - ] - } - }; - var source = '{{checkbox_validation "title" 1 false errors}}'; - var template = Handlebars.compile(source); - var html = template(data); + var data = { + errors: { + title: [ + 'Please enter a Title' + ] + } + }; + var source = '{{checkbox_validation "title" 1 false errors}}'; + var template = Handlebars.compile(source); + var html = template(data); - expect(html).toBe(''); + expect(html).toBe(''); + }); }); - }); - describe('Radio', function() { + describe('Radio', function() { - it('Generates radio input tags', function() { + it('Generates radio input tags', function() { - var data = {}; - var source = '{{radio "likes_cats" "1" true}}{{radio "likes_cats" "0" false}}'; - var template = Handlebars.compile(source); - var html = template(data); + var data = {}; + var source = '{{radio "likes_cats" "1" true}}{{radio "likes_cats" "0" false}}'; + var template = Handlebars.compile(source); + var html = template(data); - expect(html).toBe(''); - }); + expect(html).toBe(''); + }); - it('Adds validation error classes', function() { + it('Adds validation error classes', function() { - var data = { - errors: { - title: [ - 'Please enter a Title' - ] - } - }; - var source = '{{radio_validation "title" "1" false errors}}{{radio_validation "title" "0" true errors}}'; - var template = Handlebars.compile(source); - var html = template(data); + var data = { + errors: { + title: [ + 'Please enter a Title' + ] + } + }; + var source = '{{radio_validation "title" "1" false errors}}{{radio_validation "title" "0" true errors}}'; + var template = Handlebars.compile(source); + var html = template(data); - expect(html).toBe(''); + expect(html).toBe(''); + }); }); - }); - describe('File', function() { + describe('File', function() { - it('Generates the file input tag with the first argument as the name', function() { + it('Generates the file input tag with the first argument as the name', function() { - var data = {}; - var source = '{{file "fileupload"}}'; - var template = Handlebars.compile(source); - var html = template(data); + var data = {}; + var source = '{{file "fileupload"}}'; + var template = Handlebars.compile(source); + var html = template(data); - expect(html).toBe(''); - }); + expect(html).toBe(''); + }); - it('Adds validation error classes', function() { + it('Adds validation error classes', function() { - var data = { - errors: { - fileupload: [ - 'Please select a file' - ] - } - }; - var source = '{{file_validation "fileupload" errors}}'; - var template = Handlebars.compile(source); - var html = template(data); + var data = { + errors: { + fileupload: [ + 'Please select a file' + ] + } + }; + var source = '{{file_validation "fileupload" errors}}'; + var template = Handlebars.compile(source); + var html = template(data); - expect(html).toBe(''); - }); + expect(html).toBe(''); + }); - }); + }); - describe('Hidden', function() { + describe('Hidden', function() { - it('Generates the hidden input tag with the first argument as the name and 2nd as value', function() { + it('Generates the hidden input tag with the first argument as the name and 2nd as value', function() { - var data = {}; - var source = '{{hidden "secret" "key123"}}'; - var template = Handlebars.compile(source); - var html = template(data); + var data = {}; + var source = '{{hidden "secret" "key123"}}'; + var template = Handlebars.compile(source); + var html = template(data); - expect(html).toBe(''); + expect(html).toBe(''); + }); }); - }); - describe('Password', function() { + describe('Password', function() { - it('Generates the password input tag with the first argument as the name and 2nd as value', function() { + it('Generates the password input tag with the first argument as the name and 2nd as value', function() { - var data = {}; - var source = '{{password "passwordfield" "dontdothis"}}'; - var template = Handlebars.compile(source); - var html = template(data); + var data = {}; + var source = '{{password "passwordfield" "dontdothis"}}'; + var template = Handlebars.compile(source); + var html = template(data); - expect(html).toBe(''); - }); + expect(html).toBe(''); + }); - it('Adds validation error classes', function() { + it('Adds validation error classes', function() { - var data = { - errors: { - password: [ - 'Please enter a password' - ] - } - }; - var source = '{{password_validation "password" "" errors}}'; - var template = Handlebars.compile(source); - var html = template(data); + var data = { + errors: { + password: [ + 'Please enter a password' + ] + } + }; + var source = '{{password_validation "password" "" errors}}'; + var template = Handlebars.compile(source); + var html = template(data); - expect(html).toBe(''); + expect(html).toBe(''); + }); }); - }); - describe('Textarea', function() { + describe('Textarea', function() { - it('Generates the textarea tag with the first argument as the name and 2nd as body', function() { + it('Generates the textarea tag with the first argument as the name and 2nd as body', function() { - var data = {}; - var source = '{{textarea "text" "Here is some text"}}'; - var template = Handlebars.compile(source); - var html = template(data); + var data = {}; + var source = '{{textarea "text" "Here is some text"}}'; + var template = Handlebars.compile(source); + var html = template(data); - expect(html).toBe(''); - }); + expect(html).toBe(''); + }); - it('Adds validation error classes', function() { + it('Adds validation error classes', function() { - var data = { - errors: { - text: [ - 'Please enter some text' - ] - } - }; - var source = '{{textarea_validation "text" "Here is some text" errors}}'; - var template = Handlebars.compile(source); - var html = template(data); + var data = { + errors: { + text: [ + 'Please enter some text' + ] + } + }; + var source = '{{textarea_validation "text" "Here is some text" errors}}'; + var template = Handlebars.compile(source); + var html = template(data); - expect(html).toBe(''); + expect(html).toBe(''); + }); }); }); -}); +})); \ No newline at end of file diff --git a/src/handlebars.form-helpers.js b/src/handlebars.form-helpers.js index 10e733f..8b02b5e 100644 --- a/src/handlebars.form-helpers.js +++ b/src/handlebars.form-helpers.js @@ -4,7 +4,7 @@ * Copyright (c) 2013 Richard Willis; Licensed MIT */ -(function (window, factory) { +(function (root, factory) { if (typeof exports === 'object') { // Node/CommonJS exports = factory(); @@ -13,7 +13,7 @@ define(factory); } else { // Browser globals - window.HandlebarsFormHelpers = factory(); + root.HandlebarsFormHelpers = factory(); } }(this, function factory() {