IDs and names for dialogs

It's hard to detect if or which type dialog is displayed becouse not all dialogs have IDs.

On dialog open, it's id or name (if id is not set) is used for containing element id. Many of dialog types were missing id or name so name was added to each dialog type.

In HTML, element's id should be unique. Our framework allows opening two dialogs with the same id. It may lead to state where getElementById method may have unpredicted behaviour. Therefore attribute 'data-name' with dialog's name was added to dialog's containing element. Automation framework can search more reliable by using this attribute instead of id.

https://fedorahosted.org/freeipa/ticket/2853

install/ui/add.js

@@ -27,6 +27,8 @@ IPA.entity_adder_dialog = function(spec) {
 
     spec = spec || {};
 
+    spec.name = spec.name || 'entity_adder_dialog';
+
     var that = IPA.dialog(spec);
 
     that.method = spec.method || 'add';

install/ui/details.js

@@ -576,6 +576,7 @@ IPA.details_facet = function(spec, no_init) {
 
     that.show_validation_error = function() {
         var dialog = IPA.message_dialog({
+            name: 'validation_error',
             title: IPA.messages.dialogs.validation_title,
             message: IPA.messages.dialogs.validation_message
         });

install/ui/dialog.js

@@ -61,7 +61,7 @@ IPA.dialog = function(spec) {
     var that = {};
 
     that.entity = IPA.get_entity(spec.entity);
-    that.name = spec.name;
+    that.name = spec.name || 'dialog';
     that.id = spec.id;
     that.title = spec.title;
     that.width = spec.width || 500;
@@ -107,6 +107,12 @@ IPA.dialog = function(spec) {
         return valid;
     };
 
+    that.get_id = function() {
+        if (that.id) return that.id;
+        if (that.name) return that.name;
+        return null;
+    };
+
 
     /**
      * Create content layout
@@ -147,7 +153,11 @@ IPA.dialog = function(spec) {
      */
     that.open = function(container) {
 
-        that.container = $('<div/>', { id : that.id });
+        that.container = $('<div/>', {
+            id : that.get_id(),
+            'data-name': that.name
+        });
+
         if (container) {
             container.append(that.container);
         }
@@ -286,6 +296,8 @@ IPA.adder_dialog = function(spec) {
 
     spec = spec || {};
 
+    spec.name = spec.name || 'adder_dialog';
+
     var that = IPA.dialog(spec);
 
     that.external = spec.external;
@@ -557,6 +569,7 @@ IPA.adder_dialog = function(spec) {
 IPA.deleter_dialog =  function (spec) {
 
     spec = spec || {};
+    spec.name = spec.name || 'deleter_dialog';
 
     var that = IPA.dialog(spec);
 
@@ -639,13 +652,13 @@ IPA.deleter_dialog =  function (spec) {
 
 IPA.message_dialog = function(spec) {
 
-    var that = IPA.dialog(spec);
+    spec = spec || {};
 
-    var init = function() {
-        spec = spec || {};
-        that.message = spec.message || '';
-        that.on_ok = spec.on_ok;
-    };
+    spec.name = spec.name || 'message_dialog';
+
+    var that = IPA.dialog(spec);
+    that.message = spec.message || '';
+    that.on_ok = spec.on_ok;
 
     that.create = function() {
         $('<p/>', {
@@ -664,8 +677,6 @@ IPA.message_dialog = function(spec) {
         }
     });
 
-    init();
-
     that.message_dialog_create = that.create;
 
     return that;

install/ui/ipa.js

@@ -331,6 +331,7 @@ IPA.logout = function() {
 
     function show_error(message) {
         var dialog = IPA.message_dialog({
+            name: 'logout_error',
             message: message,
             title: IPA.messages.login.logout_error
         });
@@ -1023,6 +1024,7 @@ IPA.concurrent_command = function(spec) {
             command = command_info.command;
             if(!command) {
                 var dialog = IPA.message_dialog({
+                    name: 'internal_error',
                     title: IPA.get_message('errors.error', 'Error'),
                     message: IPA.get_message('errors.internal_error', 'Internal error.')
                 });
@@ -1118,6 +1120,7 @@ IPA.concurrent_command = function(spec) {
 
         } else {
             var dialog = IPA.message_dialog({
+                name: 'operation_error',
                 title: IPA.get_message('dialogs.batch_error_title', 'Operations Error'),
                 message: IPA.get_message('dialogs.batch_error_message', 'Some operations failed.')
             });
@@ -1377,7 +1380,7 @@ IPA.error_dialog = function(spec) {
     var init = function() {
         spec = spec || {};
 
-        that.id = 'error_dialog';
+        that.id = spec.id || 'error_dialog';
         that.xhr = spec.xhr || {};
         that.text_status = spec.text_status || '';
         that.error_thrown = spec.error_thrown || {};
@@ -1554,6 +1557,7 @@ IPA.create_4304_error_handler = function(adder_dialog) {
 
         if (data && data.error && data.error.code === 4304) {
             dialog = IPA.message_dialog({
+                name: 'error_4304_info',
                 message: data.error.message,
                 title: adder_dialog.title,
                 on_ok: function() {
@@ -1621,6 +1625,8 @@ IPA.unauthorized_dialog = function(spec) {
     ];
 
     spec.visible_buttons = spec.visible_buttons || ['retry'];
+    spec.name = spec.name || 'unauthorized_dialog';
+    spec.id = spec.id || spec.name;
 
     var that = IPA.error_dialog(spec);
 

install/ui/sudo.js

@@ -798,6 +798,7 @@ IPA.sudo.options_section = function(spec) {
         title = title.replace('${entity}', label);
 
         var dialog = IPA.dialog({
+            name: 'option-adder-dialog',
             title: title,
             sections: [
                 {

install/ui/widget.js

@@ -3297,6 +3297,7 @@ IPA.sshkey_widget = function(spec) {
     that.create_edit_dialog = function() {
 
         var dialog = IPA.dialog({
+            name: 'sshkey-edit-dialog',
             title: IPA.messages.objects.sshkeystore.set_dialog_title,
             width: 500,
             height: 380