2 * Unit Test: Dayselector
3 * modified by : Koeun Choi <koeun.choi@samsung.com>
8 module( "Day selector" );
10 var unit_dayselector = function (elt, expectedType, expectedTheme) {
19 ok( elt.hasClass('ui-dayselector'), "day-selector has 'ui-dayselector' class.");
20 // main element should be a controlgroup
21 ok( elt.hasClass('ui-controlgroup'), "day-selector has 'ui-controlgroup' class." );
23 equal( elt.attr('data-' + $.mobile.ns + 'type'), expectedType, "should have '" + expectedType + "' type" );
25 for ( i = 0; i < days ; i++ ) {
26 expectedId = elt.attr( 'id' ) + '_' + i;
27 checkbox = elt.find( '.ui-checkbox :checkbox[value=' + i + '][id=' + expectedId + ']' );
28 equal( checkbox.length, 1, "should be one checkbox per day" );
29 equal( checkbox.prop('value'), String(i), "should have correct day value" );
31 label = checkbox.siblings().first();
32 equal( label.length, 1, "should be one label per day" );
33 equal( label.attr('for'), expectedId, "should associate correctly with checkbox" );
34 ok( label.hasClass('ui-dayselector-label-' + i), "should have the right label class" );
35 equal( label.jqmData('theme'), expectedTheme, "should have '" + expectedTheme + "' theme" );
39 /* Test 1. Default Configuration Check */
40 asyncTest( "Default Configuration Check", function () {
42 $.testHelper.pageSequence( [
44 $.testHelper.openPage( '#dayselector-test-configuration' );
48 var expectedType = 'horizontal',
49 testPage = $( '#dayselector-test-configuration' ),
53 // test default values are applied correctly
54 daySelector = testPage.find( '#dayselector-test-configuration-default' );
55 unit_dayselector( daySelector, expectedType, expectedTheme );
62 /* Test 2. Theme Configuration Check */
63 asyncTest( "Theme Configuration Check", function () {
65 $.testHelper.pageSequence( [
67 $.testHelper.openPage( '#dayselector-test-configuration' );
71 var expectedType = 'horizontal',
72 testPage = $( '#dayselector-test-configuration' ),
76 // test user theme is applied to dayselector winset correctly
77 daySelector = testPage.find( '#dayselector-test-configuration-theme' );
78 daySelector.dayselector();
79 expectedTheme = daySelector.jqmData( 'theme' );
80 equal( expectedTheme, 'a', "dayselector fieldset theme is 'a'" );
81 unit_dayselector( daySelector, expectedType, expectedTheme );
89 /* Test 3. Custom Configuration Check */
90 asyncTest( "Custom Configuration Check", function () {
92 $.testHelper.pageSequence( [
94 $.testHelper.openPage( '#dayselector-test-configuration' );
98 var expectedType = 'vertical',
99 testPage = $( '#dayselector-test-configuration' ),
103 // test custom config is applied correctly
104 daySelector = testPage.find( '#dayselector-test-configuration-custom' );
106 daySelector.dayselector({ type: expectedType, theme: expectedTheme });
107 unit_dayselector(daySelector, expectedType, expectedTheme );
115 /* Test 4. Check Event and APIs */
116 asyncTest( "Check Event and APIs", function () {
118 $.testHelper.pageSequence([
120 $.testHelper.openPage( '#dayselector-test-select' );
128 testPage = $( '#dayselector-test-select' );
129 ok( testPage.hasClass('ui-page-active') );
131 // test defaults are applied correctly
132 daySelectorElem = testPage.find( '#dayselector-test-select-1' );
134 // nothing should be selected yet
135 deepEqual( daySelectorElem.dayselector('value'), [] );
137 // click on Wednesday and Friday to switch them on
138 wednesday = daySelectorElem.find( '.ui-checkbox' )[3];
139 $( wednesday ).find( 'label' ).trigger( 'click' );
141 friday = daySelectorElem.find( '.ui-checkbox' )[5];
142 $( friday ).find( 'label' ).trigger( 'click' );
143 deepEqual( daySelectorElem.dayselector('value'), ['3', '5'] );
145 // turn off Wednesday and Friday
146 $( wednesday ).find( 'label' ).trigger( 'click' );
147 $( friday ).find( 'label' ).trigger( 'click' );
148 deepEqual( daySelectorElem.dayselector('value'), [] );
150 // test the selectAll() method
151 daySelectorElem.dayselector( 'selectAll' );
152 deepEqual( daySelectorElem.dayselector('value'), ['0', '1', '2', '3', '4', '5', '6'] );