Add grunt-contrib-jasmine for unit tests.

Add jasmine-jquery for help with fixtures and testing jQuery objects.
Add four test specs.
pull/56/head
Glen Cheney 10 years ago
parent 04a49ace41
commit cceb641d50

2
.gitignore vendored

@ -1,6 +1,8 @@
node_modules
bower_components
.DS_Store
_site
.sass-cache
*.scssc
temp
.grunt

@ -45,6 +45,10 @@ module.exports = function(grunt) {
src: {
files: 'src/*.js',
tasks: ['concat']
},
test: {
files: 'test/specs.js',
tasks: ['jasmine:main']
}
},
@ -104,6 +108,22 @@ module.exports = function(grunt) {
src: 'dist/jquery.shuffle.modernizr.js',
dest: 'dist/jquery.shuffle.modernizr.min.js'
}
},
jasmine: {
main: {
src: 'dist/jquery.shuffle.js',
options: {
specs: 'test/specs.js',
vendor: [
'dist/modernizr.custom.min.js',
'http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js',
'bower_components/jasmine-jquery/lib/jasmine-jquery.js'
],
outfile: 'test/_SpecRunner.html',
keepRunner: true
}
}
}
});
@ -132,6 +152,10 @@ module.exports = function(grunt) {
]);
});
grunt.registerTask('test', function() {
grunt.task.run('jasmine:main');
});
// Default task(s).
grunt.registerTask('default', ['serve']);

@ -45,5 +45,8 @@
"dependencies": {
"jquery": ">=1.9.0",
"modernizr": "^2.6.2"
},
"devDependencies": {
"jasmine-jquery": "~2.0.3"
}
}

@ -36,6 +36,7 @@
"load-grunt-tasks": "^0.4.0",
"grunt-contrib-sass": "^0.7.3",
"grunt-contrib-watch": "^0.6.1",
"grunt-autoprefixer": "^0.7.2"
"grunt-autoprefixer": "^0.7.2",
"grunt-contrib-jasmine": "^0.6.4"
}
}

@ -0,0 +1,37 @@
{
"node": false,
"browser": true,
"esnext": true,
"bitwise": true,
"camelcase": true,
"curly": true,
"eqeqeq": true,
"immed": true,
"indent": 2,
"latedef": true,
"newcap": true,
"noarg": true,
"quotmark": "single",
"regexp": true,
"undef": true,
"unused": true,
"strict": false, // Doesn't work well with concat'd files.
"trailing": true,
"smarttabs": true,
"globals": {
"describe": true,
"console": true,
"it": true,
"jasmine": true,
"beforeEach": true,
"afterEach": true,
"loadFixtures": true,
"jasmine": true,
"expect": true,
"$": true,
"Modernizr": true
}
}

@ -0,0 +1,36 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Jasmine Spec Runner</title>
<link rel="stylesheet" type="text/css" href="../.grunt/grunt-contrib-jasmine/jasmine.css">
</head>
<body>
<script src="../.grunt/grunt-contrib-jasmine/es5-shim.js"></script>
<script src="../.grunt/grunt-contrib-jasmine/jasmine.js"></script>
<script src="../.grunt/grunt-contrib-jasmine/jasmine-html.js"></script>
<script src="../.grunt/grunt-contrib-jasmine/boot.js"></script>
<script src="../dist/modernizr.custom.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="../bower_components/jasmine-jquery/lib/jasmine-jquery.js"></script>
<script src="../dist/jquery.shuffle.js"></script>
<script src="specs.js"></script>
<script src="../.grunt/grunt-contrib-jasmine/reporter.js"></script>
</body>
</html>

