Merge "Adding function documentation for Skin::footerLink()"
[lhc/web/wiklou.git] / tests / qunit / suites / resources / jquery / jquery.makeCollapsible.test.js
index 3c508d4..e6a6124 100644 (file)
 
        // This test is first because if it fails, then almost all of the latter tests are meaningless.
        QUnit.asyncTest( 'testing hooks/triggers', 4, function ( assert ) {
-               var $collapsible, $content, $toggle;
-               $collapsible = prepareCollapsible(
-                       '<div class="mw-collapsible">' + loremIpsum + '</div>'
-               );
-               $content = $collapsible.find( '.mw-collapsible-content' );
-               $toggle = $collapsible.find( '.mw-collapsible-toggle' );
+               var $collapsible = prepareCollapsible(
+                               '<div class="mw-collapsible">' + loremIpsum + '</div>'
+                       ),
+                       $content = $collapsible.find( '.mw-collapsible-content' ),
+                       $toggle = $collapsible.find( '.mw-collapsible-toggle' );
 
                // In one full collapse-expand cycle, each event will be fired once
 
@@ -34,7 +33,6 @@
                        } );
                        $collapsible.on( 'afterExpand.mw-collapsible', function () {
                                assert.assertTrue( $content.is( ':visible' ), 'second afterCollapseExpand: content is visible' );
-
                                QUnit.start();
                        } );
 
        } );
 
        QUnit.asyncTest( 'basic operation (<div>)', 5, function ( assert ) {
-               var $collapsible, $content, $toggle;
-               $collapsible = prepareCollapsible(
-                       '<div class="mw-collapsible">' + loremIpsum + '</div>'
-               );
-               $content = $collapsible.find( '.mw-collapsible-content' );
-               $toggle = $collapsible.find( '.mw-collapsible-toggle' );
+               var $collapsible = prepareCollapsible(
+                               '<div class="mw-collapsible">' + loremIpsum + '</div>'
+                       ),
+                       $content = $collapsible.find( '.mw-collapsible-content' ),
+                       $toggle = $collapsible.find( '.mw-collapsible-toggle' );
 
                assert.equal( $content.length, 1, 'content is present' );
                assert.equal( $content.find( $toggle ).length, 0, 'toggle is not a descendant of content' );
        } );
 
        QUnit.asyncTest( 'basic operation (<table>)', 7, function ( assert ) {
-               var $collapsible, $headerRow, $contentRow, $toggle;
-               $collapsible = prepareCollapsible(
-                       '<table class="mw-collapsible">' +
-                               '<tr><td>' + loremIpsum + '</td><td>' + loremIpsum + '</td></tr>' +
-                               '<tr><td>' + loremIpsum + '</td><td>' + loremIpsum + '</td></tr>' +
-                               '<tr><td>' + loremIpsum + '</td><td>' + loremIpsum + '</td></tr>' +
-                       '</table>'
-               );
-               $headerRow = $collapsible.find( 'tr:first' );
-               $contentRow = $collapsible.find( 'tr:last' );
+               var $collapsible = prepareCollapsible(
+                               '<table class="mw-collapsible">' +
+                                       '<tr><td>' + loremIpsum + '</td><td>' + loremIpsum + '</td></tr>' +
+                                       '<tr><td>' + loremIpsum + '</td><td>' + loremIpsum + '</td></tr>' +
+                                       '<tr><td>' + loremIpsum + '</td><td>' + loremIpsum + '</td></tr>' +
+                               '</table>'
+                       ),
+                       $headerRow = $collapsible.find( 'tr:first' ),
+                       $contentRow = $collapsible.find( 'tr:last' ),
+                       $toggle = $headerRow.find( 'td:last .mw-collapsible-toggle' );
 
-               $toggle = $headerRow.find( 'td:last .mw-collapsible-toggle' );
                assert.equal( $toggle.length, 1, 'toggle is added to last cell of first row' );
 
                assert.assertTrue( $headerRow.is( ':visible' ), 'headerRow is visible' );
        } );
 
        function tableWithCaptionTest( $collapsible, assert ) {
-               var $caption, $headerRow, $contentRow, $toggle;
+               var $caption = $collapsible.find( 'caption' ),
+                       $headerRow = $collapsible.find( 'tr:first' ),
+                       $contentRow = $collapsible.find( 'tr:last' ),
+                       $toggle = $caption.find( '.mw-collapsible-toggle' );
 
-               $caption = $collapsible.find( 'caption' );
-               $headerRow = $collapsible.find( 'tr:first' );
-               $contentRow = $collapsible.find( 'tr:last' );
-
-               $toggle = $caption.find( '.mw-collapsible-toggle' );
                assert.equal( $toggle.length, 1, 'toggle is added to the end of the caption' );
 
                assert.assertTrue( $caption.is( ':visible' ), 'caption is visible' );
        } );
 
        function listTest( listType, assert ) {
-               var $collapsible, $toggleItem, $contentItem, $toggle;
-               $collapsible = prepareCollapsible(
-                       '<' + listType + ' class="mw-collapsible">' +
-                               '<li>' + loremIpsum + '</li>' +
-                               '<li>' + loremIpsum + '</li>' +
-                       '</' + listType + '>'
-               );
-               $toggleItem = $collapsible.find( 'li.mw-collapsible-toggle-li:first-child' );
-               $contentItem = $collapsible.find( 'li:last' );
-
-               $toggle = $toggleItem.find( '.mw-collapsible-toggle' );
+               var $collapsible = prepareCollapsible(
+                               '<' + listType + ' class="mw-collapsible">' +
+                                       '<li>' + loremIpsum + '</li>' +
+                                       '<li>' + loremIpsum + '</li>' +
+                               '</' + listType + '>'
+                       ),
+                       $toggleItem = $collapsible.find( 'li.mw-collapsible-toggle-li:first-child' ),
+                       $contentItem = $collapsible.find( 'li:last' ),
+                       $toggle = $toggleItem.find( '.mw-collapsible-toggle' );
+
                assert.equal( $toggle.length, 1, 'toggle is present, added inside new zeroth list item' );
 
                assert.assertTrue( $toggleItem.is( ':visible' ), 'toggleItem is visible' );
        } );
 
        QUnit.test( 'basic operation when synchronous (options.instantHide)', 2, function ( assert ) {
-               var $collapsible, $content;
-               $collapsible = prepareCollapsible(
-                       '<div class="mw-collapsible">' + loremIpsum + '</div>',
-                       { instantHide: true }
-               );
-               $content = $collapsible.find( '.mw-collapsible-content' );
+               var $collapsible = prepareCollapsible(
+                               '<div class="mw-collapsible">' + loremIpsum + '</div>',
+                               { instantHide: true }
+                       ),
+                       $content = $collapsible.find( '.mw-collapsible-content' );
 
                assert.assertTrue( $content.is( ':visible' ), 'content is visible' );
 
        } );
 
        QUnit.test( 'mw-made-collapsible data added', 1, function ( assert ) {
-               var $collapsible;
-               $collapsible = prepareCollapsible(
-                       '<div>' + loremIpsum + '</div>'
-               );
+               var $collapsible = prepareCollapsible(
+                               '<div>' + loremIpsum + '</div>'
+                       );
+
                assert.equal( $collapsible.data( 'mw-made-collapsible' ), true, 'mw-made-collapsible data present' );
        } );
 
        QUnit.test( 'mw-collapsible added when missing', 1, function ( assert ) {
-               var $collapsible;
-               $collapsible = prepareCollapsible(
-                       '<div>' + loremIpsum + '</div>'
-               );
+               var $collapsible = prepareCollapsible(
+                               '<div>' + loremIpsum + '</div>'
+                       );
+
                assert.assertTrue( $collapsible.hasClass( 'mw-collapsible' ), 'mw-collapsible class present' );
        } );
 
        QUnit.test( 'mw-collapsed added when missing', 1, function ( assert ) {
-               var $collapsible;
-               $collapsible = prepareCollapsible(
+               var $collapsible = prepareCollapsible(
                        '<div>' + loremIpsum + '</div>',
-                       { collapsed: true }
-               );
+                               { collapsed: true }
+                       );
+
                assert.assertTrue( $collapsible.hasClass( 'mw-collapsed' ), 'mw-collapsed class present' );
        } );
 
        QUnit.asyncTest( 'initial collapse (mw-collapsed class)', 2, function ( assert ) {
-               var $collapsible, $content;
-               $collapsible = prepareCollapsible(
-                       '<div class="mw-collapsible mw-collapsed">' + loremIpsum + '</div>'
-               );
-               $content = $collapsible.find( '.mw-collapsible-content' );
+               var $collapsible = prepareCollapsible(
+                               '<div class="mw-collapsible mw-collapsed">' + loremIpsum + '</div>'
+                       ),
+                       $content = $collapsible.find( '.mw-collapsible-content' );
 
                // Synchronous - mw-collapsed should cause instantHide: true to be used on initial collapsing
                assert.assertTrue( $content.is( ':hidden' ), 'content is hidden' );
        } );
 
        QUnit.asyncTest( 'initial collapse (options.collapsed)', 2, function ( assert ) {
-               var $collapsible, $content;
-               $collapsible = prepareCollapsible(
-                       '<div class="mw-collapsible">' + loremIpsum + '</div>',
-                       { collapsed: true }
-               );
-               $content = $collapsible.find( '.mw-collapsible-content' );
+               var $collapsible = prepareCollapsible(
+                               '<div class="mw-collapsible">' + loremIpsum + '</div>',
+                               { collapsed: true }
+                       ),
+                       $content = $collapsible.find( '.mw-collapsible-content' );
 
                // Synchronous - collapsed: true should cause instantHide: true to be used on initial collapsing
                assert.assertTrue( $content.is( ':hidden' ), 'content is hidden' );
                $collapsible.find( '.mw-collapsible-toggle' ).trigger( 'click' );
        } );
 
