playground
/
isotope
mirror of https://github.com/metafizzy/isotope
1
0
Fork 0
Code Issues Releases Activity
Browse Source

✅ remove QUnit globals; move to js to unit/

pull/1127/head
David DeSandro 9 years ago
parent
2210e40f9a
commit
cf34ef1a12
14 changed files with 244 additions and 280 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 18
      test/.jshintrc
  2. 78
      test/filtering.js
  3. 18
      test/index.html
  4. 39
      test/masonry-measure-columns.js
  5. 101
      test/sort-data.js
  6. 16
      test/unit/arrange-complete.js
  7. 71
      test/unit/filtering.js
  8. 9
      test/unit/fit-rows.js
  9. 14
      test/unit/get-segment-size.js
  10. 0
      test/unit/helpers.js
  11. 34
      test/unit/masonry-measure-columns.js
  12. 9
      test/unit/masonry-stamp.js
  13. 103
      test/unit/sort-data.js
  14. 10
      test/unit/sorting.js

18
test/.jshintrc
Unescape View File

@ -6,22 +6,6 @@
"unused": true,
"predef": {
"Isotope": false,
"getText": false,
"asyncTest": false,
"deepEqual": false,
"equal": false,
"expect": false,
"module": false,
"notDeepEqual": false,
"notEqual": false,
"notStrictEqual": false,
"ok": false,
"QUnit": false,
"raises": false,
"start": false,
"stop": false,
"strictEqual": false,
"test": false
"QUnit": false
}
}

78
test/filtering.js
Unescape View File

@ -1,78 +0,0 @@
( function() {
'use strict';
var $ = window.jQuery;
// return a string of item ids
function getFilteredItemIDs( iso ) {
var texts = [];
for ( var i=0, len = iso.filteredItems.length; i < len; i++ ) {
var item = iso.filteredItems[i];
var id = item.element.getAttribute('data-item-id');
texts.push( id );
}
return texts.join(',');
}
/*
<div data-item-id="1" class="item orange">5</div>
<div data-item-id="2" class="item">3</div>
<div data-item-id="3" class="item orange tall">2</div>
<div data-item-id="4" class="item tall">9</div>
<div data-item-id="5" class="item">7</div>
<div data-item-id="6" class="item orange">1</div>
<div data-item-id="7" class="item orange tall">8</div>
*/
test( 'filtering', function() {
var iso = new Isotope( '#filtering', {
isJQueryFiltering: false,
transitionDuration: 0
});
var ids = getFilteredItemIDs( iso );
equal( ids, '1,2,3,4,5,6,7', 'all items there by default' );
function checkFilter( filter, expectedIDs, message ) {
iso.arrange({ filter: filter });
ids = getFilteredItemIDs( iso );
equal( ids, expectedIDs, message || filter );
}
checkFilter( '.orange', '1,3,6,7' );
checkFilter( '.tall', '3,4,7' );
checkFilter( '.tall.orange', '3,7' );
iso.arrange({
filter: function( elem ) {
var num = parseInt( elem.textContent, 10 );
return num > 5;
}
});
ids = getFilteredItemIDs( iso );
equal( ids, '4,5,7', 'function, text is greater than 5' );
// filter with jQuery
iso.options.isJQueryFiltering = true;
checkFilter( '.orange', '1,3,6,7', '.orange with jQuery' );
checkFilter( '.tall', '3,4,7', '.orange with jQuery' );
checkFilter( '.tall.orange', '3,7', '.tall.orange with jQuery' );
checkFilter( ':not(.orange)', '2,4,5' );
checkFilter( '.orange:not(.tall)', '1,6' );
iso.arrange({
filter: function() {
var num = parseInt( $(this).text(), 10 );
return num > 5;
}
});
ids = getFilteredItemIDs( iso );
equal( ids, '4,5,7', 'function, text is greater than 5, with jQuery' );
});
})();

18
test/index.html
Unescape View File

