1
0
Fork 0
mirror of https://github.com/koalyptus/TableFilter.git synced 2024-04-27 04:22:10 +02:00

Finalised filters visibility extensions tests

This commit is contained in:
Max Guglielmi 2015-06-06 23:44:10 +10:00
parent 8f835ab1fe
commit 78fe75b3d3
6 changed files with 198 additions and 10 deletions

View file

@ -1176,7 +1176,7 @@ webpackJsonp([1],[
this.icnExpandHtml = '<img src="' + this.path + this.icnExpand + '" alt="Expand filters" >';
this.icnCollapseHtml = '<img src="' + this.path + this.icnCollapse + '" alt="Collapse filters" >';
this.defaultText = 'Expand/Collapse filters';
this.defaultText = 'Toggle filters';
//id of container element
this.targetId = f.target_id || null;
@ -1244,7 +1244,7 @@ webpackJsonp([1],[
span.className = this.contCssClass;
//Container element (rdiv or custom element)
if (this.targetId) {
if (!this.targetId) {
tf.setToolbar();
}
var targetEl = !this.targetId ? tf.rDiv : _Dom2['default'].id(this.targetId);
@ -1888,4 +1888,4 @@ webpackJsonp([1],[
/***/ }
]);
//# sourceMappingURL=1-eda749d2ef2fcdb2e245.js.map
//# sourceMappingURL=1-d577df757d4add915f61.js.map

View file

@ -17,10 +17,7 @@ span.expClpFlt img{
margin:1px 1px 1px 1px;
/*background:#f4f4f4;*/
}
span.expClpFlt img:hover{
background:#fff;
/*border:1px solid #666; */
}
span.expClpFlt img:hover{}
/* button */
.btnExpClpFlt{ margin:0 5px 0 5px; }

View file

@ -83,7 +83,7 @@ return /******/ (function(modules) { // webpackBootstrap
/******/ script.charset = 'utf-8';
/******/ script.async = true;
/******/
/******/ script.src = __webpack_require__.p + "" + ({}[chunkId]||chunkId) + "-" + {"1":"eda749d2ef2fcdb2e245"}[chunkId] + ".js";
/******/ script.src = __webpack_require__.p + "" + ({}[chunkId]||chunkId) + "-" + {"1":"d577df757d4add915f61"}[chunkId] + ".js";
/******/ head.appendChild(script);
/******/ }
/******/ };

View file

@ -30,7 +30,7 @@ export default class FiltersVisibility{
'" alt="Expand filters" >';
this.icnCollapseHtml = '<img src="'+ this.path + this.icnCollapse +
'" alt="Collapse filters" >';
this.defaultText = 'Expand/Collapse filters';
this.defaultText = 'Toggle filters';
//id of container element
this.targetId = f.target_id || null;
@ -100,7 +100,7 @@ export default class FiltersVisibility{
span.className = this.contCssClass;
//Container element (rdiv or custom element)
if(this.targetId){
if(!this.targetId){
tf.setToolbar();
}
let targetEl = !this.targetId ? tf.rDiv : Dom.id(this.targetId);

View file

@ -0,0 +1,80 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>TableFilter filters visibility extension tests</title>
<link rel="stylesheet" href="libs/qunit/qunit.css">
<script src="libs/qunit/qunit.js"></script>
<script src="libs/polyfill.js"></script>
</head>
<body>
<table id="demo">
<thead>
<tr>
<th>From</th>
<th>Destination</th>
<th>Road Distance (km)</th>
<th>By Air (hrs)</th>
<th>By Rail (hrs)</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Sydney</strong></td>
<td>Adelaide</td>
<td>1412</td>
<td>1.4</td>
<td>25.3</td>
</tr>
<tr>
<td><strong>Sydney</strong></td>
<td>Brisbane</td>
<td>982</td>
<td>1.5</td>
<td>16</td>
</tr>
<tr>
<td><strong>Sydney</strong></td>
<td>Canberra</td>
<td>286</td>
<td>.6</td>
<td>4.3</td>
</tr>
<tr>
<td><strong>Sydney</strong></td>
<td>Melbourne</td>
<td>872</td>
<td>1.1</td>
<td>10.5</td>
</tr>
<tr>
<td><strong>Adelaide</strong></td>
<td>Perth</td>
<td>2781</td>
<td>3.1</td>
<td>38</td>
</tr>
<tr>
<td><strong>Adelaide</strong></td>
<td>Alice Springs</td>
<td>1533</td>
<td>2</td>
<td>20.25</td>
</tr>
<tr>
<td><strong>Adelaide</strong></td>
<td>Brisbane</td>
<td>2045</td>
<td>2.15</td>
<td>40</td>
</tr>
</tbody>
</table>
<script src="../dist/tablefilter/tablefilter.js"></script>
<script src="test-filters-visibility.js"></script>
<div id="qunit"></div>
<div id="qunit-fixture"></div>
</body>
</html>

View file

@ -0,0 +1,111 @@
(function(win, TableFilter){
var tf = new TableFilter('demo', {
base_path: '../dist/tablefilter/',
extensions:[{
name: 'filtersVisibility'
}]
});
tf.init();
var extTargetElement = document.createElement('div');
extTargetElement.setAttribute('id', 'test');
document.body.insertBefore(extTargetElement, tf.tbl);
module('Sanity checks');
test('Filters visibility extension', function() {
var ext = tf.ExtRegistry.filtersVisibility;
deepEqual(tf instanceof TableFilter, true, 'TableFilter instanciated');
notEqual(ext, null, 'Extension instanciated');
deepEqual(ext.initialized, true, 'Extension initialized');
});
module('Check UI');
test('UI elements', function() {
var ext = tf.ExtRegistry.filtersVisibility;
var cont = ext.contEl;
var btn = ext.btnEl;
deepEqual(cont.nodeName, 'SPAN', 'Container element');
deepEqual(btn.nodeName, 'A', 'Button element');
deepEqual(btn.title, 'Toggle filters', 'Button tooltip');
deepEqual(btn.firstChild.nodeName, 'IMG', 'Image element');
deepEqual(btn.firstChild.alt, 'Collapse filters', 'Button tooltip');
});
module('Check behaviours');
test('Toggle filters', function() {
var ext = tf.ExtRegistry.filtersVisibility;
ext.toggle();
var filtersRow = tf.tbl.rows[tf.getFiltersRowIndex()];
deepEqual(filtersRow.style.display, 'none', 'Filters hidden');
ext.toggle();
deepEqual(filtersRow.style.display, '', 'Filters displayed');
});
test('Remove extension', function() {
var ext = tf.ExtRegistry.filtersVisibility;
ext.destroy();
deepEqual(ext.contEl, null, 'Container element removed');
deepEqual(ext.btnEl, null, 'Button element removed');
deepEqual(ext.initialized, false, 'Extension not initialized');
});
test('Button without icon', function() {
tf.destroy();
tf = new TableFilter('demo', {
base_path: '../dist/tablefilter/',
extensions:[{
name: 'filtersVisibility',
enable_icon: false
}]
});
tf.init();
var ext = tf.ExtRegistry.filtersVisibility;
deepEqual(ext.contEl.nodeName, 'SPAN', 'Container element');
deepEqual(ext.btnEl.nodeName, 'A', 'Button element');
deepEqual(ext.btnEl.innerHTML, 'Toggle filters', 'Expected text');
});
test('Button in external Container', function() {
tf.destroy();
tf = new TableFilter('demo', {
base_path: '../dist/tablefilter/',
extensions:[{
name: 'filtersVisibility',
target_id: 'test',
btn_text: 'Hello'
}]
});
tf.init();
var ext = tf.ExtRegistry.filtersVisibility;
var btn = ext.btnEl;
deepEqual(
extTargetElement.firstChild.nodeName, 'SPAN', 'Container element');
deepEqual(btn.nodeName, 'A', 'Button element');
deepEqual(btn.textContent || btn.innerText, 'Hello', 'Expected text');
});
test('Grid layout: filters hidden at start', function() {
tf.destroy();
tf = new TableFilter('demo', {
base_path: '../dist/tablefilter/',
grid_layout: true,
extensions:[{
name: 'filtersVisibility',
visible_at_start: false
}]
});
tf.init();
var ext = tf.ExtRegistry.filtersVisibility;
var gridLayout = tf.Cpt.gridLayout;
var filtersRow = gridLayout.headTbl.rows[tf.getFiltersRowIndex()];
var cont = ext.contEl;
var btn = ext.btnEl;
deepEqual(filtersRow.style.display, 'none', 'Filters hidden');
deepEqual(cont.nodeName, 'SPAN', 'Container element');
deepEqual(btn.nodeName, 'A', 'Button element');
});
})(window, TableFilter);