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

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