@ -27,15 +27,15 @@
<script src="../js/layout-modes/fit-rows.js"></script>
<script src="../js/layout-modes/masonry.js"></script>
<script src="helpers.js"></script>
<script src="sorting.js"></script>
<script src="sort-data.js"></script>
<script src="filtering.js"></script>
<script src="arrange-complete.js"></script>
<script src="get-segment-size.js"></script>
<script src="masonry-measure-columns.js"></script>
<script src="masonry-stamp.js"></script>
<script src="fit-rows.js"></script>
<script src="unit/helpers.js"></script>
<script src="unit/sorting.js"></script>
<script src="unit/sort-data.js"></script>
<script src="unit/filtering.js"></script>
<script src="unit/arrange-complete.js"></script>
<script src="unit/get-segment-size.js"></script>
<script src="unit/masonry-measure-columns.js"></script>
<script src="unit/masonry-stamp.js"></script>
<script src="unit/fit-rows.js"></script>
</head>
<body>

39
test/masonry-measure-columns.js
Unescape View File

@ -1,39 +0,0 @@
( function() {
'use strict';
test( 'Masonry.measureColumns', function() {
var iso = new Isotope( '#masonry-measure-columns', {
itemSelector: '.item',
layoutMode: 'masonry',
transitionDuration: 0
});
var msnryMode = iso.modes.masonry;
equal( msnryMode.columnWidth, 60, 'after layout, measured first element' );
iso.modes.masonry._getMeasurement( 'columnWidth', 'outerWidth' );
equal( msnryMode.columnWidth, 0, '_getMeasurement, no option' );
iso.modes.masonry.measureColumns();
equal( msnryMode.columnWidth, 60, 'measureColumns, no option' );
iso.arrange({ filter: '.c' });
iso.modes.masonry.measureColumns();
equal( msnryMode.columnWidth, 60, 'measureColumns after filter first item, no option' );
iso.arrange({
masonry: { columnWidth: 80 }
});
equal( msnryMode.columnWidth, 80, '.arrange() masonry.columnWidth option set number' );
iso.arrange({
masonry: { columnWidth: '.grid-sizer' }
});
equal( msnryMode.columnWidth, 70, '.arrange() masonry.columnWidth option set selector string' );
});
})();

101
test/sort-data.js
Unescape View File

@ -1,101 +0,0 @@
test( 'sort data', function() {
'use strict';
var iso = new Isotope( '#get-sort-data', {
layoutMode: 'fitRows',
getSortData: {
ninjaTurtle: '[data-ninja-turtle]',
fruit: 'span.fruit',
b: 'b parseFloat',
i: 'i parseInt',
bbroke: 'b foobar'
}
});
var item0 = iso.items[0];
var item1 = iso.items[1];
equal( item0.sortData.ninjaTurtle, 'leonardo', '[data-attr] shorthand' );
equal( item0.sortData.fruit, 'watermelon', 'query selector shorthand' );
equal( item0.sortData.b, 3.14, 'parseFloat parser' );
equal( item0.sortData.i, 42, 'parseInt parser' );
equal( item0.sortData.bbroke, '3.14', 'default nonparser' );
// ----- ----- //
var docElem = document.documentElement;
var textSetter = docElem.textContent !== undefined ? 'textContent' : 'innerText';
function setText( elem, value ) {
elem[ textSetter ] = value;
}
var elem0 = iso.items[0].element;
var elem1 = iso.items[1].element;
elem0.setAttribute( 'data-ninja-turtle', 'donatello' );
setText( elem0.querySelector('span.fruit'), 'mango' );
setText( elem0.querySelector('b'), '7.24' );
setText( elem0.querySelector('i'), 'foo' );
iso.updateSortData( elem0 );
var message = ', after updateSortData on single item'
equal( item0.sortData.ninjaTurtle, 'donatello', '[data-attr] shorthand' + message );
equal( item0.sortData.fruit, 'mango', 'query selector shorthand' + message );
equal( item0.sortData.b, 7.24, 'parseFloat parser' + message );
ok( isNaN( item0.sortData.i ), 'parseInt parser' + message );
equal( item0.sortData.bbroke, '7.24', 'default nonparser' + message );
// ----- update all items ----- //
elem0.setAttribute( 'data-ninja-turtle', 'leonardo' );
setText( elem0.querySelector('span.fruit'), 'passion fruit' );
elem1.setAttribute( 'data-ninja-turtle', 'michelangelo' );
setText( elem1.querySelector('span.fruit'), 'starfruit' );
// update all
iso.updateSortData();
message = ', after updateSortData on all items'
equal( item0.sortData.ninjaTurtle, 'leonardo', '[data-attr] shorthand' + message );
equal( item0.sortData.fruit, 'passion fruit', 'query selector shorthand' + message );
equal( item1.sortData.ninjaTurtle, 'michelangelo', '[data-attr] shorthand' + message );
equal( item1.sortData.fruit, 'starfruit', 'query selector shorthand' + message );
// ----- no items ----- //
iso.options.itemSelector = 'none';
iso.reloadItems();
iso.updateSortData();
ok( true, 'updateSortData on empty container is ok' );
iso.updateSortData( document.createElement('div') );
ok( true, 'updateSortData with non-item is ok, with no child items' );
iso.updateSortData( false );
ok( true, 'updateSortData with falsy is ok, with no child items' );
iso.updateSortData( [] );
ok( true, 'updateSortData with empty array is ok, with no child items' );
iso.updateSortData( jQuery() );
ok( true, 'updateSortData with empty jQuery object is ok, with no child items' );
// ----- bad getSortData ----- //
delete iso.options.itemSelector;
iso.options.getSortData.badQuery = 'bad-query';
iso.options.getSortData.badAttr = '[bad-attr]';
iso._getSorters();
iso.reloadItems();
item0 = iso.items[0];
equal( item0.sortData.badQuery, null, 'bad query returns null' );
equal( item0.sortData.badAttr, null, 'bad attr returns null' );
});

