From c322455df663df0de74b3027f07104a4fc4e2d14 Mon Sep 17 00:00:00 2001 From: "K.Adam White" Date: Mon, 16 Sep 2013 16:11:26 -0400 Subject: [PATCH] chore: Add Gruntfile, update Karma configuration & fix JSHint errors Leveraging Grunt to check for style issues and run the Karma tests makes it easier to run those processes. The Gruntfile in use here is based on that of ui-utils, and the Karma config file (which has been renamed Karma.conf.js for consistency with other projects) has been re-generated with karma init. --- .jshintrc | 11 +++++++ Gruntfile.js | 56 +++++++++++++++++++++++++++++++ README.md | 44 +++++++++++++------------ package.json | 13 ++++++-- src/select2.js | 48 +++++++++++++++------------ test/karma.conf.js | 80 +++++++++++++++++++++++++++++++++++++++++++++ test/select2Spec.js | 16 ++++----- test/test.conf.js | 27 --------------- 8 files changed, 215 insertions(+), 80 deletions(-) create mode 100644 .jshintrc create mode 100644 Gruntfile.js create mode 100644 test/karma.conf.js delete mode 100644 test/test.conf.js diff --git a/.jshintrc b/.jshintrc new file mode 100644 index 0000000..1b83bfb --- /dev/null +++ b/.jshintrc @@ -0,0 +1,11 @@ +{ + "curly": true, + "eqeqeq": true, + "immed": true, + "latedef": true, + "newcap": true, + "noarg": true, + "sub": true, + "boss": true, + "eqnull": true +} diff --git a/Gruntfile.js b/Gruntfile.js new file mode 100644 index 0000000..51523f7 --- /dev/null +++ b/Gruntfile.js @@ -0,0 +1,56 @@ +module.exports = function (grunt) { + 'use strict'; + + var initConfig; + + // Loading external tasks + grunt.loadNpmTasks('grunt-contrib-jshint'); + grunt.loadNpmTasks('grunt-contrib-watch'); + grunt.loadNpmTasks('grunt-karma'); + + // Project configuration. + initConfig = { + bower: 'bower_components', + pkg: grunt.file.readJSON('package.json'), + watch: { + // Lint & run unit tests in Karma + // Just running `$ grunt watch` will only lint your code; to run tests + // on watch, use `$ grunt watch:karma` to start a Karma server first + files: ['src/select2.js', 'test/select2Spec.js'], + tasks: ['jshint', 'karma:headless:run'] + }, + karma: { + options: { + configFile: 'test/karma.conf.js' + }, + unit: { + singleRun: true, + browsers: ['Firefox', 'PhantomJS'] + }, + headless: { + singleRun: true, + browsers: ['PhantomJS'] + }, + server: { + background: true, + browsers: ['Firefox', 'PhantomJS'] + } + }, + jshint: { + all:[ + 'gruntFile.js', + 'src/**/*.js', + 'test/**/*Spec.js' + ], + options: { + jshintrc: '.jshintrc' + } + }, + }; + + // Register tasks + grunt.registerTask('default', ['jshint', 'karma:unit']); + grunt.registerTask('watch:karma', ['karma:server', 'watch']); + + grunt.initConfig(initConfig); +}; diff --git a/README.md b/README.md index 6adbbee..a19e3f4 100644 --- a/README.md +++ b/README.md @@ -10,40 +10,42 @@ This directive allows you to enhance your select elements with behaviour from th ## Setup -1. Install **karma** - `$ npm install -g karma` -2. Install **bower** - `$ npm install -g bower` -4. Install components +1. Install **Karma**, **Grunt** and **Bower** + `$ npm install -g karma grunt-cli bower` +2. Install development dependencies + `$ npm install` +3. Install components `$ bower install` 4. ??? 5. Profit! ## Testing -`$ karma start test/test.conf.js --browsers=Chrome` +We use [Grunt](http://gruntjs.com/) to check for JavaScript syntax errors and execute all unit tests. To run grunt, simply execute: -# Usage +`$ grunt` -We use [bower](https://github.com/bower/bower) for dependency management. Add +To have Grunt automatically lint and test your files whenever you make a code change, use: -```javascript -dependencies: { - "angular-ui-select2": "latest" -} -``` +`$ grunt watch:karma` + +This will start a Karma server in the background and run unit tests in Firefox and PhantomJS whenever the source code or spec file is saved. + +# Usage + +We use [bower](https://github.com/bower/bower) for dependency management. Install AngularUI Select2 into your project by running the command -To your `bower.json` file. Then run +`$ bower install angular-ui-select2` - bower install +If you use a `bower.json` file in your project, you can have Bower save ui-select2 as a dependency by passing the `--save` or `--save-dev` flag with the above command. -This will copy the ui-select2 files into your `components` folder, along with its dependencies. Load the script files in your application: +This will copy the ui-select2 files into your `bower_components` folder, along with its dependencies. Load the script files in your application: ```html - - - - - + + + + + ``` (Note that `jquery` must be loaded before `angular` so that it doesn't use `jqLite` internally) diff --git a/package.json b/package.json index 8bc18a2..50e4366 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,11 @@ { "author": "https://github.com/angular-ui/ui-select2/graphs/contributors", "name": "angular-ui-select2", - "keywords": ["angular", "angularui", "select2"], + "keywords": [ + "angular", + "angularui", + "select2" + ], "description": "AngularUI - The companion suite for AngularJS", "version": "0.0.2", "homepage": "http://angular-ui.github.com", @@ -14,8 +18,11 @@ }, "dependencies": {}, "devDependencies": { - "grunt-recess": "~0.1.3", "async": "0.1.x", - "karma": "~0" + "grunt": "~0.4.1", + "grunt-contrib-jshint": "~0.6.4", + "grunt-contrib-watch": "~0.5.3", + "grunt-karma": "~0.6.2", + "karma": "~0.10.2" } } diff --git a/src/select2.js b/src/select2.js index d8c50fa..ad387db 100644 --- a/src/select2.js +++ b/src/select2.js @@ -17,7 +17,7 @@ angular.module('ui.select2', []).value('uiSelect2Config', {}).directive('uiSelec repeatOption, repeatAttr, isSelect = tElm.is('select'), - isMultiple = (tAttrs.multiple !== undefined); + isMultiple = angular.isDefined(tAttrs.multiple); // Enable watching of the options dataset if in use if (tElm.is('select')) { @@ -39,21 +39,21 @@ angular.module('ui.select2', []).value('uiSelect2Config', {}).directive('uiSelec var convertToAngularModel = function(select2_data) { var model; if (opts.simple_tags) { - model = [] + model = []; angular.forEach(select2_data, function(value, index) { - model.push(value.id) - }) + model.push(value.id); + }); } else { - model = select2_data + model = select2_data; } - return model - } + return model; + }; /* Convert from Angular view-model to Select2 view-model. */ var convertToSelect2Model = function(angular_data) { - var model = [] + var model = []; if (!angular_data) { return model; } @@ -64,12 +64,12 @@ angular.module('ui.select2', []).value('uiSelect2Config', {}).directive('uiSelec angular_data, function(value, index) { model.push({'id': value, 'text': value}); - }) + }); } else { model = angular_data; } - return model - } + return model; + }; if (isSelect) { // Use '); - scope.$digest() + scope.$digest(); - scope.foo.push({'id': '1', 'text': '1'}) - scope.$digest() + scope.foo.push({'id': '1', 'text': '1'}); + scope.$digest(); expect(element.select2('data')).toEqual( [{'id': '0', 'text': '0'}, {'id': '1', 'text': '1'}]); @@ -346,9 +346,9 @@ describe('uiSelect2', function () { describe('simple_tags', function() { beforeEach(function() { - scope.options['multiple'] = true - scope.options['simple_tags'] = true - scope.options['tags'] = [] + scope.options['multiple'] = true; + scope.options['simple_tags'] = true; + scope.options['tags'] = []; }); it('Initialize the select2 view based on list of strings.', function() { @@ -399,7 +399,7 @@ describe('uiSelect2', function () { element.select2('data', [ {'id':'tag1', 'text': 'tag1'}, {'id':'tag2', 'text': 'tag2'} - ]) + ]); element.trigger('change'); expect(scope.foo).toEqual(['tag1', 'tag2']); diff --git a/test/test.conf.js b/test/test.conf.js deleted file mode 100644 index ecc0269..0000000 --- a/test/test.conf.js +++ /dev/null @@ -1,27 +0,0 @@ -module.exports = function( config ) { - config.set({ - basePath: '..', - - browsers: [ 'PhantomJS' ], - - files: [ - // Dependencies - 'bower_components/jquery/jquery.js', - 'bower_components/angular/angular.js', - 'bower_components/angular-mocks/angular-mocks.js', - 'bower_components/select2/select2.js', - - // Source Code - 'src/select2.js', - - // Test Specs - 'test/*Spec.js' - ], - - frameworks: [ 'jasmine' ], - - singleRun: true, - - reporters: [ 'dots' ] - }); -}; \ No newline at end of file