Issue jquery-archive#2654 - 'degradeInputs' plugin doesn't trigger on 'create' events; modified plugin and added tests

Author: redaemn

js/jquery.mobile.degradeInputs.js

@@ -27,10 +27,9 @@ $.mobile.page.prototype.options.keepNative = ":jqmData(role='none'), :jqmData(ro
 
 
 //auto self-init widgets
-$( document ).bind( "pagecreate enhance", function( e ){
+$( document ).bind( "pagecreate create", function( e ){
 
-	var page = $( e.target ).data( "page" ),
-		o = page.options;
+	var o = $.mobile.page.prototype.options;
 
 	// degrade inputs to avoid poorly implemented native functionality
 	$( e.target ).find( "input" ).not( o.keepNative ).each(function() {

tests/unit/degradeInputs/degradeInputs.js

@@ -0,0 +1,90 @@
+/*
+ * degradeInputs unit tests
+ */
+
+(function($){
+	module('jquery.mobile.slider.js', {
+	    setup: function() {
+	        $('#test-container').html("");
+	    }
+	});
+	
+	test('input type color should not degrade when "create" event is triggered', function(){
+        $('#test-container').html('<input type="color" />').trigger("create");
+        
+        same($('#test-container input').attr("type"), "color");
+    });
+    
+    test('input type date should not degrade when "create" event is triggered', function(){
+        $('#test-container').html('<input type="date" />').trigger("create");
+        
+        same($('#test-container input').attr("type"), "date");
+    });
+    
+    test('input type datetime should not degrade when "create" event is triggered', function(){
+        $('#test-container').html('<input type="datetime" />').trigger("create");
+        
+        same($('#test-container input').attr("type"), "datetime");
+    });
+    
+    test('input type datetime-local should not degrade when "create" event is triggered', function(){
+        $('#test-container').html('<input type="datetime-local" />').trigger("create");
+        
+        same($('#test-container input').attr("type"), "datetime-local");
+    });
+    
+    test('input type email should not degrade when "create" event is triggered', function(){
+        $('#test-container').html('<input type="email" />').trigger("create");
+        
+        same($('#test-container input').attr("type"), "email");
+    });
+    
+    test('input type month should not degrade when "create" event is triggered', function(){
+        $('#test-container').html('<input type="month" />').trigger("create");
+        
+        same($('#test-container input').attr("type"), "month");
+    });
+    
+    test('input type number should not degrade when "create" event is triggered', function(){
+        $('#test-container').html('<input type="number" />').trigger("create");
+        
+        same($('#test-container input').attr("type"), "number");
+    });
+
+    test('input type range should degrade to number when "create" event is triggered', function(){
+        $('#test-container').html('<input type="range" />').trigger("create");
+        
+        same($('#test-container input').attr("type"), "number");
+    });
+    
+    test('input type search should degrade to text when "create" event is triggered', function(){
+        $('#test-container').html('<input type="search" />').trigger("create");
+        
+        same($('#test-container input').attr("type"), "text");
+    });
+    
+    test('input type tel should not degrade when "create" event is triggered', function(){
+        $('#test-container').html('<input type="tel" />').trigger("create");
+        
+        same($('#test-container input').attr("type"), "tel");
+    });
+    
+    test('input type time should not degrade when "create" event is triggered', function(){
+        $('#test-container').html('<input type="time" />').trigger("create");
+        
+        same($('#test-container input').attr("type"), "time");
+    });
+    
+    test('input type url should not degrade when "create" event is triggered', function(){
+        $('#test-container').html('<input type="url" />').trigger("create");
+        
+        same($('#test-container input').attr("type"), "url");
+    });
+    
+    test('input type week should not degrade when "create" event is triggered', function(){
+        $('#test-container').html('<input type="week" />').trigger("create");
+        
+        same($('#test-container input').attr("type"), "week");
+    });
+	
+})(jQuery);

tests/unit/degradeInputs/index.html

@@ -0,0 +1,35 @@
+ <!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="utf-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+	<title>jQuery Mobile Degrade Inputs 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="degradeInputs.js"></script>
+</head>
+<body>
+
+<h1 id="qunit-header">jQuery Mobile Degrade Inputs Test Suite</h1>
+<h2 id="qunit-banner"></h2>
+<h2 id="qunit-userAgent"></h2>
+<ol id="qunit-tests">
+</ol>
+
+<div id="foo"  data-nstest-role="page">
+	
+	<div id="test-container">
+	</div>
+	
+</div>
+
+</html>