-       QUnit.test( 'clicks on links inside toggler pass through (options.linksPassthru)' , 2, function ( assert ) {
-               var $collapsible, $content;
-
-               $collapsible = prepareCollapsible(
-                       '<div class="mw-collapsible">' +
-                               '<div class="mw-collapsible-toggle">' +
-                                       'Toggle <a href="#top">toggle</a> toggle <b>toggle</b>' +
-                               '</div>' +
-                               '<div class="mw-collapsible-content">' + loremIpsum + '</div>' +
-                       '</div>',
-                       // Can't do asynchronous because we're testing that the event *doesn't* happen
-                       { instantHide: true }
-               );
-               $content = $collapsible.find( '.mw-collapsible-content' );
+       QUnit.test( 'clicks on links inside toggler pass through (options.linksPassthru)', 2, function ( assert ) {
+               var $collapsible = prepareCollapsible(
+                               '<div class="mw-collapsible">' +
+                                       '<div class="mw-collapsible-toggle">' +
+                                               'Toggle <a href="#top">toggle</a> toggle <b>toggle</b>' +
+                                       '</div>' +
+                                       '<div class="mw-collapsible-content">' + loremIpsum + '</div>' +
+                               '</div>',
+                               // Can't do asynchronous because we're testing that the event *doesn't* happen
+                               { instantHide: true }
+                       ),
+                       $content = $collapsible.find( '.mw-collapsible-content' );
 
                $collapsible.find( '.mw-collapsible-toggle a' ).trigger( 'click' );
                assert.assertTrue( $content.is( ':visible' ), 'click event on link inside toggle passes through (content not toggled)' );
        } );
 
        QUnit.asyncTest( 'collapse/expand text (data-collapsetext, data-expandtext)', 2, function ( assert ) {
-               var $collapsible, $toggleLink;
-               $collapsible = prepareCollapsible(
-                       '<div class="mw-collapsible" data-collapsetext="Collapse me!" data-expandtext="Expand me!">' +
-                               loremIpsum +
-                       '</div>'
-               );
-               $toggleLink = $collapsible.find( '.mw-collapsible-toggle a' );
+               var $collapsible = prepareCollapsible(
+                               '<div class="mw-collapsible" data-collapsetext="Collapse me!" data-expandtext="Expand me!">' +
+                                       loremIpsum +
+                               '</div>'
+                       ),
+                       $toggleLink = $collapsible.find( '.mw-collapsible-toggle a' );
 
                assert.equal( $toggleLink.text(), 'Collapse me!', 'data-collapsetext is respected' );
 
        } );
 
        QUnit.asyncTest( 'collapse/expand text (options.collapseText, options.expandText)', 2, function ( assert ) {
-               var $collapsible, $toggleLink;
-               $collapsible = prepareCollapsible(
-                       '<div class="mw-collapsible">' + loremIpsum + '</div>',
-                       { collapseText: 'Collapse me!', expandText: 'Expand me!' }
-               );
-               $toggleLink = $collapsible.find( '.mw-collapsible-toggle a' );
+               var $collapsible = prepareCollapsible(
+                               '<div class="mw-collapsible">' + loremIpsum + '</div>',
+                               { collapseText: 'Collapse me!', expandText: 'Expand me!' }
+                       ),
+                       $toggleLink = $collapsible.find( '.mw-collapsible-toggle a' );
 
                assert.equal( $toggleLink.text(), 'Collapse me!', 'options.collapseText is respected' );