Mercurial Mercurial > hg > eskp-app / file revision
summary | shortlog | changelog | graph | tags | bookmarks | branches | files | changeset | file | latest | revisions | annotate | diff | comparison | raw | help
bootstrap-source/bootstrap-3.0.3/js/tests/unit/dropdown.js
author Reimar Bauer <rb.proj AT googlemail DOT com>
Fri, 17 Jan 2014 11:59:43 +0100
branchlanding-page-2014
changeset 78 b28d5c14c5c2
parent 54 0ded9d7748b7
permissions -rwxr-xr-x
merged heads 
     1 $(function () {

     2 

     3     module("dropdowns")

     4 

     5       test("should provide no conflict", function () {

     6         var dropdown = $.fn.dropdown.noConflict()

     7         ok(!$.fn.dropdown, 'dropdown was set back to undefined (org value)')

     8         $.fn.dropdown = dropdown

     9       })

    10 

    11       test("should be defined on jquery object", function () {

    12         ok($(document.body).dropdown, 'dropdown method is defined')

    13       })

    14 

    15       test("should return element", function () {

    16         var el = $("<div />")

    17         ok(el.dropdown()[0] === el[0], 'same element returned')

    18       })

    19 

    20       test("should not open dropdown if target is disabled", function () {

    21         var dropdownHTML = '<ul class="tabs">'

    22           + '<li class="dropdown">'

    23           + '<button disabled href="#" class="btn dropdown-toggle" data-toggle="dropdown">Dropdown</button>'

    24           + '<ul class="dropdown-menu">'

    25           + '<li><a href="#">Secondary link</a></li>'

    26           + '<li><a href="#">Something else here</a></li>'

    27           + '<li class="divider"></li>'

    28           + '<li><a href="#">Another link</a></li>'

    29           + '</ul>'

    30           + '</li>'

    31           + '</ul>'

    32           , dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()

    33 

    34         ok(!dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')

    35       })

    36 

    37       test("should not open dropdown if target is disabled", function () {

    38         var dropdownHTML = '<ul class="tabs">'

    39           + '<li class="dropdown">'

    40           + '<button href="#" class="btn dropdown-toggle disabled" data-toggle="dropdown">Dropdown</button>'

    41           + '<ul class="dropdown-menu">'

    42           + '<li><a href="#">Secondary link</a></li>'

    43           + '<li><a href="#">Something else here</a></li>'

    44           + '<li class="divider"></li>'

    45           + '<li><a href="#">Another link</a></li>'

    46           + '</ul>'

    47           + '</li>'

    48           + '</ul>'

    49           , dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()

    50 

    51         ok(!dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')

    52       })

    53 

    54       test("should add class open to menu if clicked", function () {

    55         var dropdownHTML = '<ul class="tabs">'

    56           + '<li class="dropdown">'

    57           + '<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>'

    58           + '<ul class="dropdown-menu">'

    59           + '<li><a href="#">Secondary link</a></li>'

    60           + '<li><a href="#">Something else here</a></li>'

    61           + '<li class="divider"></li>'

    62           + '<li><a href="#">Another link</a></li>'

    63           + '</ul>'

    64           + '</li>'

    65           + '</ul>'

    66           , dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()

    67 

    68         ok(dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')

    69       })

    70 

    71       test("should test if element has a # before assuming it's a selector", function () {

    72         var dropdownHTML = '<ul class="tabs">'

    73           + '<li class="dropdown">'

    74           + '<a href="/foo/" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>'

    75           + '<ul class="dropdown-menu">'

    76           + '<li><a href="#">Secondary link</a></li>'

    77           + '<li><a href="#">Something else here</a></li>'

    78           + '<li class="divider"></li>'

    79           + '<li><a href="#">Another link</a></li>'

    80           + '</ul>'

    81           + '</li>'

    82           + '</ul>'

    83           , dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()

    84 

    85         ok(dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')

    86       })

    87 

    88 

    89       test("should remove open class if body clicked", function () {

    90         var dropdownHTML = '<ul class="tabs">'

    91           + '<li class="dropdown">'

    92           + '<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>'

    93           + '<ul class="dropdown-menu">'

    94           + '<li><a href="#">Secondary link</a></li>'

    95           + '<li><a href="#">Something else here</a></li>'

    96           + '<li class="divider"></li>'

    97           + '<li><a href="#">Another link</a></li>'

    98           + '</ul>'

    99           + '</li>'

   100           + '</ul>'

   101           , dropdown = $(dropdownHTML)

   102             .appendTo('#qunit-fixture')

   103             .find('[data-toggle="dropdown"]')

   104             .dropdown()

   105             .click()

   106 

   107         ok(dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')

   108         $('body').click()

   109         ok(!dropdown.parent('.dropdown').hasClass('open'), 'open class removed')

   110         dropdown.remove()

   111       })

   112 

   113       test("should remove open class if body clicked, with multiple drop downs", function () {

   114           var dropdownHTML =

   115             '<ul class="nav">'

   116             + '    <li><a href="#menu1">Menu 1</a></li>'

   117             + '    <li class="dropdown" id="testmenu">'

   118             + '      <a class="dropdown-toggle" data-toggle="dropdown" href="#testmenu">Test menu <b class="caret"></b></a>'

   119             + '      <ul class="dropdown-menu" role="menu">'

   120             + '        <li><a href="#sub1">Submenu 1</a></li>'

   121             + '      </ul>'

   122             + '    </li>'

   123             + '</ul>'

   124             + '<div class="btn-group">'

   125             + '    <button class="btn">Actions</button>'

   126             + '    <button class="btn dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>'

   127             + '    <ul class="dropdown-menu">'

   128             + '        <li><a href="#">Action 1</a></li>'

   129             + '    </ul>'

   130             + '</div>'

   131           , dropdowns = $(dropdownHTML).appendTo('#qunit-fixture').find('[data-toggle="dropdown"]')

   132           , first = dropdowns.first()

   133           , last = dropdowns.last()

   134 

   135         ok(dropdowns.length == 2, "Should be two dropdowns")

   136 

   137         first.click()

   138         ok(first.parents('.open').length == 1, 'open class added on click')

   139         ok($('#qunit-fixture .open').length == 1, 'only one object is open')

   140         $('body').click()

   141         ok($("#qunit-fixture .open").length === 0, 'open class removed')

   142 

   143         last.click()

   144         ok(last.parent('.open').length == 1, 'open class added on click')

   145         ok($('#qunit-fixture .open').length == 1, 'only one object is open')

   146         $('body').click()

   147         ok($("#qunit-fixture .open").length === 0, 'open class removed')

   148 

   149         $("#qunit-fixture").html("")

   150       })

   151 

   152       test("should fire show and hide event", function () {

   153         var dropdownHTML = '<ul class="tabs">'

   154           + '<li class="dropdown">'

   155           + '<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>'

   156           + '<ul class="dropdown-menu">'

   157           + '<li><a href="#">Secondary link</a></li>'

   158           + '<li><a href="#">Something else here</a></li>'

   159           + '<li class="divider"></li>'

   160           + '<li><a href="#">Another link</a></li>'

   161           + '</ul>'

   162           + '</li>'

   163           + '</ul>'

   164           , dropdown = $(dropdownHTML)

   165             .appendTo('#qunit-fixture')

   166             .find('[data-toggle="dropdown"]')

   167             .dropdown()

   168 

   169         stop()

   170 

   171         dropdown

   172           .parent('.dropdown')

   173           .bind('show.bs.dropdown', function () {

   174             ok(true, 'show was called')

   175           })

   176           .bind('hide.bs.dropdown', function () {

   177             ok(true, 'hide was called')

   178             start()

   179           })

   180 

   181         dropdown.click()

   182         $(document.body).click()

   183       })

   184 

   185 

   186       test("should fire shown and hiden event", function () {

   187         var dropdownHTML = '<ul class="tabs">'

   188           + '<li class="dropdown">'

   189           + '<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>'

   190           + '<ul class="dropdown-menu">'

   191           + '<li><a href="#">Secondary link</a></li>'

   192           + '<li><a href="#">Something else here</a></li>'

   193           + '<li class="divider"></li>'

   194           + '<li><a href="#">Another link</a></li>'

   195           + '</ul>'

   196           + '</li>'

   197           + '</ul>'

   198           , dropdown = $(dropdownHTML)

   199             .appendTo('#qunit-fixture')

   200             .find('[data-toggle="dropdown"]')

   201             .dropdown()

   202 

   203         stop()

   204 

   205         dropdown

   206           .parent('.dropdown')

   207           .bind('shown.bs.dropdown', function () {

   208             ok(true, 'show was called')

   209           })

   210           .bind('hidden.bs.dropdown', function () {

   211             ok(true, 'hide was called')

   212             start()

   213           })

   214 

   215         dropdown.click()

   216         $(document.body).click()

   217       })

   218 

   219 })
eskp-app/1.0

Impressum Datenschutzerklärung