From 14e0450dc70441c70d4e3be16f9aaaf36fcc1d59 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Scott=20Gonz=C3=A1lez?= <scott.gonzalez@gmail.com>
Date: Fri, 19 Sep 2008 18:28:31 +0000
Subject: [PATCH] Dialog: Added an id to the title span (needed for ARIA
 support).

---
 tests/dialog.js | 24 ++++++++++++++++++++++++
 ui/ui.dialog.js | 19 +++++++++++++++----
 2 files changed, 39 insertions(+), 4 deletions(-)

diff --git a/tests/dialog.js b/tests/dialog.js
index b5fbfa6ee..b6362aa4e 100644
--- a/tests/dialog.js
+++ b/tests/dialog.js
@@ -193,6 +193,30 @@ test("defaults", function() {
 	el.remove();
 });
 
+test("title id", function() {
+	expect(3);
+	
+	var titleId;
+	
+	// reset the uuid so we know what values to expect
+	$.ui.dialog.uuid = 0;
+	
+	el = $('<div/>').dialog();
+	titleId = dlg().find('.ui-dialog-title').attr('id');
+	equals(titleId, 'ui-dialog-title-1', 'auto-numbered title id');
+	el.remove();
+	
+	el = $('<div/>').dialog();
+	titleId = dlg().find('.ui-dialog-title').attr('id');
+	equals(titleId, 'ui-dialog-title-2', 'auto-numbered title id');
+	el.remove();
+	
+	el = $('<div id="foo"/>').dialog();
+	titleId = dlg().find('.ui-dialog-title').attr('id');
+	equals(titleId, 'ui-dialog-title-foo', 'carried over title id');
+	el.remove();
+});
+
 module("dialog: Options");
 
 test("autoOpen", function() {
diff --git a/ui/ui.dialog.js b/ui/ui.dialog.js
index cc4f37762..c0a99494c 100644
--- a/ui/ui.dialog.js
+++ b/ui/ui.dialog.js
@@ -49,13 +49,19 @@ $.widget("ui.dialog", {
 					height: '100%'
 				}),
 			
-			title = options.title || '&nbsp;',
-			uiDialogTitlebar = (this.uiDialogTitlebar =
-				$('<div class="ui-dialog-titlebar"/>'))
-				.append('<span class="ui-dialog-title">' + title + '</span>')
+			uiDialogTitlebar = (this.uiDialogTitlebar = $('<div/>'))
+				.addClass('ui-dialog-titlebar')
 				.append('<a href="#" class="ui-dialog-titlebar-close"><span>X</span></a>')
 				.prependTo(uiDialogContainer),
 			
+			title = options.title || '&nbsp;',
+			titleId = $.ui.dialog.getTitleId(this.element),
+			uiDialogTitle = $('<span/>')
+				.addClass('ui-dialog-title')
+				.attr('id', titleId)
+				.html(title)
+				.prependTo(uiDialogTitlebar),
+			
 			uiDialog = (this.uiDialog = uiDialogContainer.parent())
 				.appendTo(document.body)
 				.hide()
@@ -411,6 +417,11 @@ $.extend($.ui.dialog, {
 	
 	getter: 'isOpen',
 	
+	uuid: 0,
+	getTitleId: function($el) {
+		return 'ui-dialog-title-' + ($el.attr('id') || ++this.uuid);
+	},
+	
 	overlay: function(dialog) {
 		this.$el = $.ui.dialog.overlay.create(dialog);
 	}