erp5_web_renderjs_ui: reimplement relation field

bt5/erp5_hal_json_style/SkinTemplateItem/portal_skins/erp5_hal_json_style/ERP5Document_getHateoas.py

@@ -226,7 +226,44 @@ def renderField(traversed_document, field, form_relative_url, value=None, meta_t
         {"portal_type": portal_type_list}
       ).asSearchTextExpression(sql_catalog)})
     }
+    title = field.get_value("title"),
+    column_list = field.get_value("columns")
+    proxy_listbox_ids = field.get_value("proxy_listbox_ids")
+
+    if len(proxy_listbox_ids):
+      listbox_ids = proxy_listbox_ids
+    else:
+      listbox_ids = [('Base_viewRelatedObjectListBase/listbox','default')]
+    listbox = {}
+
+    for grain in listbox_ids:
+      tmp = grain[0].split('/')
+      form = getattr(context, tmp[0])
+      for listbox_field in form.get_fields():
+        if listbox_field.getId() == tmp[1]:
+          #get original definition
+          result = renderField(context, listbox_field, getFormRelativeUrl(form))
+          #overwrite, like Base_getRelatedObjectParameter does
+          if result["portal_type"] == []:
+            result["portal_type"] = field.get_value('portal_type')
+          result["query"] = url_template_dict["jio_search_template"] % {
+            "query": make_query({"query": sql_catalog.buildQuery(
+              dict(portal_type = [x[1] for x in result["portal_type"]],
+                **result["default_params"]), ignore_unknown_columns=True
+           ).asSearchTextExpression(sql_catalog)})
+          }
+          result.pop("list_method_template", None)
+          result["list_method"] = "portal_catalog"
+          result["title"] = title
+          #set default listbox's column list to relation's column list
+          if tmp[0] == 'Base_viewRelatedObjectListBase' and len(column_list) > 0:
+            result["column_list"] = column_list
+          listbox[grain[1]] = result
+          break
+
+
     result = {
+      "url": relative_url,
       "portal_types": portal_type_list,
       "query": query,
       "catalog_index": field.get_value('catalog_index'),
@@ -238,10 +275,17 @@ def renderField(traversed_document, field, form_relative_url, value=None, meta_t
       "css_class": field.get_value("css_class"),
       "hidden": field.get_value("hidden"),
       "description": field.get_value("description"),
-      "title": field.get_value("title"),
-      "required": field.get_value("required")
+      "title": title,
+      "required": field.get_value("required"),
+      "proxy_listbox_ids_len": len(proxy_listbox_ids),
+      "listbox": listbox
     }
-    result["default"] = getFieldDefault(traversed_document, field, result["key"], value)
+    tmp = getFieldDefault(traversed_document, field, result["key"], value)
+    if isinstance(tmp, list):
+      result["default"] = tmp
+    else:
+      result["default"] = [tmp]
+
     result["relation_field_id"] = traversed_document.Field_getSubFieldKeyDict(
       field,
       "relation",
@@ -251,12 +295,7 @@ def renderField(traversed_document, field, form_relative_url, value=None, meta_t
       field,
       "item", key=result["key"]
     )
-
-    if jump_reference_list:
-      url = [jump_reference.getRelativeUrl() for jump_reference in jump_reference_list]
-      uid = [jump_reference.getUid() for jump_reference in jump_reference_list]
-      result["relation_item_relative_url"] = url
-      result["relation_item_uid"] = uid
+    result["relation_item_relative_url"] = [jump_reference.getRelativeUrl() for jump_reference in jump_reference_list]
 
   elif meta_type == "CheckBoxField":
     result = {

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_appcache.xml

@@ -182,6 +182,8 @@ gadget_erp5_page_logout.html\n
 gadget_erp5_page_logout.js\n
 gadget_erp5_page_preference.html\n
 gadget_erp5_page_preference.js\n
+gadget_erp5_page_relation_search.html\n
+gadget_erp5_page_relation_search.js\n
 gadget_erp5_page_search.html\n
 gadget_erp5_page_search.js\n
 gadget_erp5_page_tab.html\n
@@ -311,8 +313,8 @@ NETWORK:\n
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1421252934.14</float>
-                        <string>GMT</string>
+                        <float>1465381395.69</float>
+                        <string>UTC</string>
                       </tuple>
                     </state>
                   </object>
@@ -356,7 +358,7 @@ NETWORK:\n
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>952.5891.21040.4130</string> </value>
+                <value> <string>952.10297.7504.12014</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -374,7 +376,7 @@ NETWORK:\n
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1466784262.24</float>
+                        <float>1467109017.1</float>
                         <string>UTC</string>
                       </tuple>
                     </state>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_css.css

@@ -2087,6 +2087,12 @@ html .ui-listview li:nth-child(even) > .ui-btn {
   background-color: #fff;
   background-color: rgba(0,0,0,0);
 }
+
+/* fix relation string field background transparent error */
+html .ui-listview li.ui-autocomplete ~ li {
+  background-color: white;
+}
+
 /*
    -------------------------------------------------------------------------
    ----------------------------- Controlgroup ------------------------------
@@ -2123,7 +2129,6 @@ html body .ui-tag-list-inset {
   position: absolute;
   top: 0;
   right: 0;
-  left: 3em;
   white-space: nowrap;
   overflow: hidden;
 }

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_datetimefield_js.js

@@ -125,7 +125,7 @@
         input.setAttribute('disabled', 'disabled');
       }
     })
-    .declareMethod('getContent', function () {
+    .declareMethod('getContent', function (options) {
       var input = this.element.querySelector('input'),
         result = {},
         select,
@@ -135,65 +135,92 @@
         date,
         hour,
         minute,
+        timezone,
+        zone_list = {"GMT-12": "-1200", "GMT-11": "-1100",
+                   "GMT-9": "-0900", "GMT-8": "-0800",
+                   "GMT-7": "-0700", "GMT-6": "-0600",
+                   "GMT-5": "-0500", "GMT-4": "-0400",
+                   "GMT-3": "-0300", "GMT-2": "-0200",
+                   "GMT-1": "-0100", "GMT": "+0000",
+                   "GMT+1": "+0100", "GMT+2": "+0200",
+                   "GMT+3": "+0300", "GMT+4": "+0400",
+                   "GMT+5": "+0500", "GMT+6": "+0600",
+                   "GMT+7": "+0700", "GMT+8": "+0800",
+                   "GMT+9": "+0900", "GMT+10": "+1000",
+                   "GMT+11": "+1100", "GMT+12": "+1200"},
         value = input.value;
-      if (value !== "") {
-        if (field_json.date_only === 0) {
-          value += "+0000";
-        }
-        value = new Date(value);
-        year = value.getUTCFullYear();
-        month = value.getUTCMonth() + 1;
-        date = value.getUTCDate();
-        if (field_json.hide_day === 1) {
-          date = 1;
-        }
-        //get time
-        if (field_json.date_only === 0) {
-          if (field_json.allow_empty_time === 1) {
-            hour = 0;
-            minute = 0;
-          } else {
-            hour = value.getUTCHours();
-            minute = value.getUTCMinutes();
+      if (options === undefined || options.format === "erp5") {
+        if (value !== "") {
+          if (field_json.date_only === 0) {
+            value += "+0000";
+          }
+          value = new Date(value);
+          year = value.getUTCFullYear();
+          month = value.getUTCMonth() + 1;
+          date = value.getUTCDate();
+          if (field_json.hide_day === 1) {
+            date = 1;
           }
-          if (field_json.ampm_time_style === 1) {
-            if (hour > 12) {
-              result[field_json.subfield_ampm_key] = "pm";
-              hour -= 12;
+          //get time
+          if (field_json.date_only === 0) {
+            if (field_json.allow_empty_time === 1) {
+              hour = 0;
+              minute = 0;
             } else {
-              result[field_json.subfield_ampm_key] = "am";
+              hour = value.getUTCHours();
+              minute = value.getUTCMinutes();
             }
+            if (field_json.ampm_time_style === 1) {
+              if (hour > 12) {
+                result[field_json.subfield_ampm_key] = "pm";
+                hour -= 12;
+              } else {
+                result[field_json.subfield_ampm_key] = "am";
+              }
+            }
+            result[field_json.subfield_hour_key] = hour;
+            result[field_json.subfield_minute_key] = minute;
           }
-          result[field_json.subfield_hour_key] = hour;
-          result[field_json.subfield_minute_key] = minute;
-        }
 
-        if (field_json.hidden_day_is_last_day === 1) {
-          if (month === 12) {
-            year += 1;
-            month = 1;
-          } else {
-            month += 1;
+          if (field_json.hidden_day_is_last_day === 1) {
+            if (month === 12) {
+              year += 1;
+              month = 1;
+            } else {
+              month += 1;
+            }
           }
+          result[field_json.subfield_year_key] = year;
+          result[field_json.subfield_month_key] = month;
+          result[field_json.subfield_day_key] = date;
+          if (field_json.timezone_style) {
+            //set timezone
+            select = this.element.querySelector("select");
+            result[field_json.subfield_timezone_key] = select.options[select.selectedIndex].value;
+          }
+        } else {
+          //if no value, return empty data
+          if (field_json.date_only === 0) {
+            result[field_json.subfield_hour_key] = "";
+            result[field_json.subfield_minute_key] = "";
+          }
+          result[field_json.subfield_year_key] = "";
+          result[field_json.subfield_month_key] = "";
+          result[field_json.subfield_day_key] = "";
         }
-        result[field_json.subfield_year_key] = year;
-        result[field_json.subfield_month_key] = month;
-        result[field_json.subfield_day_key] = date;
-        if (field_json.timezone_style) {
-          //set timezone
-          select = this.element.querySelector("select");
-          result[field_json.subfield_timezone_key] = select.options[select.selectedIndex].value;
-        }
+        return result;
+      }
+      if (field_json.date_only) {
+        value += "T00:00";
+      }
+      if (field_json.timezone_style) {
+        //set timezone
+        select = this.element.querySelector("select");
+        timezone = select.options[select.selectedIndex].value;
       } else {
-        //if no value, return empty data
-        if (field_json.date_only === 0) {
-          result[field_json.subfield_hour_key] = "";
-          result[field_json.subfield_minute_key] = "";
-        }
-        result[field_json.subfield_year_key] = "";
-        result[field_json.subfield_month_key] = "";
-        result[field_json.subfield_day_key] = "";
+        timezone = "GMT";
       }
+      result[field_json.key] = value + zone_list[timezone];
       return result;
     })
     .declareMethod('checkValidity', function () {

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_form_js.js

@@ -98,6 +98,9 @@
     .allowPublicAcquisition("getFieldTypeGadgetUrl", function (param_list) {
       return getFieldTypeGadgetUrl(param_list[0]);
     })
+    .allowPublicAcquisition("getFormContent", function (param_list) {
+      return this.getContent(param_list[0]);
+    })
 
     /////////////////////////////////////////////////////////////////
     // declared methods
@@ -196,6 +199,7 @@
                       form_gadget.props.gadget_list.push(field_gadget);
                       var suboptions = options[renderered_field.key] || suboption_dict;
                       suboptions.field_json = renderered_field;
+                      suboptions.field_json.view = options.view;
                       return field_gadget.render(suboptions);
                     });
                 }
@@ -237,14 +241,13 @@
       }
       return {};
     })
-    .declareMethod("getContent", function () {
+    .declareMethod("getContent", function (options) {
       var form_gadget = this,
         k,
         field_gadget,
         count = form_gadget.props.gadget_list.length,
         data = {},
         queue = new RSVP.Queue();
-
       function extendData(field_data) {
         var key;
         for (key in field_data) {
@@ -253,13 +256,17 @@
           }
         }
       }
-
+      if (options === undefined) {
+        options = {
+          "format": "erp5"
+        };
+      }
       for (k = 0; k < count; k += 1) {
         field_gadget = form_gadget.props.gadget_list[k];
         // XXX Hack until better defined
         if (field_gadget.getContent !== undefined) {
           queue
-            .push(field_gadget.getContent.bind(field_gadget))
+            .push(field_gadget.getContent.bind(field_gadget, options))
             .push(extendData);
         }
       }

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_listbox_html.html

@@ -26,6 +26,9 @@
            {{#each head_value}}
               <th  data-i18n="{{data-i18n}}" class="{{class_value}}">{{text}}</th>
            {{/each}}
+           {{#if line_icon}}
+             <th></th>
+           {{/if}}
          </tr>
        </thead>
       </table>
@@ -42,6 +45,9 @@
            {{#each head_value}}
               <th  data-i18n="{{data-i18n}}" class="{{class_value}}">{{text}}</th>
            {{/each}}
+           {{#if line_icon}}
+             <th></th>
+           {{/if}}
          </tr>
        </thead>
       </table>
@@ -72,6 +78,11 @@
                 {{/if}}
               </th>
            {{/each}}
+           {{#if line_icon}}
+             <th>
+               <a href ="{{jump}}" class="ui-body-inherit ui-btn-icon-right ui-link ui-btn ui-corner-all ui-icon-mail-forward"></a>
+            </th>
+           {{/if}}
          </tr>
         {{/each}}
        </tbody>
@@ -107,6 +118,11 @@
                 {{/if}}
               </th>
            {{/each}}
+           {{#if line_icon}}
+             <th>
+               <a href ="{{jump}}" class="ui-body-inherit ui-btn-icon-right ui-link ui-btn ui-corner-all ui-icon-mail-forward"></a>
+             </th>
+            {{/if}}
          </tr>
         {{/each}}
        </tbody>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_listbox_js.js

@@ -46,7 +46,8 @@
     return gadget.translateHtml(template(
       {
         "head_value": gadget.props.head_value,
-        "show_anchor": gadget.props.field_json.show_anchor
+        "show_anchor": gadget.props.field_json.show_anchor,
+        "line_icon": gadget.props.field_json.line_icon
       }
     ));
   }
@@ -236,9 +237,11 @@
         j;
 
       gadget.props.field_json = field_json;
+      gadget.props.field_id = options.field_id;
       gadget.props.extended_search = options.extended_search;
       gadget.props.hide_class = options.hide_enabled ? "" : "ui-disabled";
       gadget.props.sort_list = [];
+      gadget.props.command = field_json.command || 'index';
 
       //only display which is in listbox's column list
       if (field_json.sort_column_list.length) {
@@ -392,9 +395,10 @@
           for (i = 0; i < counter; i += 1) {
             promise_list.push(
               gadget.getUrlFor({
-                command: 'index',
+                command: gadget.props.command,
                 options: {
                   jio_key: result.data.rows[i].id,
+                  uid: result.data.rows[i].value.uid,
                   selection_index: begin_from + i,
                   query: query_string,
                   list_method_template: field_json.list_method_template,
@@ -430,7 +434,8 @@
             body_value.push({
               "value": result.data.rows[i].value.uid,
               "jump": tmp_url,
-              "tr_value": tr_value
+              "tr_value": tr_value,
+              "line_icon": field_json.line_icon
             });
           }
           gadget.props.body_value = body_value;
@@ -458,7 +463,8 @@
 
         }).push(function (url_list) {
           var foot = {};
-          foot.colspan = field_json.column_list.length + gadget.props.field_json.show_anchor;
+          foot.colspan = field_json.column_list.length + field_json.show_anchor +
+            (field_json.line_icon ? 1 : 0);
           foot.default_colspan = foot.colspan;
           foot.previous_classname = "ui-btn ui-icon-carat-l ui-btn-icon-left responsive ui-first-child";
           foot.previous_url = url_list[0];
@@ -487,7 +493,7 @@
     })
 
 
-    .declareMethod("getContent", function () {
+    .declareMethod("getContent", function (options) {
       var form_gadget = this,
         k,
         field_gadget,
@@ -509,7 +515,7 @@
         // XXX Hack until better defined
         if (field_gadget.getContent !== undefined) {
           queue
-            .push(field_gadget.getContent.bind(field_gadget))
+            .push(field_gadget.getContent.bind(field_gadget, options))
             .push(extendData);
         }
       }

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_page_relation_search_html.html

+<!DOCTYPE html>
+<html>
+  <head>
+<base href="https://softinst62810.node.vifib.com/erp5/web_site_module/renderjs_runner/gadget_erp5_page_relation_search.html/" />
+
+    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
+    <meta name="viewport" content="width=device-width, user-scalable=no" />
+    <title>ERP5 Page Search</title>
+
+    <!-- renderjs -->
+    <script src="rsvp.js" type="text/javascript"></script>
+    <script src="renderjs.js" type="text/javascript"></script>
+
+    <!-- custom script -->
+    <script src="gadget_global.js" type="text/javascript"></script>
+    <script src="gadget_erp5_page_relation_search.js" type="text/javascript"></script>
+
+
+     <script id="search-template" type="text/x-handlebars-template">
+        <div class="ui-field-contain">
+          <label data-i18n="Select Template">Select Template<span></span></label>
+             <select>
+              {{#each options}}
+                {{#equal this ../select_template}}
+                  <option selected="selected" data-i18n="{{this}}" value="{{this}}">{{this}}</option>
+                {{else}}
+                  <option data-i18n="{{this}}" value="{{this}}">{{this}}</option>
+                {{/equal}}
+              {{/each}}
+             </select>
+        </div>
+
+    </script>
+
+  </head>
+
+  <body>
+      <div class="left">
+      </div>
+      <div data-gadget-url="gadget_erp5_pt_form_list.html"
+              data-gadget-scope="form_list"
+              data-gadget-sandbox="public">
+      </div>
+  </body>
+</html>
\ No newline at end of file

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_page_relation_search_js.js

+/*global window, rJS */
+/*jslint nomen: true, indent: 2, maxerr: 3 */
+/*global window, rJS, RSVP, Handlebars, loopEventListener*/
+(function (window, rJS, RSVP, Handlebars, loopEventListener) {
+  "use strict";
+
+  /////////////////////////////////////////////////////////////////
+  // Handlebars
+  /////////////////////////////////////////////////////////////////
+  // Precompile the templates while loading the first gadget instance
+  var gadget_klass = rJS(window),
+    search_source = gadget_klass.__template_element
+                         .getElementById("search-template")
+                         .innerHTML,
+    search_template = Handlebars.compile(search_source);
+
+  Handlebars.registerHelper('equal', function (left_value,
+    right_value, options) {
+    if (arguments.length < 3) {
+      throw new Error("Handlebars Helper equal needs 2 parameters");
+    }
+    if (left_value !== right_value) {
+      return options.inverse(this);
+    }
+    return options.fn(this);
+  });
+
+
+  gadget_klass
+    /////////////////////////////////////////////////////////////////
+    // ready
+    /////////////////////////////////////////////////////////////////
+    // Init local properties
+    .ready(function (g) {
+      g.props = {};
+    })
+
+    // Assign the element to a variable
+    .ready(function (g) {
+      return g.getElement()
+        .push(function (element) {
+          g.props.element = element;
+        });
+    })
+
+    /////////////////////////////////////////////////////////////////
+    // Acquired methods
+    /////////////////////////////////////////////////////////////////
+    .declareAcquiredMethod("updateHeader", "updateHeader")
+    .declareAcquiredMethod("getUrlParameter", "getUrlParameter")
+    .declareAcquiredMethod("getUrlFor", "getUrlFor")
+    .declareAcquiredMethod("redirect", "redirect")
+    .declareAcquiredMethod("jio_getAttachment", "jio_getAttachment")
+
+    /////////////////////////////////////////////////////////////////
+    // declared methods
+    /////////////////////////////////////////////////////////////////
+    .allowPublicAcquisition('updateHeader', function (param_list) {
+      return this.updateHeader({
+        page_title: param_list[0].page_title,
+        back_url: this.props.back_url,
+        filter_action: true
+      });
+    })
+    .allowPublicAcquisition('getUrlParameter', function (argument_list) {
+      return this.getUrlParameter(argument_list)
+        .push(function (result) {
+          if ((result === undefined) && (argument_list[0] === 'field_listbox_sort_list:json')) {
+            return [];
+          }
+          return result;
+        });
+    })
+    .declareMethod("render", function (options) {
+      var gadget = this,
+        select_template = options.select_template || "";
+      return gadget.getUrlFor({command: 'history_previous'})
+        .push(function (back_url) {
+          gadget.props.back_url = back_url;
+          return RSVP.all([
+            gadget.jio_getAttachment(options.url, options.view),
+            gadget.getDeclaredGadget('form_list')
+          ]);
+        })
+        .push(function (results) {
+          var form_gadget = results[1],
+            listbox_render,
+            field = results[0]._embedded._view[options.back_field.slice("field_".length)],
+            html;
+
+          gadget.props.listbox = field.listbox;
+          gadget.props.listbox_key = Object.keys(field.listbox);
+          gadget.props.field_title = field.title;
+
+          if (field.proxy_listbox_ids_len) {
+            if (select_template === "") {
+              select_template = gadget.props.listbox_key[0];
+            }
+            listbox_render = gadget.props.listbox[select_template];
+            html = search_template({
+              options: gadget.props.listbox_key,
+              select_template: select_template
+            });
+            gadget.props.element.querySelector(".left").innerHTML = html;
+          } else {
+            listbox_render = gadget.props.listbox[gadget.props.listbox_key[0]];
+          }
+          listbox_render.command = "history_previous";
+          listbox_render.line_icon = true;
+          return form_gadget.render({
+            erp5_document: {"_embedded": {"_view": {
+              "listbox": listbox_render
+            }},
+              "title": results[0].title,
+              "_links": results[0]._links
+              },
+            form_definition: {
+              group_list: [[
+                "bottom",
+                [["listbox"]]
+              ]]
+            }
+          });
+        });
+    })
+    .declareMethod("triggerSubmit", function () {
+      var argument_list = arguments;
+      return this.getDeclaredGadget('form_list')
+        .push(function (gadget) {
+          return gadget.triggerSubmit.apply(gadget, argument_list);
+        });
+    })
+    .declareService(function () {
+      var gadget = this,
+        select = gadget.props.element.querySelector("select");
+      if (select) {
+        return loopEventListener(
+          select,
+          'change',
+          false,
+          function (event) {
+            var target = event.target,
+              value = target.options[target.selectedIndex].value;
+            return gadget.redirect({
+              command: 'change',
+              options: {
+                select_template: value
+              }
+            });
+          }
+        );
+      }
+    });
+}(window, rJS, RSVP, Handlebars, loopEventListener));
\ No newline at end of file

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_pt_form_view_js.js

@@ -37,7 +37,8 @@
           for (key in rendered_form) {
             if (rendered_form.hasOwnProperty(key) && (key[0] !== "_")) {
               rendered_field = rendered_form[key];
-              if ((rendered_field.type !== "ListBox") && ((!rendered_field.default) || (rendered_field.hidden === 1) || (rendered_field.default.length === 0))) {
+              if ((rendered_field.type !== "ListBox") && ((!rendered_field.default) || (rendered_field.hidden === 1) || (rendered_field.default.length === 0)
+                   || (rendered_field.default.length === 1 && (!rendered_field.default[0])))) {
                 delete rendered_form[key];
               } else {
                 rendered_field.editable = 0;

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_pt_formpage_js.js

@@ -6,6 +6,20 @@
   var gadget_klass = rJS(window);
   // DEFAULT_VIEW_REFERENCE = "view";
 
+  function loadFormContent(gadget, result) {
+    var key;
+    if (gadget.props.options.form_content) {
+      for (key in result) {
+        if (result.hasOwnProperty(key)) {
+          if (gadget.props.options.form_content[result[key].key]) {
+            result[key].default = gadget.props.options.form_content[result[key].key];
+          }
+        }
+      }
+    }
+  }
+
+
   gadget_klass
     /////////////////////////////////////////////////////////////////
     // ready
@@ -27,12 +41,25 @@
     // Acquired methods
     /////////////////////////////////////////////////////////////////
     .declareAcquiredMethod("jio_getAttachment", "jio_getAttachment")
-    .declareAcquiredMethod("updateHeader", "updateHeader")
     .declareAcquiredMethod("redirect", "redirect")
+    .declareAcquiredMethod("jio_allDocs", "jio_allDocs")
 
     /////////////////////////////////////////////////////////////////
     // declared methods
     /////////////////////////////////////////////////////////////////
+    .allowPublicAcquisition("jio_allDocs", function (param_list) {
+      var gadget = this;
+      return gadget.jio_allDocs(param_list[0])
+        .push(function (result) {
+          var i;
+          if (result.data.rows.length) {
+            for (i = 0; i < result.data.rows.length; i += 1) {
+              loadFormContent(gadget, result.data.rows[i].value);
+            }
+          }
+          return result;
+        });
+    })
     .declareMethod('triggerSubmit', function () {
       return this.getDeclaredGadget('fg')
         .push(function (g) {
@@ -75,7 +102,7 @@
             })
             .push(function (result) {
               erp5_form = result;
-
+              loadFormContent(gadget, erp5_document._embedded._view);
               var url = "gadget_erp5_pt_" + erp5_form.pt;
               // XXX Hardcoded specific behaviour for form_view
               if ((options.editable !== undefined) && (erp5_form.pt === "form_view")) {

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_relationstringfield_html.html

@@ -5,21 +5,84 @@
     <meta name="viewport" content="width=device-width, user-scalable=no" />
     <title>ERP5 Relationstringfield</title>
 
-    <!-- renderjs -->
     <script src="rsvp.js" type="text/javascript"></script>
     <script src="renderjs.js" type="text/javascript"></script>
     <script src="URI.js" type="text/javascript"></script>
-    <!-- custom script -->
-    <script src="gadget_erp5_field_relationstring.js" type="text/javascript"></script>
+    <script src="handlebars.js" type="text/javascript"></script>
     <script src="gadget_global.js" type="text/javascript"></script>
+    <script src="gadget_erp5_field_relationstring.js" type="text/javascript"></script>
+
+
+
+    <script id="create-template" type="text/x-handlebars-template">
+      <div class="ui-controlgroup ui-controlgroup-horizontal ui-corner-all">
+        <div class="ui-controlgroup-controls">
+          <li class="ui-first-child ui-last-child ui-input-text">Create:{{text}}
+          </li>
+      </div>
+    </script>
 
 
+    <script id="relation-input-template" type="text/x-handlebars-template">
+      <div class="ui-input-text ui-body-inherit ui-corner-all ui-shadow-inset ui-input-has-clear ui-input-has-icon {{readonly}}">
+        <input type='text' title={{title}} name={{name}} autocomplete="off" data-enhanced="true"  {{required}} value="{{value}}" >
+        <a href="#" tabindex="-1" class="ui-hidden-accessible">&nbsp;</a>
+        <div class="ui-tag-list ui-tag-list-inset">
+         {{#if create_object}}
+            <div class="ui-controlgroup ui-controlgroup-horizontal ui-corner-all">
+              <div class="ui-controlgroup-controls">
+                <li class="ui-first-child ui-last-child ui-input-text">Create:{{create_object}}
+                </li>
+              </div>
+            </div>
+         {{/if}}
+        </div>
+        <ul class="ui-listview ui-corner-all search_ul"></ul>
+      </div>
+      {{#if create_object}}
+        <a href='#' tabindex="-1" class="ui-btn ui-corner-all ui-btn-icon-notext ui-icon-plus ui-shadow-inset ui-btn-inline ui-disabled" >Jump to this document</a>
+      {{else}}
+        {{#if error_text}}
+            <a href='#' tabindex="-1" class="ui-btn ui-corner-all ui-btn-icon-notext ui-icon-warning ui-shadow-inset ui-btn-inline ui-disabled">Jump to this document</a>
+        {{else}}
+          {{#if jump_unknown}}
+              <a href='#' tabindex="-1" class="ui-btn ui-corner-all ui-btn-icon-notext ui-icon-warning ui-shadow-inset ui-btn-inline ui-disabled">Jump to this document</a>
+          {{else}}
+            {{#if href}}
+              {{#if allow_jump}}
+                <a href={{href}} tabindex="-1" class="ui-btn ui-corner-all ui-btn-icon-notext ui-icon-plane ui-shadow-inset ui-btn-inline" >Jump to this document</a>
+              {{else}}
+                <a href='#' tabindex="-1" class="ui-btn ui-corner-all ui-btn-icon-notext ui-icon-plane ui-shadow-inset ui-btn-inline ui-disabled">Jump to this document</a>
+              {{/if}}
+            {{else}}
+              <a href='#' tabindex="-1" class="ui-btn ui-corner-all ui-btn-icon-notext ui-icon-plane ui-shadow-inset ui-btn-inline ui-disabled">Jump to this document</a>
+           {{/if}}
+          {{/if}}
+        {{/if}}
+      {{/if}}
+    </script>
+
+
+    <script id="relation-listview-template" type="text/x-handlebars-template">
+      {{#if list.length}}
+        <li class="ui-autocomplete ui-li ui-li-divider ui-bar-inherit ui-first-child" role="heading">Select from the {{list.length}} Search Results</li>
+        {{#each list}}
+          <li class="ui-li-static ui-body-inherit ui-icon-mail-forward ui-btn-icon-right" data-relative-url={{id}} >{{value}}</li>
+        {{/each}}
+        {{#each type}}
+         <li class="ui-li-static ui-body-inherit ui-bar-inherit ui-icon-plus ui-btn-icon-right" data-create-object="{{this}}" name="{{this}}">Create New {{this}}: {{../value}}</li>
+        {{/each}}
+      {{else}}
+        <li class="ui-autocomplete ui-li ui-li-divider ui-bar-inherit ui-first-child" role="heading">No result</li>
+        {{#each type}}
+         <li class="ui-li-static ui-body-inherit ui-bar-inherit ui-icon-plus ui-btn-icon-right" data-create-object="{{this}}" name="{{this}}">Create New {{this}}: {{../value}}</li>
+        {{/each}}
+      {{/if}}
+      <li class="ui-li-static ui-body-inherit ui-last-child ui-bar-inherit ui-icon-search ui-btn-icon-right" data-explore=true >Explore the Search Result List</li>
+    </script>
+
   </head>
+
   <body>
-    <div class="ui-input-text ui-body-inherit ui-corner-all ui-shadow-inset ui-input-has-clear ui-input-has-icon">
-      <input type='text' autocomplete="off" data-enhanced="true" />
-      <a href="#" tabindex="-1" class="ui-hidden-accessible">&nbsp;</a>
-    </div>
-    <a href="#" tabindex="-1" class="ui-btn ui-corner-all ui-btn-icon-notext ui-icon-plane ui-shadow-inset ui-btn-inline ui-disabled">Jump to this document</a>
   </body>
 </html>
\ No newline at end of file

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_router_html.html

@@ -13,6 +13,7 @@
 
   </head>
   <body>
+    <div data-gadget-url="gadget_jio.html" data-gadget-scope="jio_form_content"></div>
     <div data-gadget-url="gadget_jio.html" data-gadget-scope="jio_selection"></div>
     <div data-gadget-url="gadget_jio.html" data-gadget-scope="jio_navigation_history"></div>
     <div data-gadget-url="gadget_jio.html" data-gadget-scope="jio_document_state"></div>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_router_js.js

-/*global window, rJS, RSVP, loopEventListener, document, jIO, URI, URL */
+/*global window, rJS, RSVP, loopEventListener, document, jIO, URI, URL, Blob */
 /*jslint nomen: true, indent: 2 */
-(function (window, rJS, RSVP, loopEventListener, document, jIO, URI, URL) {
+(function (window, rJS, RSVP, loopEventListener, document, jIO, URI, URL, Blob) {
   "use strict";
 
   // Keep reference of the latest allDocs params which reach to this view
@@ -330,7 +330,15 @@
         return addHistory(gadget, previous_options);
       })
       .push(function (id) {
+        var tmp;
         next_options.history = id;
+        if (gadget.props.form_content) {
+          tmp = gadget.props.form_content;
+          delete gadget.props.form_content;
+          return gadget.props.jio_form_content.putAttachment('/', id, new Blob([JSON.stringify(tmp)], {type: "application/json"}));
+        }
+      })
+      .push(function () {
         return addNavigationHistoryAndDisplay(gadget, jio_key, next_options);
       });
   }
@@ -454,17 +462,49 @@
       });
   }
 
-  function execHistoryPreviousCommand(gadget, previous_options) {
+  function execHistoryPreviousCommand(gadget, previous_options, load_options) {
     var history = previous_options.history,
       jio_key = previous_options.jio_key,
+      target_index = previous_options.target_index,
+      field = previous_options.back_field,
+      queue =  new RSVP.Queue(),
       previous_id;
     if (history === undefined) {
       if (jio_key !== undefined) {
         return redirectToParent(gadget, jio_key);
       }
     }
+    if (previous_options.back_field) {
+      queue
+        .push(function () {
+          return gadget.props.jio_form_content.getAttachment('/', history);
+        })
+        .push(function (results) {
+          return jIO.util.readBlobAsText(results);
+        }, function (error) {
+          if ((error instanceof jIO.util.jIOError) &&
+              (error.status_code === 404)) {
+            return;
+          }
+          throw error;
+        })
+        .push(function (results) {
+          if (results) {
+            results = JSON.parse(results.target.result);
+            if (load_options.uid) {
+              results[field].value[target_index] =  "";
+              results[field].relation_item_relative_url[target_index] = load_options.jio_key;
+              results[field].uid = load_options.uid;
+            }
+            gadget.props.form_content = results;
+          }
+        });
+    }
 
-    return gadget.props.jio_gadget.get(history)
+    queue
+      .push(function () {
+        return gadget.props.jio_gadget.get(history);
+      })
       .push(function (history) {
         previous_id = history.previous_history_id;
         return gadget.props.jio_gadget.get(history.options_id);
@@ -486,6 +526,7 @@
         delete options.jio_key;
         return addNavigationHistoryAndDisplay(gadget, next_jio_key, options);
       });
+    return queue;
   }
 
 
@@ -567,6 +608,10 @@
     // Store current options to handle navigation
     gadget.props.options = JSON.parse(JSON.stringify(command_options.args));
 
+    if (gadget.props.form_content) {
+      command_options.args.form_content = gadget.props.form_content;
+      delete gadget.props.form_content;
+    }
     return {
       url: "gadget_erp5_page_" + command_options.args.page + ".html",
       // XXX Drop this options thing.
@@ -631,7 +676,7 @@
       return execSelectionPreviousCommand(gadget, previous_options);
     }
     if (command_options.path === COMMAND_HISTORY_PREVIOUS) {
-      return execHistoryPreviousCommand(gadget, previous_options);
+      return execHistoryPreviousCommand(gadget, previous_options, next_options);
     }
     if (command_options.path === COMMAND_PUSH_HISTORY) {
       return execPushHistoryCommand(gadget, previous_options, next_options);
@@ -746,6 +791,16 @@
           });
         });
     })
+    .ready(function (g) {
+      return g.getDeclaredGadget("jio_form_content")
+        .push(function (jio_form_content) {
+          g.props.jio_form_content = jio_form_content;
+          return jio_form_content.createJio({
+            type: "local",
+            sessiononly: true
+          });
+        });
+    })
 
     .declareMethod('getCommandUrlFor', function (options) {
       var command = options.command,
@@ -776,6 +831,8 @@
     })
 
     .declareMethod('redirect', function (options) {
+      this.props.form_content = options.form_content;
+      delete options.form_content;
       return this.getCommandUrlFor(options)
         .push(function (hash) {
           window.location.replace(hash);
@@ -824,4 +881,4 @@
         });
     });
 
-}(window, rJS, RSVP, loopEventListener, document, jIO, URI, URL));
+}(window, rJS, RSVP, loopEventListener, document, jIO, URI, URL, Blob));

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_serviceworker.js

@@ -77,6 +77,8 @@
       'gadget_erp5_page_logout.js',
       'gadget_erp5_page_preference.html',
       'gadget_erp5_page_preference.js',
+      'gadget_erp5_page_relation_search.html',
+      'gadget_erp5_page_relation_search.js',
       'gadget_erp5_page_search.html',
       'gadget_erp5_page_search.js',
       'gadget_erp5_page_tab.html',

bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_zuite/relationfield_zuite/testBreadcrumbCanNotAccessRelationSearchPage.xml

+<?xml version="1.0"?>
+<ZopeData>
+  <record id="1" aka="AAAAAAAAAAE=">
+    <pickle>
+      <global name="ZopePageTemplate" module="Products.PageTemplates.ZopePageTemplate"/>
+    </pickle>
+    <pickle>
+      <dictionary>
+        <item>
+            <key> <string>_bind_names</string> </key>
+            <value>
+              <object>
+                <klass>
+                  <global name="NameAssignments" module="Shared.DC.Scripts.Bindings"/>
+                </klass>
+                <tuple/>
+                <state>
+                  <dictionary>
+                    <item>
+                        <key> <string>_asgns</string> </key>
+                        <value>
+                          <dictionary>
+                            <item>
+                                <key> <string>name_subpath</string> </key>
+                                <value> <string>traverse_subpath</string> </value>
+                            </item>
+                          </dictionary>
+                        </value>
+                    </item>
+                  </dictionary>
+                </state>
+              </object>
+            </value>
+        </item>
+        <item>
+            <key> <string>content_type</string> </key>
+            <value> <string>text/html</string> </value>
+        </item>
+        <item>
+            <key> <string>expand</string> </key>
+            <value> <int>0</int> </value>
+        </item>
+        <item>
+            <key> <string>id</string> </key>
+            <value> <string>testBreadcrumbCanNotAccessRelationSearchPage</string> </value>
+        </item>
+        <item>
+            <key> <string>output_encoding</string> </key>
+            <value> <string>utf-8</string> </value>
+        </item>
+        <item>
+            <key> <string>title</string> </key>
+            <value> <unicode></unicode> </value>
+        </item>
+      </dictionary>
+    </pickle>
+  </record>
+</ZopeData>

bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_zuite/relationfield_zuite/testBreadcrumbCanNotAccessRelationSearchPage.zpt

+<html xmlns:tal="http://xml.zope.org/namespaces/tal"
+      xmlns:metal="http://xml.zope.org/namespaces/metal">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+<title>Test RenderJS UI</title>
+</head>
+<body>
+<table cellpadding="1" cellspacing="1" border="1">
+<thead>
+<tr><td rowspan="1" colspan="3">Test RenderJS UI</td></tr>
+</thead><tbody>
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/init" />
+
+<!-- Clean Up -->
+<tr>
+  <td>open</td>
+  <td>${base_url}/foo_module/ListBoxZuite_reset</td>
+  <td></td>
+</tr>
+<tr>
+  <td>assertTextPresent</td>
+  <td>Reset Successfully.</td>
+  <td></td>
+</tr>
+<tr>
+  <td>open</td>
+  <td>${base_url}/web_site_module/renderjs_runner/#/foo_module</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n='Add']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>link=Add</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//button[@data-i18n='Proceed']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>select</td>
+  <td>//select[@name='field_your_portal_type']</td>
+  <td>label=Foo</td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>//button[@data-i18n='Proceed']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForTextPresent</td>
+  <td>Save</td>
+  <td></td>
+</tr>
+<tr>
+  <td>assertTextPresent</td>
+  <td>Quantity</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>click</td>
+  <td>link=Add</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//button[@data-i18n='Proceed']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>select</td>
+  <td>//select[@name='field_your_portal_type']</td>
+  <td>label=Foo Line</td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//button[@data-i18n='Proceed']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForTextPresent</td>
+  <td>Save</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>storeLocation</td>
+  <td>url</td>
+  <td></td>
+</tr>
+
+
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/wait_for_activities" />
+
+<tr>
+  <td>open</td>
+  <td>${url}</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//h1[@class="ui-title"]/a</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>click</td>
+  <td>//h1[@class="ui-title"]/a</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForTextPresent</td>
+  <td>Foo Category</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>type</td>
+  <td>//input[@name="field_my_foo_category_title"]</td>
+  <td>search</td>
+</tr>
+
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name="field_my_foo_category_title"]</td>
+  <td>input</td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//li[@data-explore="true"]</td>
+  <td></td>
+</tr>
+
+
+
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name="field_my_foo_category_title"]</td>
+  <td>blur</td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//li[@data-explore="true"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//input[@name="search"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>type</td>
+  <td>//input[@name="search"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>click</td>
+  <td>//input[@class="search_button"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>waitForElementNotPresent</td>
+  <td>//a[@data-i18n="Previous"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n="Previous"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>click</td>
+  <td>//h1[@class="ui-title"]//a</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//input[@name="field_my_title"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//tbody//tr[1]</td>
+  <td></td>
+</tr>
+
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/wait_for_activities" />
+
+<tr>
+  <td>open</td>
+  <td>${url}</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n="Views"]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//a[@data-i18n="Views"]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n="2"]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//a[@data-i18n="2"]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n="Actions"]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>verifyElementPresent</td>
+  <td>//a[@data-i18n="Actions"]</td>
+  <td></td>
+</tr>
+
+
+
+</tbody></table>
+</body>
+</html>
\ No newline at end of file

bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_zuite/relationfield_zuite/testRelationField.zpt

@@ -64,51 +64,7 @@
   <td>Quantity</td>
   <td></td>
 </tr>
-<tr>
-  <td>click</td>
-  <td>link=Foo: 2</td>
-  <td></td>
-</tr>
-<tr>
-  <td>waitForTextPresent</td>
-  <td>Foos</td>
-  <td></td>
-</tr>
-<tr>
-  <td>waitForElementPresent</td>
-  <td>//button[@data-i18n='Menu']</td>
-  <td></td>
-</tr>
-<tr>
-  <td>click</td>
-  <td>link=Add</td>
-  <td></td>
-</tr>
-<tr>
-  <td>waitForElementPresent</td>
-  <td>//button[@data-i18n='Proceed']</td>
-  <td></td>
-</tr>
-<tr>
-  <td>select</td>
-  <td>//select[@name='field_your_portal_type']</td>
-  <td>label=Foo</td>
-</tr>
-<tr>
-  <td>click</td>
-  <td>//button[@data-i18n='Proceed']</td>
-  <td></td>
-</tr>
-<tr>
-  <td>waitForTextPresent</td>
-  <td>Save</td>
-  <td></td>
-</tr>
-<tr>
-  <td>assertTextPresent</td>
-  <td>Quantity</td>
-  <td></td>
-</tr>
+
 
 <tr>
   <td>waitForElementPresent</td>

bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_zuite/relationfield_zuite/testRelationFieldCreate.zpt

@@ -106,18 +106,29 @@
   <td>input</td>
 </tr>
 
+
+
+
 <tr>
   <td>waitForElementPresent</td>
-  <td>//input[@name='subfield_field_my_successor_title_relation']</td>
+  <td>//li[@name='Foo']</td>
   <td></td>
 </tr>
 
 <tr>
-  <td>waitForElementPresent</td>
-  <td>//input[@name='field_my_foo_category_title']</td>
+  <td>fireEvent</td>
+  <td>//input[@name='field_my_successor_title']</td>
+  <td>blur</td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//li[@name='Foo']</td>
   <td></td>
 </tr>
 
+
+
 <tr>
   <td>type</td>
   <td>//input[@name='field_my_foo_category_title']</td>
@@ -136,6 +147,12 @@
   <td></td>
 </tr>
 
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name='field_my_foo_category_title']</td>
+  <td>blur</td>
+</tr>
+
 <tr>
   <td>click</td>
   <td>//li[@data-relative-url='portal_categories/foo_category/a/a1']</td>
@@ -168,13 +185,7 @@
   <td>//input[@name='field_my_successor_title']</td>
   <td></td>
 </tr>
-<!--
-<tr>
-  <td>waitForElementPresent</td>
-  <td>//div[@data-gadget-scope='field_my_successor_title']/a[@class='ui-btn ui-corner-all ui-btn-icon-notext ui-icon-plane ui-shadow-inset ui-btn-inline']</td>
-  <td></td>
-</tr>
--->
+
 
 <tr>
   <td>verifyValue</td>
@@ -188,25 +199,6 @@
   <td>a1</td>
 </tr>
 
-<!--
-<tr>
-  <td>click</td>
-  <td>//div[@data-gadget-scope='field_my_successor_title']/a</td>
-  <td></td>
-</tr>
-
-<tr>
-  <td>waitForElementPresent</td>
-  <td>//a[@data-i18n='Jump']</td>
-  <td></td>
-</tr>
-
-<tr>
-  <td>verifyValue</td>
-  <td>//input[@name='field_my_title']</td>
-  <td>A new foo</td>
-</tr>
--->
 </tbody></table>
 </body>
 </html>
\ No newline at end of file

bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_zuite/relationfield_zuite/testRelationFieldNotAllowCreation.xml

+<?xml version="1.0"?>
+<ZopeData>
+  <record id="1" aka="AAAAAAAAAAE=">
+    <pickle>
+      <global name="ZopePageTemplate" module="Products.PageTemplates.ZopePageTemplate"/>
+    </pickle>
+    <pickle>
+      <dictionary>
+        <item>
+            <key> <string>_bind_names</string> </key>
+            <value>
+              <object>
+                <klass>
+                  <global name="NameAssignments" module="Shared.DC.Scripts.Bindings"/>
+                </klass>
+                <tuple/>
+                <state>
+                  <dictionary>
+                    <item>
+                        <key> <string>_asgns</string> </key>
+                        <value>
+                          <dictionary>
+                            <item>
+                                <key> <string>name_subpath</string> </key>
+                                <value> <string>traverse_subpath</string> </value>
+                            </item>
+                          </dictionary>
+                        </value>
+                    </item>
+                  </dictionary>
+                </state>
+              </object>
+            </value>
+        </item>
+        <item>
+            <key> <string>content_type</string> </key>
+            <value> <string>text/html</string> </value>
+        </item>
+        <item>
+            <key> <string>expand</string> </key>
+            <value> <int>0</int> </value>
+        </item>
+        <item>
+            <key> <string>id</string> </key>
+            <value> <string>testRelationFieldNotAllowCreation</string> </value>
+        </item>
+        <item>
+            <key> <string>output_encoding</string> </key>
+            <value> <string>utf-8</string> </value>
+        </item>
+        <item>
+            <key> <string>title</string> </key>
+            <value> <unicode></unicode> </value>
+        </item>
+      </dictionary>
+    </pickle>
+  </record>
+</ZopeData>

bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_zuite/relationfield_zuite/testRelationFieldNotAllowCreation.zpt

+<html xmlns:tal="http://xml.zope.org/namespaces/tal"
+      xmlns:metal="http://xml.zope.org/namespaces/metal">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+<title>Test RenderJS UI</title>
+</head>
+<body>
+<table cellpadding="1" cellspacing="1" border="1">
+<thead>
+<tr><td rowspan="1" colspan="3">Test RenderJS UI</td></tr>
+</thead><tbody>
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/init" />
+
+<!-- Clean Up -->
+<tr>
+  <td>open</td>
+  <td>${base_url}/foo_module/ListBoxZuite_reset</td>
+  <td></td>
+</tr>
+<tr>
+  <td>assertTextPresent</td>
+  <td>Reset Successfully.</td>
+  <td></td>
+</tr>
+
+<!-- Initialize -->
+<tr>
+  <td>open</td>
+  <td>${base_url}/web_site_module/renderjs_runner/#/foo_module</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n='Add']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>link=Add</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//button[@data-i18n='Proceed']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>select</td>
+  <td>//select[@name='field_your_portal_type']</td>
+  <td>label=Foo</td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>//button[@data-i18n='Proceed']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForTextPresent</td>
+  <td>Save</td>
+  <td></td>
+</tr>
+<tr>
+  <td>assertTextPresent</td>
+  <td>Quantity</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n='Views']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>//a[@data-i18n='Views']</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n='Relation Fields']</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//a[@data-i18n='Relation Fields']</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//input[@name='field_my_foo_category_title']</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>type</td>
+  <td>//input[@name='field_my_foo_category_title']</td>
+  <td>notallowcreation</td>
+</tr>
+
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name='field_my_foo_category_title']</td>
+  <td>input</td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//li[@data-explore='true']</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForElementNotPresent</td>
+  <td>//li[@name='Category']</td>
+  <td></td>
+</tr>
+
+
+</tbody></table>
+</body>
+</html>
\ No newline at end of file

bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_zuite/relationfield_zuite/testRelationFieldSearchWithListbox.xml

+<?xml version="1.0"?>
+<ZopeData>
+  <record id="1" aka="AAAAAAAAAAE=">
+    <pickle>
+      <global name="ZopePageTemplate" module="Products.PageTemplates.ZopePageTemplate"/>
+    </pickle>
+    <pickle>
+      <dictionary>
+        <item>
+            <key> <string>_bind_names</string> </key>
+            <value>
+              <object>
+                <klass>
+                  <global name="NameAssignments" module="Shared.DC.Scripts.Bindings"/>
+                </klass>
+                <tuple/>
+                <state>
+                  <dictionary>
+                    <item>
+                        <key> <string>_asgns</string> </key>
+                        <value>
+                          <dictionary>
+                            <item>
+                                <key> <string>name_subpath</string> </key>
+                                <value> <string>traverse_subpath</string> </value>
+                            </item>
+                          </dictionary>
+                        </value>
+                    </item>
+                  </dictionary>
+                </state>
+              </object>
+            </value>
+        </item>
+        <item>
+            <key> <string>content_type</string> </key>
+            <value> <string>text/html</string> </value>
+        </item>
+        <item>
+            <key> <string>expand</string> </key>
+            <value> <int>0</int> </value>
+        </item>
+        <item>
+            <key> <string>id</string> </key>
+            <value> <string>testRelationFieldSearchWithListbox</string> </value>
+        </item>
+        <item>
+            <key> <string>output_encoding</string> </key>
+            <value> <string>utf-8</string> </value>
+        </item>
+        <item>
+            <key> <string>title</string> </key>
+            <value> <unicode></unicode> </value>
+        </item>
+      </dictionary>
+    </pickle>
+  </record>
+</ZopeData>

bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_zuite/relationfield_zuite/testRelationFieldSearchWithListbox.zpt

+<html xmlns:tal="http://xml.zope.org/namespaces/tal"
+      xmlns:metal="http://xml.zope.org/namespaces/metal">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+<title>Test RenderJS UI</title>
+</head>
+<body>
+<table cellpadding="1" cellspacing="1" border="1">
+<thead>
+<tr><td rowspan="1" colspan="3">Test RenderJS UI</td></tr>
+</thead><tbody>
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/init" />
+
+<!-- Clean Up -->
+<tr>
+  <td>open</td>
+  <td>${base_url}/foo_module/ListBoxZuite_reset</td>
+  <td></td>
+</tr>
+<tr>
+  <td>assertTextPresent</td>
+  <td>Reset Successfully.</td>
+  <td></td>
+</tr>
+
+<!-- Initialize -->
+<tr>
+  <td>open</td>
+  <td>${base_url}/web_site_module/renderjs_runner/#/foo_module</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n='Add']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>link=Add</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//button[@data-i18n='Proceed']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>select</td>
+  <td>//select[@name='field_your_portal_type']</td>
+  <td>label=Foo</td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//button[@data-i18n='Proceed']</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n="Views"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>click</td>
+  <td>//a[@data-i18n="Views"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>storeLocation</td>
+  <td>url</td>
+  <td></td>
+</tr>
+
+
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/wait_for_activities" />
+
+<tr>
+  <td>open</td>
+  <td>${url}</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n="Relation Fields"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>click</td>
+  <td>//a[@data-i18n="Relation Fields"]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//input[@name="field_my_successor_title"]</td>
+  <td></td>
+</tr>
+
+
+
+<tr>
+  <td>type</td>
+  <td>//input[@name='field_my_foo_category_title']</td>
+  <td>a1</td>
+</tr>
+
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name='field_my_foo_category_title']</td>
+  <td>input</td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//li[@data-relative-url='portal_categories/foo_category/a/a1']</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name='field_my_foo_category_title']</td>
+  <td>blur</td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//li[@data-relative-url='portal_categories/foo_category/a/a1']</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>type</td>
+  <td>//input[@name="field_my_title"]</td>
+  <td>TEST</td>
+</tr>
+
+
+<tr>
+  <td>type</td>
+  <td>//input[@name="field_my_successor_title"]</td>
+  <td>search</td>
+</tr>
+
+
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name="field_my_successor_title"]</td>
+  <td>input</td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//li[@data-explore="true"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name="field_my_successor_title"]</td>
+  <td>blur</td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//li[@data-explore="true"]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//input[@name="search"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>type</td>
+  <td>//input[@name="search"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>click</td>
+  <td>//input[@class="search_button"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>waitForElementNotPresent</td>
+  <td>//a[@data-i18n="Previous"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n="Previous"]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//tbody/tr[1]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//tbody/tr[1]//a</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//input[@name="field_my_successor_title"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>verifyValue</td>
+  <td>//input[@name="field_my_successor_title"]</td>
+  <td>2</td>
+</tr>
+
+<tr>
+  <td>verifyValue</td>
+  <td>//input[@name="field_my_title"]</td>
+  <td>TEST</td>
+</tr>
+
+<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/save" />
+
+
+
+</tbody></table>
+</body>
+</html>
\ No newline at end of file

bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_zuite/relationfield_zuite/testRelationFieldUnknownIcon.xml

+<?xml version="1.0"?>
+<ZopeData>
+  <record id="1" aka="AAAAAAAAAAE=">
+    <pickle>
+      <global name="ZopePageTemplate" module="Products.PageTemplates.ZopePageTemplate"/>
+    </pickle>
+    <pickle>
+      <dictionary>
+        <item>
+            <key> <string>_bind_names</string> </key>
+            <value>
+              <object>
+                <klass>
+                  <global name="NameAssignments" module="Shared.DC.Scripts.Bindings"/>
+                </klass>
+                <tuple/>
+                <state>
+                  <dictionary>
+                    <item>
+                        <key> <string>_asgns</string> </key>
+                        <value>
+                          <dictionary>
+                            <item>
+                                <key> <string>name_subpath</string> </key>
+                                <value> <string>traverse_subpath</string> </value>
+                            </item>
+                          </dictionary>
+                        </value>
+                    </item>
+                  </dictionary>
+                </state>
+              </object>
+            </value>
+        </item>
+        <item>
+            <key> <string>content_type</string> </key>
+            <value> <string>text/html</string> </value>
+        </item>
+        <item>
+            <key> <string>expand</string> </key>
+            <value> <int>0</int> </value>
+        </item>
+        <item>
+            <key> <string>id</string> </key>
+            <value> <string>testRelationFieldUnknownIcon</string> </value>
+        </item>
+        <item>
+            <key> <string>output_encoding</string> </key>
+            <value> <string>utf-8</string> </value>
+        </item>
+        <item>
+            <key> <string>title</string> </key>
+            <value> <unicode></unicode> </value>
+        </item>
+      </dictionary>
+    </pickle>
+  </record>
+</ZopeData>

bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_zuite/relationfield_zuite/testRelationFieldUnknownIcon.zpt

+<html xmlns:tal="http://xml.zope.org/namespaces/tal"
+      xmlns:metal="http://xml.zope.org/namespaces/metal">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+<title>Test RenderJS UI</title>
+</head>
+<body>
+<table cellpadding="1" cellspacing="1" border="1">
+<thead>
+<tr><td rowspan="1" colspan="3">Test RenderJS UI</td></tr>
+</thead><tbody>
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/init" />
+
+<!-- Clean Up -->
+<tr>
+  <td>open</td>
+  <td>${base_url}/foo_module/ListBoxZuite_reset</td>
+  <td></td>
+</tr>
+<tr>
+  <td>assertTextPresent</td>
+  <td>Reset Successfully.</td>
+  <td></td>
+</tr>
+
+<!-- Initialize -->
+<tr>
+  <td>open</td>
+  <td>${base_url}/web_site_module/renderjs_runner/#/foo_module</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n='Add']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>link=Add</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//button[@data-i18n='Proceed']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>select</td>
+  <td>//select[@name='field_your_portal_type']</td>
+  <td>label=Foo</td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>//button[@data-i18n='Proceed']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForTextPresent</td>
+  <td>Save</td>
+  <td></td>
+</tr>
+<tr>
+  <td>assertTextPresent</td>
+  <td>Quantity</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n='Views']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>//a[@data-i18n='Views']</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n='Relation Fields']</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//a[@data-i18n='Relation Fields']</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//input[@name='field_my_foo_category_title']</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>type</td>
+  <td>//input[@name='field_my_foo_category_title']</td>
+  <td>unknowntext</td>
+</tr>
+
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name='field_my_foo_category_title']</td>
+  <td>input</td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//li[@data-explore='true']</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name='field_my_foo_category_title']</td>
+  <td>blur</td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//div[@data-gadget-scope="field_my_foo_category_title"]//a[contains(@class, "ui-icon-warning")]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>verifyElementPresent</td>
+  <td>//div[@data-gadget-scope="field_my_foo_category_title"]//a[contains(@class, "ui-icon-warning")]</td>
+  <td></td>
+</tr>
+
+
+
+<tr>
+  <td>type</td>
+  <td>//input[@name='field_my_successor_title']</td>
+  <td>search</td>
+</tr>
+
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name='field_my_successor_title']</td>
+  <td>input</td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//li[@data-explore='true']</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name='field_my_successor_title']</td>
+  <td>blur</td>
+</tr>
+
+
+<tr>
+  <td>click</td>
+  <td>//li[@data-explore='true']</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//input[@name='search']</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//h1[@class="ui-title"]//a</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//div[@data-gadget-scope="field_my_foo_category_title"]//a[contains(@class, "ui-icon-warning")]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>verifyElementPresent</td>
+  <td>//div[@data-gadget-scope="field_my_foo_category_title"]//a[contains(@class, "ui-icon-warning")]</td>
+  <td></td>
+</tr>
+</tbody></table>
+</body>
+</html>
\ No newline at end of file

bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_zuite/relationfield_zuite/testRelationFieldWithNonSavedPageContent.xml

+<?xml version="1.0"?>
+<ZopeData>
+  <record id="1" aka="AAAAAAAAAAE=">
+    <pickle>
+      <global name="ZopePageTemplate" module="Products.PageTemplates.ZopePageTemplate"/>
+    </pickle>
+    <pickle>
+      <dictionary>
+        <item>
+            <key> <string>_bind_names</string> </key>
+            <value>
+              <object>
+                <klass>
+                  <global name="NameAssignments" module="Shared.DC.Scripts.Bindings"/>
+                </klass>
+                <tuple/>
+                <state>
+                  <dictionary>
+                    <item>
+                        <key> <string>_asgns</string> </key>
+                        <value>
+                          <dictionary>
+                            <item>
+                                <key> <string>name_subpath</string> </key>
+                                <value> <string>traverse_subpath</string> </value>
+                            </item>
+                          </dictionary>
+                        </value>
+                    </item>
+                  </dictionary>
+                </state>
+              </object>
+            </value>
+        </item>
+        <item>
+            <key> <string>content_type</string> </key>
+            <value> <string>text/html</string> </value>
+        </item>
+        <item>
+            <key> <string>expand</string> </key>
+            <value> <int>0</int> </value>
+        </item>
+        <item>
+            <key> <string>id</string> </key>
+            <value> <string>testRelationFieldWithNonSavedPageContent</string> </value>
+        </item>
+        <item>
+            <key> <string>output_encoding</string> </key>
+            <value> <string>utf-8</string> </value>
+        </item>
+        <item>
+            <key> <string>title</string> </key>
+            <value> <unicode></unicode> </value>
+        </item>
+      </dictionary>
+    </pickle>
+  </record>
+</ZopeData>

bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_zuite/relationfield_zuite/testRelationFieldWithNonSavedPageContent.zpt

+<html xmlns:tal="http://xml.zope.org/namespaces/tal"
+      xmlns:metal="http://xml.zope.org/namespaces/metal">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+<title>Test RenderJS UI</title>
+</head>
+<body>
+<table cellpadding="1" cellspacing="1" border="1">
+<thead>
+<tr><td rowspan="1" colspan="3">Test RenderJS UI</td></tr>
+</thead><tbody>
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/init" />
+
+<!-- Clean Up -->
+<tr>
+  <td>open</td>
+  <td>${base_url}/foo_module/ListBoxZuite_reset</td>
+  <td></td>
+</tr>
+<tr>
+  <td>assertTextPresent</td>
+  <td>Reset Successfully.</td>
+  <td></td>
+</tr>
+
+<!-- Initialize -->
+<tr>
+  <td>open</td>
+  <td>${base_url}/web_site_module/renderjs_runner/#/foo_module</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n='Add']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>link=Add</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//button[@data-i18n='Proceed']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>select</td>
+  <td>//select[@name='field_your_portal_type']</td>
+  <td>label=Foo</td>
+</tr>
+<tr>
+  <td>click</td>
+  <td>//button[@data-i18n='Proceed']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForTextPresent</td>
+  <td>Save</td>
+  <td></td>
+</tr>
+<tr>
+  <td>assertTextPresent</td>
+  <td>Quantity</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>click</td>
+  <td>link=Add</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//button[@data-i18n='Proceed']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>select</td>
+  <td>//select[@name='field_your_portal_type']</td>
+  <td>label=Foo Line</td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//button[@data-i18n='Proceed']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForTextPresent</td>
+  <td>Save</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>click</td>
+  <td>//h1[@class="ui-title"]/a</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForTextPresent</td>
+  <td>Foo Category</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>link=Add</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//button[@data-i18n='Proceed']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>select</td>
+  <td>//select[@name='field_your_portal_type']</td>
+  <td>label=Foo Line</td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//button[@data-i18n='Proceed']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForTextPresent</td>
+  <td>Save</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>storeLocation</td>
+  <td>url</td>
+  <td></td>
+</tr>
+
+
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/wait_for_activities" />
+
+<tr>
+  <td>open</td>
+  <td>${url}</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//h1[@class="ui-title"]/a</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>click</td>
+  <td>//h1[@class="ui-title"]/a</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForTextPresent</td>
+  <td>Foo Category</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>type</td>
+  <td>//input[@name="field_my_short_title"]</td>
+  <td>TEST</td>
+</tr>
+
+<tr>
+  <td>type</td>
+  <td>//input[@name="field_my_foo_big_category_title"]</td>
+  <td>TEST1</td>
+</tr>
+
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name="field_my_foo_big_category_title"]</td>
+  <td>input</td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//li[@name='Category']</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name="field_my_foo_big_category_title"]</td>
+  <td>blur</td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//li[@name='Category']</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForTextPresent</td>
+  <td>Create:Category</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//input[@name="field_my_frozen"]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>assertChecked</td>
+  <td>//input[@name="field_my_frozen"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>select</td>
+  <td>//select[@name="field_my_local_title"]</td>
+  <td>index=1</td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//tbody//tr[1]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>type</td>
+  <td>//tbody//tr[1]//input[@title="listbox_start_date"]</td>
+  <td>2000-12-12</td>
+</tr>
+
+
+<tr>
+  <td>type</td>
+  <td>//tbody//tr[1]//input[@title="Quantity"]</td>
+  <td>2.3</td>
+</tr>
+
+<tr>
+  <td>type</td>
+  <td>//tbody//tr[1]//input[@title="Quantity"]</td>
+  <td>2.3</td>
+</tr>
+
+<tr>
+  <td>type</td>
+  <td>//tbody//tr[2]//input[@title="listbox_start_date"]</td>
+  <td>2012-12-12</td>
+</tr>
+
+
+<tr>
+  <td>type</td>
+  <td>//tbody//tr[2]//input[@title="Quantity"]</td>
+  <td>10.1</td>
+</tr>
+
+<tr>
+  <td>type</td>
+  <td>//input[@name="field_my_foo_category_title"]</td>
+  <td>search</td>
+</tr>
+
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name="field_my_foo_category_title"]</td>
+  <td>input</td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//li[@data-explore="true"]</td>
+  <td></td>
+</tr>
+
+
+
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name="field_my_foo_category_title"]</td>
+  <td>blur</td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//li[@data-explore="true"]</td>
+  <td></td>
+</tr>
+
+
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//input[@name="search"]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//h1[@class="ui-title"]//a</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//input[@name="field_my_short_title"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>verifyValue</td>
+  <td>//input[@name="field_my_short_title"]</td>
+  <td>TEST</td>
+</tr>
+
+<tr>
+  <td>verifyValue</td>
+  <td>//input[@name="field_my_foo_big_category_title"]</td>
+  <td>TEST1</td>
+</tr>
+<tr>
+  <td>verifyTextPresent</td>
+  <td>Create:Category</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>assertChecked</td>
+  <td>//input[@name="field_my_frozen"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>verifyValue</td>
+  <td>//select[@name="field_my_local_title"]</td>
+  <td>First title</td>
+</tr>
+
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//tbody//tr[1]//input[@title="listbox_start_date"]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>verifyValue</td>
+  <td>//tbody//tr[1]//input[@title="listbox_start_date"]</td>
+  <td>2000-12-12</td>
+</tr>
+
+
+<tr>
+  <td>verifyValue</td>
+  <td>//tbody//tr[1]//input[@title="Quantity"]</td>
+  <td>2.3</td>
+</tr>
+
+
+<tr>
+  <td>verifyValue</td>
+  <td>//tbody//tr[2]//input[@title="listbox_start_date"]</td>
+  <td>2012-12-12</td>
+</tr>
+
+
+<tr>
+  <td>verifyValue</td>
+  <td>//tbody//tr[2]//input[@title="Quantity"]</td>
+  <td>10.1</td>
+</tr>
+
+
+
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name="field_my_foo_category_title"]</td>
+  <td>input</td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//li[@data-explore="true"]</td>
+  <td></td>
+</tr>
+
+
+
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name="field_my_foo_category_title"]</td>
+  <td>blur</td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//li[@data-explore="true"]</td>
+  <td></td>
+</tr>
+
+
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//input[@name="search"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>click</td>
+  <td>//a[@data-i18n="Modules"]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n="Foos"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>click</td>
+  <td>//a[@data-i18n="Foos"]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//tbody/tr[1]/th/a</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>click</td>
+  <td>//tbody/tr[1]/th/a</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//a[@data-i18n="Editable"]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>click</td>
+  <td>//a[@data-i18n="Editable"]</td>
+  <td></td>
+</tr>
+
+
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//input[@name="field_my_short_title"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>verifyNotValue</td>
+  <td>//input[@name="field_my_short_title"]</td>
+  <td>TEST</td>
+</tr>
+
+<tr>
+  <td>verifyNotValue</td>
+  <td>//input[@name="field_my_foo_big_category_title"]</td>
+  <td>TEST1</td>
+</tr>
+<tr>
+  <td>verifyTextNotPresent</td>
+  <td>Create:Category</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>assertNotChecked</td>
+  <td>//input[@name="field_my_frozen"]</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>verifyNotValue</td>
+  <td>//select[@name="field_my_local_title"]</td>
+  <td>First title</td>
+</tr>
+
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//tbody//tr[1]//input[@title="listbox_start_date"]</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>verifyNotValue</td>
+  <td>//tbody//tr[1]//input[@title="listbox_start_date"]</td>
+  <td>2000-12-12</td>
+</tr>
+
+
+<tr>
+  <td>verifyNotValue</td>
+  <td>//tbody//tr[1]//input[@title="Quantity"]</td>
+  <td>2.3</td>
+</tr>
+
+
+<tr>
+  <td>verifyNotValue</td>
+  <td>//tbody//tr[2]//input[@title="listbox_start_date"]</td>
+  <td>2012-12-12</td>
+</tr>
+
+
+<tr>
+  <td>verifyNotValue</td>
+  <td>//tbody//tr[2]//input[@title="Quantity"]</td>
+  <td>10.1</td>
+</tr>
+
+
+
+
+
+</tbody></table>
+</body>
+</html>
\ No newline at end of file

bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_zuite/relationfield_zuite/testSimpleRelationFieldWithAccent.zpt

@@ -108,13 +108,20 @@
 
 <tr>
   <td>waitForElementPresent</td>
-  <td>//input[@name='subfield_field_my_successor_title_relation']</td>
+  <td>//li[@name='Foo']</td>
   <td></td>
 </tr>
 
 <tr>
-  <td>waitForElementPresent</td>
-  <td>//input[@name='field_my_foo_category_title']</td>
+  <td>fireEvent</td>
+  <td>//input[@name='field_my_successor_title']</td>
+  <td>blur</td>
+</tr>
+
+
+<tr>
+  <td>click</td>
+  <td>//li[@name='Foo']</td>
   <td></td>
 </tr>
 
@@ -136,6 +143,12 @@
   <td></td>
 </tr>
 
+<tr>
+  <td>fireEvent</td>
+  <td>//input[@name='field_my_foo_category_title']</td>
+  <td>blur</td>
+</tr>
+
 <tr>
   <td>click</td>
   <td>//li[@data-relative-url='portal_categories/foo_category/a/a1']</td>