forked from jquery-archive/jquery-mobile
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
2 changed files
with
176 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,108 @@ | ||
| /* | ||
| * mobile checkboxradio unit tests | ||
| */ | ||
| (function($){ | ||
| module( 'vertical controlgroup', { | ||
| setup: function() { | ||
| this.vcontrolgroup = $( "#vertical-controlgroup" ); | ||
| this.vcontrolgroup.find( ".ui-btn" ).show(); | ||
| this.vcontrolgroup.controlgroup("refresh"); | ||
| } | ||
| }); | ||
|
|
||
| test( "vertical controlgroup classes", function() { | ||
| var buttons = this.vcontrolgroup.find( ".ui-btn" ), | ||
| middlebuttons = buttons.filter(function(index) { return index > 0 && index < (length-1)}), | ||
| length = buttons.length; | ||
|
|
||
| ok( buttons.first().hasClass( "ui-corner-top" ), "first button should have class 'ui-corner-top'" ); | ||
| ok( !middlebuttons.hasClass( "ui-corner-top" ), "middle buttons should not have class 'ui-corner-top'" ); | ||
| ok( !middlebuttons.hasClass( "ui-corner-bottom" ), "middle buttons should not have class 'ui-corner-bottom'" ); | ||
| ok( buttons.last().hasClass( "ui-corner-bottom"), "last button should have class 'ui-corner-bottom'" ); | ||
| }); | ||
|
|
||
| test( "vertical controlgroup after first button was hidden", function() { | ||
| //https://github.com/jquery/jquery-mobile/issues/1929 | ||
|
|
||
| //We hide the first button and refresh | ||
| this.vcontrolgroup.find( ".ui-btn" ).first().hide(); | ||
| this.vcontrolgroup.controlgroup("refresh"); | ||
|
|
||
| var buttons = this.vcontrolgroup.find( ".ui-btn" ).filter( ":visible" ), | ||
| middlebuttons = buttons.filter(function(index) { return index > 0 && index < (length-1)}), | ||
| length = buttons.length; | ||
|
|
||
| ok( buttons.first().hasClass( "ui-corner-top" ), "first visible button should have class 'ui-corner-top'" ); | ||
| ok( !middlebuttons.hasClass( "ui-corner-top" ), "middle buttons should not have class 'ui-corner-top'" ); | ||
| ok( !middlebuttons.hasClass( "ui-corner-bottom" ), "middle buttons should not have class 'ui-corner-bottom'" ); | ||
| ok( buttons.last().hasClass( "ui-corner-bottom"), "last visible button should have class 'ui-corner-bottom'" ); | ||
| }); | ||
|
|
||
| test( "vertical controlgroup after last button was hidden", function() { | ||
| //https://github.com/jquery/jquery-mobile/issues/1929 | ||
|
|
||
| //We hide the last button and refresh | ||
| this.vcontrolgroup.find( ".ui-btn" ).last().hide(); | ||
| this.vcontrolgroup.controlgroup("refresh"); | ||
|
|
||
| var buttons = this.vcontrolgroup.find( ".ui-btn" ).filter( ":visible" ), | ||
| middlebuttons = buttons.filter(function(index) { return index > 0 && index < (length-1)}), | ||
| length = buttons.length; | ||
|
|
||
| ok( buttons.first().hasClass( "ui-corner-top" ), "first visible button should have class 'ui-corner-top'" ); | ||
| ok( !middlebuttons.hasClass( "ui-corner-top" ), "middle buttons should not have class 'ui-corner-top'" ); | ||
| ok( !middlebuttons.hasClass( "ui-corner-bottom" ), "middle buttons should not have class 'ui-corner-bottom'" ); | ||
| ok( buttons.last().hasClass( "ui-corner-bottom"), "last visible button should have class 'ui-corner-bottom'" ); | ||
| }); | ||
|
|
||
| module( 'horizontal controlgroup', { | ||
| setup: function() { | ||
| this.hcontrolgroup = $( "#horizontal-controlgroup" ); | ||
| this.hcontrolgroup.find( ".ui-btn" ).show(); | ||
| this.hcontrolgroup.controlgroup("refresh"); | ||
| } | ||
| }); | ||
|
|
||
| test( "horizontal controlgroup classes", function() { | ||
| var buttons = this.hcontrolgroup.find( ".ui-btn" ), | ||
| middlebuttons = buttons.filter(function(index) { return index > 0 && index < (length-1)}), | ||
| length = buttons.length; | ||
|
|
||
| ok( buttons.first().hasClass( "ui-corner-left" ), "first button should have class 'ui-corner-left'" ); | ||
| ok( !middlebuttons.hasClass( "ui-corner-left" ), "middle buttons should not have class 'ui-corner-left'" ); | ||
| ok( !middlebuttons.hasClass( "ui-corner-right" ), "middle buttons should not have class 'ui-corner-right'" ); | ||
| ok( buttons.last().hasClass( "ui-corner-right"), "last button should have class 'ui-corner-right'" ); | ||
| }); | ||
|
|
||
| test( "horizontal controlgroup after first button was hidden", function() { | ||
| //We hide the first button and refresh | ||
| this.hcontrolgroup.find( ".ui-btn" ).first().hide(); | ||
| this.hcontrolgroup.controlgroup("refresh"); | ||
|
|
||
| var buttons = this.hcontrolgroup.find( ".ui-btn" ).filter( ":visible" ), | ||
| middlebuttons = buttons.filter(function(index) { return index > 0 && index < (length-1)}), | ||
| length = buttons.length; | ||
|
|
||
| ok( buttons.first().hasClass( "ui-corner-left" ), "first visible button should have class 'ui-corner-left'" ); | ||
| ok( !middlebuttons.hasClass( "ui-corner-left" ), "middle buttons should not have class 'ui-corner-left'" ); | ||
| ok( !middlebuttons.hasClass( "ui-corner-right" ), "middle buttons should not have class 'ui-corner-right'" ); | ||
| ok( buttons.last().hasClass( "ui-corner-right"), "last visible button should have class 'ui-corner-right'" ); | ||
| }); | ||
|
|
||
| test( "horizontal controlgroup after last button was hidden", function() { | ||
| //We hide the last button and refresh | ||
| this.hcontrolgroup.find( ".ui-btn" ).last().hide(); | ||
| this.hcontrolgroup.controlgroup("refresh"); | ||
|
|
||
| var buttons = this.hcontrolgroup.find( ".ui-btn" ).filter( ":visible" ), | ||
| middlebuttons = buttons.filter(function(index) { return index > 0 && index < (length-1)}), | ||
| length = buttons.length; | ||
|
|
||
| ok( buttons.first().hasClass( "ui-corner-left" ), "first visible button should have class 'ui-corner-left'" ); | ||
| ok( !middlebuttons.hasClass( "ui-corner-left" ), "middle buttons should not have class 'ui-corner-left'" ); | ||
| ok( !middlebuttons.hasClass( "ui-corner-right" ), "middle buttons should not have class 'ui-corner-right'" ); | ||
| ok( buttons.last().hasClass( "ui-corner-right"), "last visible button should have class 'ui-corner-right'" ); | ||
| }); | ||
|
|
||
|
|
||
| })(jQuery); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,68 @@ | ||
| <!DOCTYPE html> | ||
|
|
||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8" /> | ||
| <title>jQuery Mobile Checkboxradio Test Suite</title> | ||
|
|
||
| <script src="../../../js/jquery.js"></script> | ||
| <script src="../jquery.setNameSpace.js"></script> | ||
| <script src="../../../js/"></script> | ||
| <script src="../../../tests/jquery.testHelper.js"></script> | ||
|
|
||
| <link rel="stylesheet" href="../../../themes/default/"/> | ||
| <link rel="stylesheet" href="../../../external/qunit.css"/> | ||
| <script src="../../../external/qunit.js"></script> | ||
|
|
||
| <script src="controlgroup_core.js"></script> | ||
| </head> | ||
| <body> | ||
|
|
||
| <h1 id="qunit-header">jQuery Mobile Controlgroup Test Suite</h1> | ||
| <h2 id="qunit-banner"></h2> | ||
| <h2 id="qunit-userAgent"></h2> | ||
| <ol id="qunit-tests"> | ||
| </ol> | ||
|
|
||
| <div data-nstest-role="page"> | ||
| <div data-nstest-role="content"> | ||
|
|
||
| <div data-nstest-role="fieldcontain" id="radio-active-btn-test"> | ||
| <fieldset data-nstest-role="controlgroup" id="vertical-controlgroup"> | ||
| <legend>Choose a pet:</legend> | ||
| <input type="radio" name="radio-pet-active-btn" id="radio-pet-1" value="choice-1" checked="checked" /> | ||
| <label for="radio-pet-1">Cat</label> | ||
|
|
||
| <input type="radio" name="radio-pet-active-btn" id="radio-pet-2" value="choice-2" /> | ||
| <label for="radio-pet-2">Dog</label> | ||
|
|
||
| <input type="radio" name="radio-pet-active-btn" id="radio-pet-3" value="choice-3" /> | ||
| <label for="radio-pet-3">Hamster</label> | ||
|
|
||
| <input type="radio" name="radio-pet-active-btn" id="radio-pet-4" value="choice-4" /> | ||
| <label for="radio-pet-4">Lizard</label> | ||
| </fieldset> | ||
| </div> | ||
|
|
||
| <div data-nstest-role="fieldcontain"> | ||
| <fieldset data-nstest-role="controlgroup" data-nstest-type="horizontal" id="horizontal-controlgroup"> | ||
| <legend>Font styling:</legend> | ||
| <input type="checkbox" name="checkbox-6" id="checkbox-6" class="custom" /> | ||
| <label for="checkbox-6">b</label> | ||
|
|
||
| <input type="checkbox" name="checkbox-7" id="checkbox-7" class="custom" /> | ||
| <label for="checkbox-7"><em>i</em></label> | ||
|
|
||
| <input type="checkbox" name="checkbox-8" id="checkbox-8" class="custom" /> | ||
| <label for="checkbox-8"><em>s</em></label> | ||
|
|
||
| <input type="checkbox" name="checkbox-9" id="checkbox-9" class="custom" /> | ||
| <label for="checkbox-9">u</label> | ||
| </fieldset> | ||
| </div> | ||
| </div> | ||
|
|
||
| </div> | ||
|
|
||
| </body> | ||
| </html> |