From a8614f6509e068c4a3ebf7ce72f6f8f97e570dab Mon Sep 17 00:00:00 2001 From: Allan Jardine Date: Tue, 14 Jun 2016 15:13:30 +0100 Subject: [PATCH] Testing: New testing frame using karma and Jasmine - Tests for `paging` included - `npm run` commands of `test` for a single pass test and `test-watch` to watch for changes to the test files - Uses a custom script to load the HTML and JS/CSS libraries for DataTables testing --- package.json | 52 ++--- test/html-loader-lib.js | 227 +++++++++++++++++++ test/html-loader.js | 29 +++ test/html/basic.html | 480 ++++++++++++++++++++++++++++++++++++++++ test/karma.conf.js | 226 +++++++++++++++++++ test/options/paging.js | 82 +++++++ 6 files changed, 1071 insertions(+), 25 deletions(-) create mode 100644 test/html-loader-lib.js create mode 100644 test/html-loader.js create mode 100644 test/html/basic.html create mode 100644 test/karma.conf.js create mode 100644 test/options/paging.js diff --git a/package.json b/package.json index ab3e89197..efb2b3ced 100644 --- a/package.json +++ b/package.json @@ -1,27 +1,29 @@ { - "name": "datatables.net-src", - "version": "1.10.12", - "description": "DataTables source files. Please note that this package does not include the built files. Use the `datatables.net` package!", - "scripts": { - "test": "echo \"Error: no test specified\" && exit 1", - "build-debug": "cd build; ./make.sh build debug", - "build": "cd build; ./make.sh build" - }, - "repository": { - "type": "git", - "url": "git+https://github.com/DataTables/DataTablesSrc.git" - }, - "author": { - "name": "SpryMedia Ltd", - "url": "http://datatables.net" - }, - "license": "MIT", - "homepage": "https://datatables.net", - "bugs": "https://datatables.net/forums", - "devDependencies": { - "jasmine-core": "^2.4.1", - "karma": "^0.13.22", - "karma-chrome-launcher": "^1.0.1", - "karma-jasmine": "^1.0.2" - } + "name": "datatables.net-src", + "version": "1.10.12", + "description": "DataTables source files. Please note that this package does not include the built files. Use the `datatables.net` package!", + "scripts": { + "test": "./node_modules/karma/bin/karma start test/karma.conf.js --single-run", + "test-watch": "./node_modules/karma/bin/karma start test/karma.conf.js", + "build-debug": "cd build; ./make.sh build debug", + "build": "cd build; ./make.sh build" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/DataTables/DataTablesSrc.git" + }, + "author": { + "name": "SpryMedia Ltd", + "url": "http://datatables.net" + }, + "license": "MIT", + "homepage": "https://datatables.net", + "bugs": "https://datatables.net/forums", + "devDependencies": { + "jasmine-core": "^2.4.1", + "karma": "^0.13.22", + "karma-chrome-launcher": "^1.0.1", + "karma-jasmine": "^1.0.2", + "karma-jasmine-jquery": "^0.1.1" + } } diff --git a/test/html-loader-lib.js b/test/html-loader-lib.js new file mode 100644 index 000000000..be3867303 --- /dev/null +++ b/test/html-loader-lib.js @@ -0,0 +1,227 @@ +/** + * @summary DataTables testing suite, HTML and library loader + * @version 1.0.0 + * @author SpryMedia Ltd (www.sprymedia.co.uk) + * + * This source file is free software, available under the following license: + * MIT license - http://datatables.net/license + * + * This source file is distributed in the hope that it will be useful, but + * WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY + * or FITNESS FOR A PARTICULAR PURPOSE. See the license files for details. + * + * This loader is intended for use in the DataTables testing framework. I doubt + * it will be useful elsewhere since it is specifically tooled for the + * DataTables project's module structure, but it is MIT licensed should anyone + * feel they can get any benefit from it. + * + * The loader provides the global `dt` object which provides three methods: + * + * * `libs` - Load CSS and JS libraries. This method should be called only once + * per page. This takes a single object with the following parameters: + * * `framework` - Styling framework to load - for example `bootstrap` or + * `foundation`. Default is `datatables` if not provided. + * * `js` - Array of Javascript files to load - these are the key references + * to the files defined in the `client.libraries` object of the karma + * configuration object. + * * As the `js` array but in this case for CSS + * + * * `html` - Load HTML into a page from a given template. The `.html` extension + * should not be given. + * + * * `clean` - Clean up the HTML. The libraries loaded are retained, but the + * HTML is destroyed. + * + * The `dt.html` and `dt.libs` methods are async. This is done in Jasmine's + * testing environment by adding a test called `Load fixture` to the current + * spec. + */ + + +(function (window, jasmine) { +"use strict"; + +/** + * Sequentially load the CSS and JS files. When finished called the `done` + * method to tell Jasmine we are complete! + */ +function _runQueue ( done, queue ) { + var doc = window.document; + + if ( queue.length === 0 ) { + // Everything finally loaded + done(); + } + else { + var lib = queue.shift(); + + // CSS or JS? + if ( lib.match(/js$/) ) { + var script = doc.createElement('script'); + script.onload = function () { + _runQueue( done, queue ); + }; + script.type = 'text/javascript'; + script.src = lib; + + doc.body.appendChild( script ); + } + else { + var link = doc.createElement('link'); + link.onload = function () { + _runQueue( done, queue ); + }; + link.type = 'text/css'; + link.href = lib; + link.rel = 'stylesheet'; + + doc.head.appendChild( link ); + } + } +} + + +/** + * Convert the module name to a path to load + */ +function _pathResolver ( type, path, framework ) { + var config = window.__karma__.config; + var libs = config.libraries; + var lib = libs[ path ]; + var urlBase = config.htmlLoader.builtRoot; + + if ( lib.pathName ) { + // First party library + if ( path === 'datatables' ) { + // DataTables is a special case... + if ( type === 'css' ) { + return framework === 'datatables' ? + [ urlBase+'/media/css/jquery.dataTables.css' ] : + [ urlBase+'/media/css/dataTables.'+framework+'.css' ]; + } + else { + return framework === 'datatables' ? + [ urlBase+'/media/js/jquery.dataTables.js' ] : + [ urlBase+'/media/js/jquery.dataTables.js', urlBase+'/media/js/dataTables.'+framework+'.js' ]; + } + } + else { + if ( type === 'css' && lib.css ) { + return [ urlBase+'/extensions/'+lib.pathName+'/css/'+lib.fileName+'.'+framework+'.css' ]; + } + else if ( type === 'js' ) { + var out = [ urlBase+'/extensions/'+lib.pathName+'/js/dataTables.'+lib.fileName+'.js' ]; + + if ( lib.js && framework !== 'datatables' ) { + out.push( urlBase+'/extensions/'+lib.pathName+'/js/'+lib.fileName+'.'+framework+'.js' ); + } + + return out; + } + } + } + else { + // Third party or additional + return lib[ type ] ? + lib[ type ] : + null; + } + + return []; +} + + +/** + * Build a list of CSS and JS files that need to be loaded + */ +function _loadDeps ( done, obj ) { + var libraries = window.__karma__.config.libraries; + var doc = window.document; + var queue = [], i, ien; + + // CSS + if ( obj.css ) { + for ( i=0, ien=obj.css.length ; i + + + Name + Position + Office + Age + Start date + Salary + + + + + Name + Position + Office + Age + Start date + Salary + + + + + Tiger Nixon + System Architect + Edinburgh + 61 + 2011/04/25 + $320,800 + + + Garrett Winters + Accountant + Tokyo + 63 + 2011/07/25 + $170,750 + + + Ashton Cox + Junior Technical Author + San Francisco + 66 + 2009/01/12 + $86,000 + + + Cedric Kelly + Senior Javascript Developer + Edinburgh + 22 + 2012/03/29 + $433,060 + + + Airi Satou + Accountant + Tokyo + 33 + 2008/11/28 + $162,700 + + + Brielle Williamson + Integration Specialist + New York + 61 + 2012/12/02 + $372,000 + + + Herrod Chandler + Sales Assistant + San Francisco + 59 + 2012/08/06 + $137,500 + + + Rhona Davidson + Integration Specialist + Tokyo + 55 + 2010/10/14 + $327,900 + + + Colleen Hurst + Javascript Developer + San Francisco + 39 + 2009/09/15 + $205,500 + + + Sonya Frost + Software Engineer + Edinburgh + 23 + 2008/12/13 + $103,600 + + + Jena Gaines + Office Manager + London + 30 + 2008/12/19 + $90,560 + + + Quinn Flynn + Support Lead + Edinburgh + 22 + 2013/03/03 + $342,000 + + + Charde Marshall + Regional Director + San Francisco + 36 + 2008/10/16 + $470,600 + + + Haley Kennedy + Senior Marketing Designer + London + 43 + 2012/12/18 + $313,500 + + + Tatyana Fitzpatrick + Regional Director + London + 19 + 2010/03/17 + $385,750 + + + Michael Silva + Marketing Designer + London + 66 + 2012/11/27 + $198,500 + + + Paul Byrd + Chief Financial Officer (CFO) + New York + 64 + 2010/06/09 + $725,000 + + + Gloria Little + Systems Administrator + New York + 59 + 2009/04/10 + $237,500 + + + Bradley Greer + Software Engineer + London + 41 + 2012/10/13 + $132,000 + + + Dai Rios + Personnel Lead + Edinburgh + 35 + 2012/09/26 + $217,500 + + + Jenette Caldwell + Development Lead + New York + 30 + 2011/09/03 + $345,000 + + + Yuri Berry + Chief Marketing Officer (CMO) + New York + 40 + 2009/06/25 + $675,000 + + + Caesar Vance + Pre-Sales Support + New York + 21 + 2011/12/12 + $106,450 + + + Doris Wilder + Sales Assistant + Sidney + 23 + 2010/09/20 + $85,600 + + + Angelica Ramos + Chief Executive Officer (CEO) + London + 47 + 2009/10/09 + $1,200,000 + + + Gavin Joyce + Developer + Edinburgh + 42 + 2010/12/22 + $92,575 + + + Jennifer Chang + Regional Director + Singapore + 28 + 2010/11/14 + $357,650 + + + Brenden Wagner + Software Engineer + San Francisco + 28 + 2011/06/07 + $206,850 + + + Fiona Green + Chief Operating Officer (COO) + San Francisco + 48 + 2010/03/11 + $850,000 + + + Shou Itou + Regional Marketing + Tokyo + 20 + 2011/08/14 + $163,000 + + + Michelle House + Integration Specialist + Sidney + 37 + 2011/06/02 + $95,400 + + + Suki Burks + Developer + London + 53 + 2009/10/22 + $114,500 + + + Prescott Bartlett + Technical Author + London + 27 + 2011/05/07 + $145,000 + + + Gavin Cortez + Team Leader + San Francisco + 22 + 2008/10/26 + $235,500 + + + Martena Mccray + Post-Sales support + Edinburgh + 46 + 2011/03/09 + $324,050 + + + Unity Butler + Marketing Designer + San Francisco + 47 + 2009/12/09 + $85,675 + + + Howard Hatfield + Office Manager + San Francisco + 51 + 2008/12/16 + $164,500 + + + Hope Fuentes + Secretary + San Francisco + 41 + 2010/02/12 + $109,850 + + + Vivian Harrell + Financial Controller + San Francisco + 62 + 2009/02/14 + $452,500 + + + Timothy Mooney + Office Manager + London + 37 + 2008/12/11 + $136,200 + + + Jackson Bradshaw + Director + New York + 65 + 2008/09/26 + $645,750 + + + Olivia Liang + Support Engineer + Singapore + 64 + 2011/02/03 + $234,500 + + + Bruno Nash + Software Engineer + London + 38 + 2011/05/03 + $163,500 + + + Sakura Yamamoto + Support Engineer + Tokyo + 37 + 2009/08/19 + $139,575 + + + Thor Walton + Developer + New York + 61 + 2013/08/11 + $98,540 + + + Finn Camacho + Support Engineer + San Francisco + 47 + 2009/07/07 + $87,500 + + + Serge Baldwin + Data Coordinator + Singapore + 64 + 2012/04/09 + $138,575 + + + Zenaida Frank + Software Engineer + New York + 63 + 2010/01/04 + $125,250 + + + Zorita Serrano + Software Engineer + San Francisco + 56 + 2012/06/01 + $115,000 + + + Jennifer Acosta + Junior Javascript Developer + Edinburgh + 43 + 2013/02/01 + $75,650 + + + Cara Stevens + Sales Assistant + New York + 46 + 2011/12/06 + $145,600 + + + Hermione Butler + Regional Director + London + 47 + 2011/03/21 + $356,250 + + + Lael Greer + Systems Administrator + London + 21 + 2009/02/27 + $103,500 + + + Jonas Alexander + Developer + San Francisco + 30 + 2010/07/14 + $86,500 + + + Shad Decker + Regional Director + Edinburgh + 51 + 2008/11/13 + $183,000 + + + Michael Bruce + Javascript Developer + Singapore + 29 + 2011/06/27 + $183,000 + + + Donna Snider + Customer Support + New York + 27 + 2011/01/25 + $112,000 + + + \ No newline at end of file diff --git a/test/karma.conf.js b/test/karma.conf.js new file mode 100644 index 000000000..af61ec457 --- /dev/null +++ b/test/karma.conf.js @@ -0,0 +1,226 @@ +// Karma configuration +// Generated on Fri Jun 10 2016 13:57:39 GMT+0100 (BST) + +module.exports = function(config) { + config.set({ + + // base path that will be used to resolve all patterns (eg. files, exclude) + basePath: '../', + + + // plugins + plugins: [ + require('./html-loader.js'), + require('karma-jasmine-jquery'), + require('karma-jasmine'), + require('karma-chrome-launcher') + ], + + + // frameworks to use + // available frameworks: https://npmjs.org/browse/keyword/karma-adapter + frameworks: [ + 'jasmine-jquery', + 'jasmine', + 'html-loader' + ], + + + // list of files / patterns to load in the browser + files: [ + { pattern: 'built/DataTables/**/*.js', included: false }, + { pattern: 'built/DataTables/**/*.css', included: false }, + { pattern: 'built/DataTables/**/*.png', included: false }, + 'test/options/*.js', + 'test/html/*.html' + ], + + + // list of files to exclude + exclude: [ + ], + + + client: { + useIframe: true, + htmlLoader: { + path: 'base/test/html/', + builtRoot: 'base/built/DataTables' + }, + libraries: { + datatables: { + pathName: 'DataTables', + fileName: 'dataTables', + js: true, + css: true + }, + autoFill: { + pathName: 'AutoFill', + fileName: 'autoFill', + js: true, + css: true + }, + buttons: { + pathName: 'Buttons', + fileName: 'buttons', + js: true, + css: true + }, + colreorder: { + pathName: 'ColReorder', + fileName: 'dataTables', + js: false, + css: true + }, + editor: { + pathName: 'Editor', + fileName: 'editor', + js: true, + css: true + }, + fixedcolumns: { + pathName: 'FixedColumns', + fileName: 'fixedColumns', + js: false, + css: true + }, + fixedheader: { + pathName: 'FixedHeader', + fileName: 'fixedheader', + js: false, + css: true + }, + responsive: { + pathName: 'Responsive', + fileName: 'responsive', + js: true, + css: true + }, + rowreorder: { + pathName: 'RowReorder', + fileName: 'rowReorder', + js: false, + css: true + }, + scroller: { + pathName: 'Scroller', + fileName: 'scroller', + js: false, + css: true + }, + select: { + pathName: 'Select', + fileName: 'select', + js: false, + css: true + }, + + // Additional files + 'buttons-flash': { + js: '/extensions/Buttons/js/buttons.flash.js' + }, + 'buttons-html5': { + js: '/extensions/Buttons/js/buttons.html5.js' + }, + 'buttons-print': { + js: '/extensions/Buttons/js/buttons.print.js' + }, + 'buttons-colVis': { + js: '/extensions/Buttons/js/buttons.colVis.js' + }, + + // External libraries + // Ensure that these are insync with the build/examples.php file + jquery: { + js: '//code.jquery.com/jquery-1.12.4.js' + }, + jqueryui: { + js: '//code.jquery.com/ui/1.11.4/jquery-ui.js', + css: '//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css' + }, + bootstrap: { + js: '//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js', + css: '//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css' + }, + bootstrap4: { + js: '//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.2/js/bootstrap.min.js', + css: '//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.2/css/bootstrap.css' + }, + semanticui: { + js: '//cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/semantic.min.js', + css: '//cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/semantic.min.css' + }, + material: { + js: '//cdnjs.cloudflare.com/ajax/libs/material-design-lite/1.1.0/material.min.js', + css: '//cdnjs.cloudflare.com/ajax/libs/material-design-lite/1.1.0/material.min.css' + }, + foundation: { + js: '//cdnjs.cloudflare.com/ajax/libs/foundation/6.1.1/foundation.min.js', + css: '//cdnjs.cloudflare.com/ajax/libs/foundation/6.1.1/foundation.min.css' + }, + uikit: { + js: '//cdnjs.cloudflare.com/ajax/libs/uikit/2.24.3/js/uikit.min.js', + css: '//cdnjs.cloudflare.com/ajax/libs/uikit/2.24.3/css/uikit.min.css' + }, + 'font-awesome': { + css: '//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css' + }, + jszip: { + js: '//cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js' + }, + pdfmake: { + js: '//cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/pdfmake.min.js' + }, + vfsfonts: { + js: '//cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/vfs_fonts.js' + }, + moment: { + js: '//cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js' + } + } + }, + + + // preprocess matching files before serving them to the browser + // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor + preprocessors: { + }, + + + // test results reporter to use + // possible values: 'dots', 'progress' + // available reporters: https://npmjs.org/browse/keyword/karma-reporter + reporters: ['progress'], + + + // web server port + port: 9876, + + + // enable / disable colors in the output (reporters and logs) + colors: true, + + + // level of logging + // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG + logLevel: config.LOG_INFO, + + + // enable / disable watching file and executing tests whenever any file changes + autoWatch: true, + + + // start these browsers + // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher + browsers: ['Chrome'], + + + // Continuous Integration mode + // if true, Karma captures browsers, runs the tests and exits + singleRun: false, + + // Concurrency level + // how many browser should be started simultaneous + concurrency: Infinity + }) +} diff --git a/test/options/paging.js b/test/options/paging.js new file mode 100644 index 000000000..093782e39 --- /dev/null +++ b/test/options/paging.js @@ -0,0 +1,82 @@ +describe( "Paging option", function() { + dt.libs( { + js: [ 'jquery', 'datatables' ], + css: [ 'datatables' ] + } ); + + + dt.html( 'basic' ); + + it( "By default is enabled (legacy default)", function () { + expect($.fn.dataTable.defaults.bPaginate).toBe(true); + } ); + + it( "When initialised the table is paged (10 records)", function () { + $('#example').DataTable(); + expect( $('#example tbody tr').length ).toBe( 10 ); + } ); + + it( "Paging control is in the DOM", function () { + expect( $('div.dataTables_paginate')[0] ).toBeInDOM(); + } ); + + it( "Length control is in the DOM", function () { + expect( $('div.dataTables_length')[0] ).toBeInDOM(); + } ); + + + dt.html( 'basic' ); + + it( "Can disable paging using option", function () { + $('#example').DataTable( { + paging: false + } ); + + expect( $('#example tbody tr').length ).toBe( 57 ); + } ); + + it( "Paging control is not in the DOM", function () { + expect( $('div.dataTables_paginate')[0] ).not.toBeInDOM(); + } ); + + it( "Length control has been removed", function () { + expect( $('div.dataTables_length')[0] ).not.toBeInDOM(); + } ); + + + dt.html( 'basic' ); + + it( "When manually enabled it is indeed enabled", function () { + $('#example').DataTable( { + paging: true + } ); + + expect( $('#example tbody tr').length ).toBe( 10 ); + } ); + + it( "Length control has been removed", function () { + expect( $('div.dataTables_length')[0] ).toBeInDOM(); + } ); + + + dt.html( 'basic' ); + + it( "Default can be set to disabled", function () { + $.fn.dataTable.defaults.paging = false; + + $('#example').DataTable(); + + expect( $('#example tbody tr').length ).toBe( 57 ); + } ); + + + dt.html( 'basic' ); + + it( "And enabled from the options", function () { + $('#example').DataTable( { + paging: true + } ); + + expect( $('#example tbody tr').length ).toBe( 10 ); + } ); +} );