Skip to content
This repository was archived by the owner on Oct 8, 2021. It is now read-only.

Commit e5d1724

Browse files
author
Gabriel Schulhof
committed
Table: Add individual-modules tests for reflow and columntoggle
Re gh-5987
1 parent 4274227 commit e5d1724

File tree

2 files changed

+144
-0
lines changed

2 files changed

+144
-0
lines changed

‎tests/unit/individual-modules/table-tests.html

Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1">
6+
<title>jQuery Mobile Collapsible Test Suite</title>
7+
8+
<script src="../../../external/requirejs/require.js"></script>
9+
<script src="../../../js/requirejs.config.js"></script>
10+
<script src="../../../js/jquery.tag.inserter.js"></script>
11+
<script src="../../../tests/jquery.testHelper.js"></script>
12+
13+
<link rel="stylesheet" href="../../../css/themes/default/jquery.mobile.css"/>
14+
<link rel="stylesheet" href="../../../external/qunit/qunit.css"/>
15+
<link rel="stylesheet" href="../../jqm-tests.css"/>
16+
<script src="../../../external/qunit/qunit.js"></script>
17+
<script>
18+
$.testHelper.asyncLoad([
19+
[
20+
"widgets/table.reflow",
21+
"widgets/table.columntoggle"
22+
],
23+
[
24+
"../../jquery.setNameSpace.immediately.js"
25+
],
26+
[
27+
"table_core.js"
28+
]
29+
]);
30+
</script>
31+
32+
<script src="../../swarminject.js"></script>
33+
</head>
34+
<body>
35+
<div id="qunit"></div>
36+
37+
<table id="reflow-test" data-nstest-mode="reflow">
38+
<thead>
39+
<tr>
40+
<th>Name</th>
41+
<th>Color</th>
42+
<th>Shape</th>
43+
</tr>
44+
</thead>
45+
<tbody>
46+
<tr>
47+
<td>Orange</td>
48+
<td>Orange</td>
49+
<td>Round</td>
50+
</tr>
51+
<tr>
52+
<td>Watermelon</td>
53+
<td>Green</td>
54+
<td>Oval</td>
55+
</tr>
56+
<tr>
57+
<td>Banana</td>
58+
<td>Yellow</td>
59+
<td>Sickle</td>
60+
</tr>
61+
</tbody>
62+
</table>
63+
64+
<table id="columntoggle-test" data-nstest-mode="columntoggle">
65+
<thead>
66+
<tr>
67+
<th data-nstest-priority="permanent">Name</th>
68+
<th data-nstest-priority="1">Color</th>
69+
<th data-nstest-priority="2">Shape</th>
70+
</tr>
71+
</thead>
72+
<tbody>
73+
<tr>
74+
<td>Orange</td>
75+
<td>Orange</td>
76+
<td>Round</td>
77+
</tr>
78+
<tr>
79+
<td>Watermelon</td>
80+
<td>Green</td>
81+
<td>Oval</td>
82+
</tr>
83+
<tr>
84+
<td>Banana</td>
85+
<td>Yellow</td>
86+
<td>Sickle</td>
87+
</tr>
88+
</tbody>
89+
</table>
90+
</body>
91+
</html>

‎tests/unit/individual-modules/table_core.js

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
test( "Reflow table is enhanced correctly", function() {
2+
var table = $( "#reflow-test" ).table();
3+
4+
deepEqual( table.hasClass( "ui-table" ), true, "Table has class 'ui-table'" );
5+
deepEqual( table.hasClass( "ui-table-reflow" ), true, "Table has class 'ui-table-reflow'" );
6+
deepEqual(
7+
table
8+
.children( "thead" )
9+
.children()
10+
.children()
11+
.is( table.children( "thead" )
12+
.children()
13+
.children( "[data-" + $.mobile.ns + "colstart]" ) ), true,
14+
"All thead cells have the '[data-colstart]' attribute" );
15+
deepEqual( table.children( "tbody" ).children().children().is( function() {
16+
return ( $( this ).children( "b.ui-table-cell-label" ).length !== 1 );
17+
}), false, "All tbody cells have a bold child with class ui-table-cell-label" );
18+
});
19+
20+
test( "Columntoggle table is enhanced correctly", function() {
21+
var table = $( "#columntoggle-test" ).table(),
22+
correctPriorities = true;
23+
24+
deepEqual( table.hasClass( "ui-table" ), true, "Table has class 'ui-table'" );
25+
deepEqual( table.hasClass( "ui-table-columntoggle" ), true,
26+
"Table has class 'ui-table-column-toggle'" );
27+
deepEqual( $( "a[href='#columntoggle-test-popup']#columntoggle-test-button" ).length, 1,
28+
"A button with id 'columntoggle-test-button' and href='#columntoggle-test-popup' exists" );
29+
deepEqual( $( "#columntoggle-test-popup:data(mobile-popup)" ).length, 1,
30+
"A popup widget with id 'columntoggle-test-popup' exists" );
31+
32+
// Try to find incorrectly assigned priority classes
33+
table.children( "thead" ).children().children().each( function( index ) {
34+
var cell = $( this ),
35+
priority = cell.attr( "data-" + $.mobile.ns + "priority" );
36+
37+
if ( priority ) {
38+
correctPriorities =
39+
( table
40+
.children( "tbody" )
41+
.children()
42+
.children( ":nth(" + index + ")" )
43+
.filter( ":not(.ui-table-priority-" + priority + ")" ).length === 0 );
44+
}
45+
46+
// If incorrect priorities have been identified, stop .each()-ing
47+
return correctPriorities;
48+
});
49+
50+
deepEqual( correctPriorities, true,
51+
"All tbody cells have priority classes assigned in accordance with their header " +
52+
"'data-priority' value" );
53+
});

0 commit comments

Comments
 (0)