Toolbar: removing popup removes page-header-fixed class

adding tests for toolbar Fixes jquery-archivegh-6987 Fixes jquery-archivegh-6939
cgack · Jul 31, 2014 · 5282fa1 · 5282fa1
1 parent 95579f0
commit 5282fa1
Show file tree

Hide file tree

Showing 2 changed files with 127 additions and 0 deletions.
diff --git a/tests/unit/toolbar/index.html b/tests/unit/toolbar/index.html
@@ -0,0 +1,57 @@
+<!doctype html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8" />
+    <title>jQuery Mobile Toolbar Test Suite</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+    <script src="../../../external/requirejs/require.js"></script>
+    <script src="../../../js/requirejs.config.js"></script>
+    <script src="../../../js/jquery.tag.inserter.js"></script>
+    <script src="../../jquery.setNameSpace.js"></script>
+    <script src="../../../tests/jquery.testHelper.js"></script>
+    <script src="../../../external/qunit/qunit.js"></script>
+    <script>
+        $.testHelper.asyncLoad([
+            [
+                "navigation/method",
+                "buttonMarkup",
+                "widgets/toolbar",
+            ],
+            [ "init"],
+            [ "./toolbar_core.js" ]
+        ]);
+    </script>
+
+    <link rel="stylesheet"  href="../../../css/themes/default/jquery.mobile.css"/>
+    <link rel="stylesheet" href="../../../external/qunit/qunit.css"/>
+    <link rel="stylesheet" href="../../jqm-tests.css"/>
+
+    <script src="../../swarminject.js"></script>
+</head>
+<body>
+
+    <div id="qunit"></div>
+    <div data-nstest-role="page">
+        <div data-nstest-role="header" id="testHeaderClasses">
+            <h1>Header</h1>
+        </div>
+        <div data-nstest-role="footer" id="testFooterClasses">
+            <h1>Footer</h1>
+        </div>
+        <div id="testInit">
+            <h1>Header</h1>
+        </div>
+
+    </div>
+
+    <div data-nstest-role="header" class="ui-screen-hidden" id="testExternalHeader">
+        <h1>External Header</h1>
+    </div>
+
+    <div data-nstest-role="footer" class="ui-screen-hidden" id="testExternalFooter">
+        <h1>External Footer</h1>
+    </div>
+
+</body>
+</html>
diff --git a/tests/unit/toolbar/toolbar_core.js b/tests/unit/toolbar/toolbar_core.js
@@ -0,0 +1,70 @@
+/*
+ * mobile Fixed Toolbar unit tests
+ */
+(function($){
+    module( "toolbar" );
+
+    test( "header classes and roles assigned correctly", function() {
+        var toolbar = $( "#testHeaderClasses" );
+
+        ok( toolbar.hasClass( "ui-header" ), "toolbar gets ui-header after init" ); 
+        ok( toolbar.find( "h1" ).hasClass( "ui-title" ), "toolbar title assigned correctly");
+        ok( toolbar.attr( "role" ) === "banner", "header gets banner role assigned" );
+        ok( toolbar.find( "h1" ).attr( "role" ) === "heading", "heading role properly assigned");
+    });
+
+
+    test( "footer classes and roles assigned correctly", function() {
+        var toolbar = $( "#testFooterClasses" );
+
+        ok( toolbar.hasClass( "ui-footer" ), "toolbar gets ui-footer after init" ); 
+        ok( toolbar.find( "h1" ).hasClass( "ui-title" ), "toolbar title assigned correctly");
+        ok( toolbar.attr( "role" ) === "contentinfo", "footer gets contentinfo role assigned" );
+        ok( toolbar.find( "h1" ).attr( "role" ) === "heading", "heading role properly assigned");
+    });
+
+
+    asyncTest( "manual init works properly", function() {
+        expect( 3 );
+
+        var toolbar = $( "#testInit" ).toolbar({
+            create: function( event, ui ) {
+                ok( true, "create event fired" );
+                start();
+            }
+        });
+
+        ok( toolbar.hasClass( "ui-footer" ), "manual init gets footer class" );
+        ok( toolbar.find( "h1" ).hasClass( "ui-title" ), "ui-title assigned");
+    });
+
+    asyncTest( "external headers are created properly", function() {
+        expect( 3 );
+
+        var toolbar = $( "#testExternalHeader" ).toolbar({
+            create: function( event, ui ) {
+                ok( true, "external toolbar create event" );
+                start();
+            }
+        });
+
+        ok( toolbar.hasClass( "ui-header" ), "external toolbar gets ui-header class" );
+        ok( toolbar.find( "h1" ).hasClass( "ui-title" ), "ui-title assigned properly" );
+    });
+
+     asyncTest( "external footers are created properly", function() {
+        expect( 3 );
+
+        var toolbar = $( "#testExternalFooter" ).toolbar({
+            create: function( event, ui ) {
+                ok( true, "external toolbar create event" );
+                start();
+            }
+        });
+
+        ok( toolbar.hasClass( "ui-footer" ), "external toolbar gets ui-footer class" );
+        ok( toolbar.find( "h1" ).hasClass( "ui-title" ), "ui-title assigned properly" );
+    });
+
+
+})(jQuery);