tests/unit-tests/dayselector/dayselector-tests.js

   1 /*
   2  * Unit Test: Dayselector
   3  * modified by : Koeun Choi <koeun.choi@samsung.com>
   4  */
   5
   6 (function ($) {
   7
   8         module( "Day selector" );
   9
  10         var unit_dayselector = function (elt, expectedType, expectedTheme) {
  11                 var days = 7,
  12                         checkbox,
  13                         label,
  14                         expectedId,
  15                         i;
  16
  17                 elt.dayselector();
  18
  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." );
  22
  23                 equal( elt.attr('data-' + $.mobile.ns + 'type'), expectedType, "should have '" + expectedType + "' type" );
  24
  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" );
  30
  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" );
  36                 }
  37         };
  38
  39         /* Test 1. Default Configuration Check */
  40         asyncTest( "Default Configuration Check", function () {
  41
  42                 $.testHelper.pageSequence( [
  43                         function () {
  44                                 $.testHelper.openPage( '#dayselector-test-configuration' );
  45                         },
  46
  47                         function () {
  48                                 var expectedType = 'horizontal',
  49                                         testPage = $( '#dayselector-test-configuration' ),
  50                                         expectedTheme = 's',
  51                                         daySelector;
  52
  53                                 // test default values are applied correctly
  54                                 daySelector = testPage.find( '#dayselector-test-configuration-default' );
  55                                 unit_dayselector( daySelector, expectedType, expectedTheme );
  56
  57                                 start();
  58                         }
  59                 ]);
  60         });
  61
  62         /* Test 2. Theme Configuration Check */
  63         asyncTest( "Theme Configuration Check", function () {
  64
  65                 $.testHelper.pageSequence( [
  66                         function () {
  67                                 $.testHelper.openPage( '#dayselector-test-configuration' );
  68                         },
  69
  70                         function () {
  71                                 var expectedType = 'horizontal',
  72                                         testPage = $( '#dayselector-test-configuration' ),
  73                                         expectedTheme,
  74                                         daySelector;
  75
  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 );
  82
  83                                 start();
  84                         }
  85
  86                 ]);
  87         });
  88
  89         /* Test 3. Custom Configuration Check */
  90         asyncTest( "Custom Configuration Check", function () {
  91
  92                 $.testHelper.pageSequence( [
  93                         function () {
  94                                 $.testHelper.openPage( '#dayselector-test-configuration' );
  95                         },
  96
  97                         function () {
  98                                 var expectedType = 'vertical',
  99                                         testPage = $( '#dayselector-test-configuration' ),
 100                                         expectedTheme = 'a',
 101                                         daySelector;
 102
 103                                 // test custom config is applied correctly
 104                                 daySelector = testPage.find( '#dayselector-test-configuration-custom' );
 105
 106                                 daySelector.dayselector({ type: expectedType, theme: expectedTheme });
 107                                 unit_dayselector(daySelector, expectedType, expectedTheme );
 108
 109                                 start();
 110                         }
 111
 112                 ]);
 113         });
 114
 115         /* Test 4. Check Event and APIs */
 116         asyncTest( "Check Event and APIs", function () {
 117
 118                 $.testHelper.pageSequence([
 119                         function () {
 120                                 $.testHelper.openPage( '#dayselector-test-select' );
 121                         },
 122
 123                         function () {
 124                                 var testPage,
 125                                         daySelectorElem,
 126                                         wednesday,
 127                                         friday;
 128                                 testPage = $( '#dayselector-test-select' );
 129                                 ok( testPage.hasClass('ui-page-active') );
 130
 131                                 // test defaults are applied correctly
 132                                 daySelectorElem = testPage.find( '#dayselector-test-select-1' );
 133
 134                                 // nothing should be selected yet
 135                                 deepEqual( daySelectorElem.dayselector('value'), [] );
 136
 137                                 // click on Wednesday and Friday to switch them on
 138                                 wednesday = daySelectorElem.find( '.ui-checkbox' )[3];
 139                                 $( wednesday ).find( 'label' ).trigger( 'click' );
 140
 141                                 friday = daySelectorElem.find( '.ui-checkbox' )[5];
 142                                 $( friday ).find( 'label' ).trigger( 'click' );
 143                                 deepEqual( daySelectorElem.dayselector('value'), ['3', '5'] );
 144
 145                                 // turn off Wednesday and Friday
 146                                 $( wednesday ).find( 'label' ).trigger( 'click' );
 147                                 $( friday ).find( 'label' ).trigger( 'click' );
 148                                 deepEqual( daySelectorElem.dayselector('value'), [] );
 149
 150                                 // test the selectAll() method
 151                                 daySelectorElem.dayselector( 'selectAll' );
 152                                 deepEqual( daySelectorElem.dayselector('value'), ['0', '1', '2', '3', '4', '5', '6'] );
 153
 154                                 start();
 155                         }
 156                 ]);
 157         });
 158 })(jQuery);