@ -0,0 +1,12 @@
<div id="regular-shuffle">
<div class="item" data-groups='["design", "red"]'>Person 1</div>
<div class="item" data-groups='["design", "blue"]'>Person 2</div>
<div class="item" data-groups='["strategy", "green"]'>Person 3</div>
<div class="item" data-groups='["ux", "green"]'>Person 4</div>
<div class="item" data-groups='["ux", "blue"]'>Person 5</div>
<div class="item" data-groups='["ux", "red"]'>Person 5</div>
<div class="item" data-groups='["newbiz"]'>Person 7</div>
<div class="item" data-groups='["technology", "black"]'>Person 8</div>
<div class="item" data-groups='["design", "red"]'>Person 9</div>
<div class="item" data-groups='["technology", "black"]'>Person 10</div>
</div>

@ -0,0 +1,111 @@
jasmine.getFixtures().fixturesPath = 'fixtures';
describe('Shuffle.js', function() {
var $ = window.jQuery;
var Modernizr = window.Modernizr;
describe('regular markup', function() {
beforeEach(function() {
loadFixtures('regular.html');
});
afterEach(function(done) {
// Shuffle init is async.
setTimeout(function () {
$('#regular-shuffle').shuffle('destroy');
done();
}, 32);
});
it('should get default options', function() {
$('#regular-shuffle').shuffle();
expect($('#regular-shuffle')).toHaveData('shuffle');
var shuffle = $('#regular-shuffle').data('shuffle');
expect(shuffle.$items.length).toBe(10);
expect(shuffle.visibleItems).toBe(10);
expect(shuffle.group).toBe('all');
expect(shuffle.speed).toBe(250);
expect(shuffle.itemSelector).toBe('');
expect(shuffle.sizer).toBe(null);
expect(shuffle.columnWidth).toBe(0);
expect(shuffle.gutterWidth).toBe(0);
expect(shuffle.delimeter).toBe(null);
expect(shuffle.initialSort).toBe(null);
expect(shuffle.throttleTime).toBe(300);
expect(shuffle.sequentialFadeDelay).toBe(150);
expect(shuffle.useSizer).toBe(false);
expect(shuffle.supported).toBe(Modernizr.csstransforms && Modernizr.csstransitions);
expect(shuffle.unique).toBe('shuffle_0');
});
it('should add classes and default styles', function() {
$('#regular-shuffle').shuffle();
var shuffle = $('#regular-shuffle').data('shuffle');
expect(shuffle.$el).toHaveClass('shuffle');
expect(shuffle.$items).toHaveClass('shuffle-item filtered');
expect(shuffle.$el).toHaveCss({
position: 'relative'
});
expect(shuffle.$items).toHaveCss({
opacity: '1',
position: 'absolute',
visibility: 'visible'
});
expect(shuffle.containerWidth).not.toBe(0);
});
it('should be 3 columns with gutters', function() {
var $shuffle = $('#regular-shuffle');
$shuffle.css({
width: '1000px'
});
$shuffle.children().css({
width: '300px',
height: '150px'
});
$shuffle.shuffle({
columnWidth: 300,
gutterWidth: 50
});
var shuffle = $shuffle.data('shuffle');
expect(shuffle.colWidth).toBe(350);
expect(shuffle.cols).toBe(3);
expect(shuffle.colYs).toEqual([600, 450, 450]);
});
it('can have a function for columns and gutters', function() {
var $shuffle = $('#regular-shuffle');
$shuffle.css({
width: '1000px'
});
$shuffle.children().css({
width: '300px',
height: '150px'
});
$shuffle.shuffle({
columnWidth: function(containerWidth) {
expect(containerWidth).toBe(1000);
return 300;
},
gutterWidth: function() {
return 50;
}
});
var shuffle = $shuffle.data('shuffle');
expect(shuffle._getGutterSize(1000)).toBe(50);
expect(shuffle._getColumnSize(50, 1000)).toBe(350);
expect(shuffle.colWidth).toBe(350);
expect(shuffle.cols).toBe(3);
expect(shuffle.colYs).toEqual([600, 450, 450]);
});
});
});
Loading…
Cancel
Save