16
test/arrange-complete.js → test/unit/arrange-complete.js
Unescape View File

@ -1,5 +1,4 @@
test( 'arrangeComplete', function() {
QUnit.test( 'arrangeComplete', function( assert ) {
'use strict';
var iso = new Isotope( '#arrange-complete', {
@ -7,10 +6,12 @@ test( 'arrangeComplete', function() {
transitionDuration: '0.1s'
});
var done = assert.async();
var tests = [
function() {
iso.once( 'arrangeComplete', function() {
ok( true, 'arrangeComplete after some were filtered' );
assert.ok( true, 'arrangeComplete after some were filtered' );
next();
});
@ -20,7 +21,7 @@ test( 'arrangeComplete', function() {
},
function() {
iso.once( 'arrangeComplete', function() {
ok( true, 'after some revealed, some hidden, some same' );
assert.ok( true, 'after some revealed, some hidden, some same' );
next();
});
@ -30,7 +31,7 @@ test( 'arrangeComplete', function() {
},
function() {
iso.once( 'arrangeComplete', function() {
ok( true, 'after random sort' );
assert.ok( true, 'after random sort' );
next();
});
@ -40,7 +41,7 @@ test( 'arrangeComplete', function() {
},
function() {
iso.once( 'arrangeComplete', function() {
ok( true, 'after layout mid-way thru transition' );
assert.ok( true, 'after layout mid-way thru transition' );
next();
});
@ -63,11 +64,10 @@ test( 'arrangeComplete', function() {
// HACK for consecutive arrangeComplete calls
setTimeout( nextTest );
} else {
start();
done();
}
}
next();
stop();
});

71
test/unit/filtering.js
Unescape View File

@ -0,0 +1,71 @@
/*globals jQuery */
QUnit.test( 'filtering', function( assert ) {
'use strict';
var iso = new Isotope( '#filtering', {
isJQueryFiltering: false,
transitionDuration: 0
});
var ids = getFilteredItemIDs( iso );
assert.equal( ids, '1,2,3,4,5,6,7', 'all items there by default' );
function checkFilter( filter, expectedIDs, message ) {
iso.arrange({ filter: filter });
ids = getFilteredItemIDs( iso );
assert.equal( ids, expectedIDs, message || filter );
}
checkFilter( '.orange', '1,3,6,7' );
checkFilter( '.tall', '3,4,7' );
checkFilter( '.tall.orange', '3,7' );
iso.arrange({
filter: function( elem ) {
var num = parseInt( elem.textContent, 10 );
return num > 5;
}
});
ids = getFilteredItemIDs( iso );
assert.equal( ids, '4,5,7', 'function, text is greater than 5' );
// filter with jQuery
iso.options.isJQueryFiltering = true;
checkFilter( '.orange', '1,3,6,7', '.orange with jQuery' );
checkFilter( '.tall', '3,4,7', '.orange with jQuery' );
checkFilter( '.tall.orange', '3,7', '.tall.orange with jQuery' );
checkFilter( ':not(.orange)', '2,4,5' );
checkFilter( '.orange:not(.tall)', '1,6' );
iso.arrange({
filter: function() {
var num = parseInt( jQuery(this).text(), 10 );
return num > 5;
}
});
ids = getFilteredItemIDs( iso );
assert.equal( ids, '4,5,7', 'function, text is greater than 5, with jQuery' );
// ----- helper ----- //
/*
<div data-item-id="1" class="item orange">5</div>
<div data-item-id="2" class="item">3</div>
<div data-item-id="3" class="item orange tall">2</div>
<div data-item-id="4" class="item tall">9</div>
<div data-item-id="5" class="item">7</div>
<div data-item-id="6" class="item orange">1</div>
<div data-item-id="7" class="item orange tall">8</div>
*/
// return a string of item ids
function getFilteredItemIDs( iso ) {
return iso.filteredItems.map( function( item ) {
return item.element.getAttribute('data-item-id');
});
}
});

9
test/fit-rows.js → test/unit/fit-rows.js
Unescape View File

@ -1,9 +1,6 @@
( function() {
QUnit.test( 'fitRows', function( assert ) {
'use strict';
test( 'fitRows', function() {
var iso = new Isotope( '#fitrows-gutter', {
layoutMode: 'fitRows',
itemSelector: '.item',
@ -14,7 +11,7 @@ test( 'fitRows', function() {
var elem = item.element;
var left = parseInt( elem.style.left, 10 );
var top = parseInt( elem.style.top, 10 );
deepEqual( [ left, top ], [ x, y ], 'item position ' + x + ', ' + y );
assert.deepEqual( [ left, top ], [ x, y ], 'item position ' + x + ', ' + y );
}
checkPosition( iso.items[0], 0, 0 );
@ -39,5 +36,3 @@ test( 'fitRows', function() {
checkPosition( iso.items[1], 78, 0 );
});
})();

14
test/get-segment-size.js → test/unit/get-segment-size.js
Unescape View File

@ -1,4 +1,4 @@
test( 'LayoutMode.getSegmentSize', function() {
QUnit.test( 'LayoutMode.getSegmentSize', function( assert ) {
'use strict';
var CellsByRow = Isotope.LayoutMode.create('cellsByRow');
@ -18,23 +18,23 @@ test( 'LayoutMode.getSegmentSize', function() {
});
var cellsByRow = iso.modes.cellsByRow;
equal( cellsByRow.columnWidth, 17, 'explicit columnWidth option set' );
equal( cellsByRow.rowHeight, 23, 'explicit rowHeight option set' );
assert.equal( cellsByRow.columnWidth, 17, 'explicit columnWidth option set' );
assert.equal( cellsByRow.rowHeight, 23, 'explicit rowHeight option set' );
// set element sizing
iso.options.cellsByRow.columnWidth = '.grid-sizer';
iso.options.cellsByRow.rowHeight = '.grid-sizer';
cellsByRow.getColumnWidth();
cellsByRow.getRowHeight();
equal( cellsByRow.columnWidth, 57, 'element sizing columnWidth' );
equal( cellsByRow.rowHeight, 47, 'element sizing rowHeight' );
assert.equal( cellsByRow.columnWidth, 57, 'element sizing columnWidth' );
assert.equal( cellsByRow.rowHeight, 47, 'element sizing rowHeight' );
// default to first item
delete iso.options.cellsByRow.columnWidth;
delete iso.options.cellsByRow.rowHeight;
cellsByRow.getColumnWidth();
cellsByRow.getRowHeight();
equal( cellsByRow.columnWidth, 60, 'first item columnWidth' );
equal( cellsByRow.rowHeight, 30, 'first item rowHeight' );
assert.equal( cellsByRow.columnWidth, 60, 'first item columnWidth' );
assert.equal( cellsByRow.rowHeight, 30, 'first item rowHeight' );
});

0
test/helpers.js → test/unit/helpers.js
Unescape View File

34
test/unit/masonry-measure-columns.js
Unescape View File

@ -0,0 +1,34 @@
QUnit.test( 'Masonry.measureColumns', function( assert ) {
'use strict';
var iso = new Isotope( '#masonry-measure-columns', {
itemSelector: '.item',
layoutMode: 'masonry',
transitionDuration: 0
});
var msnryMode = iso.modes.masonry;
assert.equal( msnryMode.columnWidth, 60, 'after layout, measured first element' );
iso.modes.masonry._getMeasurement( 'columnWidth', 'outerWidth' );
assert.equal( msnryMode.columnWidth, 0, '_getMeasurement, no option' );
iso.modes.masonry.measureColumns();
assert.equal( msnryMode.columnWidth, 60, 'measureColumns, no option' );
iso.arrange({ filter: '.c' });
iso.modes.masonry.measureColumns();
assert.equal( msnryMode.columnWidth, 60, 'measureColumns after filter first item, no option' );
iso.arrange({
masonry: { columnWidth: 80 }
});
assert.equal( msnryMode.columnWidth, 80, '.arrange() masonry.columnWidth option set number' );
iso.arrange({
masonry: { columnWidth: '.grid-sizer' }
});
assert.equal( msnryMode.columnWidth, 70, '.arrange() masonry.columnWidth option set selector string' );
});

9
test/masonry-stamp.js → test/unit/masonry-stamp.js
Unescape View File

@ -1,9 +1,6 @@
( function() {
QUnit.test( 'Masonry stamp', function( assert ) {
'use strict';
test( 'Masonry stamp', function() {
var iso = new Isotope( '#masonry-stamp', {
layoutMode: 'masonry',
itemSelector: '.item',
@ -14,7 +11,7 @@ test( 'Masonry stamp', function() {
var elem = item.element;
var left = parseInt( elem.style.left, 10 );
var top = parseInt( elem.style.top, 10 );
deepEqual( [ left, top ], [ x, y ], 'item position ' + x + ', ' + y );
assert.deepEqual( [ left, top ], [ x, y ], 'item position ' + x + ', ' + y );
}
checkPosition( iso.items[0], 0, 0 );
@ -23,5 +20,3 @@ test( 'Masonry stamp', function() {
checkPosition( iso.items[3], 120, 45 );
});
})();

103
test/unit/sort-data.js
Unescape View File

@ -0,0 +1,103 @@
/*globals jQuery */
QUnit.test( 'sort data', function( assert ) {
'use strict';
var iso = new Isotope( '#get-sort-data', {
layoutMode: 'fitRows',
getSortData: {
ninjaTurtle: '[data-ninja-turtle]',
fruit: 'span.fruit',
b: 'b parseFloat',
i: 'i parseInt',
bbroke: 'b foobar'
}
});
var item0 = iso.items[0];
var item1 = iso.items[1];
assert.equal( item0.sortData.ninjaTurtle, 'leonardo', '[data-attr] shorthand' );
assert.equal( item0.sortData.fruit, 'watermelon', 'query selector shorthand' );
assert.equal( item0.sortData.b, 3.14, 'parseFloat parser' );
assert.equal( item0.sortData.i, 42, 'parseInt parser' );
assert.equal( item0.sortData.bbroke, '3.14', 'default nonparser' );
// ----- ----- //
var docElem = document.documentElement;
var textSetter = docElem.textContent !== undefined ? 'textContent' : 'innerText';
function setText( elem, value ) {
elem[ textSetter ] = value;
}
var elem0 = iso.items[0].element;
var elem1 = iso.items[1].element;
elem0.setAttribute( 'data-ninja-turtle', 'donatello' );
setText( elem0.querySelector('span.fruit'), 'mango' );
setText( elem0.querySelector('b'), '7.24' );
setText( elem0.querySelector('i'), 'foo' );
iso.updateSortData( elem0 );
var message = ', after updateSortData on single item';
assert.equal( item0.sortData.ninjaTurtle, 'donatello', '[data-attr] shorthand' + message );
assert.equal( item0.sortData.fruit, 'mango', 'query selector shorthand' + message );
assert.equal( item0.sortData.b, 7.24, 'parseFloat parser' + message );
assert.ok( isNaN( item0.sortData.i ), 'parseInt parser' + message );
assert.equal( item0.sortData.bbroke, '7.24', 'default nonparser' + message );
// ----- update all items ----- //
elem0.setAttribute( 'data-ninja-turtle', 'leonardo' );
setText( elem0.querySelector('span.fruit'), 'passion fruit' );
elem1.setAttribute( 'data-ninja-turtle', 'michelangelo' );
setText( elem1.querySelector('span.fruit'), 'starfruit' );
// update all
iso.updateSortData();
message = ', after updateSortData on all items';
assert.equal( item0.sortData.ninjaTurtle, 'leonardo', '[data-attr] shorthand' + message );
assert.equal( item0.sortData.fruit, 'passion fruit', 'query selector shorthand' + message );
assert.equal( item1.sortData.ninjaTurtle, 'michelangelo', '[data-attr] shorthand' + message );
assert.equal( item1.sortData.fruit, 'starfruit', 'query selector shorthand' + message );
// ----- no items ----- //
iso.options.itemSelector = 'none';
iso.reloadItems();
iso.updateSortData();
assert.ok( true, 'updateSortData on empty container is ok' );
iso.updateSortData( document.createElement('div') );
assert.ok( true, 'updateSortData with non-item is ok, with no child items' );
iso.updateSortData( false );
assert.ok( true, 'updateSortData with falsy is ok, with no child items' );
iso.updateSortData( [] );
assert.ok( true, 'updateSortData with empty array is ok, with no child items' );
iso.updateSortData( jQuery() );
assert.ok( true, 'updateSortData with empty jQuery object is ok, with no child items' );
// ----- bad getSortData ----- //
delete iso.options.itemSelector;
iso.options.getSortData.badQuery = 'bad-query';
iso.options.getSortData.badAttr = '[bad-attr]';
iso._getSorters();
iso.reloadItems();
item0 = iso.items[0];
assert.equal( item0.sortData.badQuery, null, 'bad query returns null' );
assert.equal( item0.sortData.badAttr, null, 'bad attr returns null' );
});

10
test/sorting.js → test/unit/sorting.js
Unescape View File

@ -1,4 +1,4 @@
test( 'sorting', function() {
QUnit.test( 'sorting', function( assert ) {
'use strict';
@ -18,7 +18,7 @@ test( 'sorting', function() {
var texts = getItemsText( iso );
equal( texts, 'A1,A2,A3,A4,B1,B2,B4', 'items sorted by letter, then number, via history' );
assert.equal( texts, 'A1,A2,A3,A4,B1,B2,B4', 'items sorted by letter, then number, via history' );
iso.destroy();
})();
@ -35,12 +35,12 @@ test( 'sorting', function() {
sortBy: [ 'letter', 'number' ]
});
equal( getItemsText( iso ), 'A1,A2,A3,A4,B1,B2,B4', 'sortBy array' );
assert.equal( getItemsText( iso ), 'A1,A2,A3,A4,B1,B2,B4', 'sortBy array' );
iso.arrange({
sortAscending: false
});
equal( getItemsText( iso ), 'B4,B2,B1,A4,A3,A2,A1', 'sortAscending false' );
assert.equal( getItemsText( iso ), 'B4,B2,B1,A4,A3,A2,A1', 'sortAscending false' );
iso.arrange({
sortAscending: {
@ -48,7 +48,7 @@ test( 'sorting', function() {
number: false
}
});
equal( getItemsText( iso ), 'A4,A3,A2,A1,B4,B2,B1', 'sortAscending with object' );
assert.equal( getItemsText( iso ), 'A4,A3,A2,A1,B4,B2,B1', 'sortAscending with object' );
iso.destroy();
})();
Write Preview
Loading…
Cancel
Save