Table: Reflow labels honor <abbr> title

(cherry picked from commit 15f7a67) Closes gh-7609 Fixes gh-7608
jquery-archive · Aug 22, 2014 · b0b3495 · b0b3495
1 parent 0095c40
commit b0b3495
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 0 deletions.
diff --git a/js/widgets/table.reflow.js b/js/widgets/table.reflow.js
@@ -80,6 +80,9 @@ $.widget( "mobile.table", $.mobile.table, {
 	},
 
 	_addLabels: function( cells, label, contents ) {
+		if ( contents.length === 1 && contents[ 0 ].nodeName.toLowerCase() === "abbr" ) {
+			contents = contents.eq( 0 ).attr( "title" );
+		}
 		// .not fixes #6006
 		cells
 			.not( ":has(b." + label + ")" )

diff --git a/tests/unit/table/index.html b/tests/unit/table/index.html
@@ -129,6 +129,21 @@ <h1>Basic Table</h1>
 					</tr>
 				</tbody>
 			</table>
+			<table data-nstest-role="table" data-nstest-mode="reflow" id="reflow-abbr-test">
+				<thead>
+					<tr>
+						<th><abbr title="Player Name">PN</abbr></th>
+					</tr>
+				</thead>
+				<tbody>
+					<tr>
+						<td id="reflow-abbr-td1">Player I</td>
+					</tr>
+					<tr>
+						<td id="reflow-abbr-td2">Player II</td>
+					</tr>
+				</tbody>
+			</table>
 		</div>
 	</div>
 

diff --git a/tests/unit/table/table_core.js b/tests/unit/table/table_core.js
@@ -99,6 +99,13 @@
 		}, 800);
 	});
 
+	test( "Reflow mode honors <abbr> tag title", function() {
+		var table = $( "#reflow-abbr-test" );
+
+		deepEqual( $( "#reflow-abbr-td1 b" ).text(), "Player Name", "Row 1 has the right label" );
+		deepEqual( $( "#reflow-abbr-td2 b" ).text(), "Player Name", "Row 2 has the right label" );
+	});
+
 	asyncTest( "The appropriate label is added" , function(){
 		setTimeout(function(){
 			var $table = $( "#reflow-table-test table" ),