erp5_web_renderjs_ui: listbox can be sorted

bt5/erp5_hal_json_style/SkinTemplateItem/portal_skins/erp5_hal_json_style/ERP5Document_getHateoas.xml

@@ -317,8 +317,25 @@ def renderField(traversed_document, field, form_relative_url, value=None, meta_t
   elif meta_type == "ListBox":\n
     # XXX Not implemented\n
     column_list = field.get_value("columns")\n
-    search_column_list = field.get_value(\'search_columns\')\n
     editable_column_list = field.get_value(\'editable_columns\')\n
+\n
+    sort_column_list_tmp = field.get_value(\'sort_columns\')\n
+    search_column_list = field.get_value(\'search_columns\')\n
+    sort_column_list = []\n
+\n
+    #only get sortable column which is already displayed in listbox\n
+    #in legacy erp5 interface, all sortable columns are displayed\n
+    #see https://git.erp5.org/gitweb/erp5.git/blob/HEAD:/product/ERP5Form/ListBox.py?js=1#l1004\n
+    if sort_column_list_tmp:\n
+      sort_column_list = sort_column_list_tmp\n
+    elif search_column_list:\n
+      sort_column_list = search_column_list\n
+    else:\n
+      #find which column can be sorted\n
+      for grain in column_list:\n
+        if sql_catalog.isValidColumn(grain[0]):\n
+          sort_column_list.append(grain)\n
+\n
 \n
     # XXX \n
 #     list_method = getattr(traversed_document, traversed_document.Listbox_getListMethodName(field))\n
@@ -384,6 +401,7 @@ def renderField(traversed_document, field, form_relative_url, value=None, meta_t
       # "column_list": [x[1] for x in columns],\n
       "column_list": column_list,\n
       "search_column_list": search_column_list,\n
+      "sort_column_list": sort_column_list,\n
       "editable_column_list": editable_column_list,\n
       "show_anchor": field.get_value("anchor"),\n
 #       "line_list": line_list,\n

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_appcache.xml

@@ -190,6 +190,8 @@ gadget_erp5_router.html\n
 gadget_erp5_router.js\n
 gadget_erp5_searchfield.html\n
 gadget_erp5_searchfield.js\n
+gadget_erp5_sort_editor.html\n
+gadget_erp5_sort_editor.js\n
 gadget_global.js\n
 gadget_jio.html\n
 gadget_jio.js\n
@@ -336,7 +338,7 @@ NETWORK:\n
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>947.5050.51365.30634</string> </value>
+                <value> <string>947.5083.16356.43929</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -354,7 +356,7 @@ NETWORK:\n
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1447420514.96</float>
+                        <float>1447420626.52</float>
                         <string>UTC</string>
                       </tuple>
                     </state>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_css.xml

@@ -1578,12 +1578,16 @@ html body div.ui-select div span {\n
    ------------------------------- Panel -----------------------------------\n
    -------------------------------------------------------------------------\n
 */\n
-/* reset margin for panel header/content \n
-html .ui-panel .ui-header, html .ui-panel .ui-content {\n
-    margin: -1em;\n
+/* panel header height and border (hardcode height for now) */\n
+html .ui-panel .ui-header {\n
+  border-bottom-width: 1px;\n
+  height: 39px;\n
+}\n
+html .ui-panel .ui-header .ui-btn,\n
+html .ui-panel .ui-header:hover .ui-btn {\n
   min-height: 39px;\n
 }\n
-*/\n
+\n
 /* we should not need to set this, JQM does it too */\n
 html .ui-panel .ui-panel-inner {\n
   padding: 0;\n
@@ -1601,13 +1605,19 @@ html .ui-panel .ui-content .bottom {\n
 html .ui-panel .ui-content .ui-field-contain {\n
   margin: 0;\n
 }\n
-\n
 /* fix font-size inside panel header/footer buttons */\n
 html body .ui-panel .ui-header .ui-controlgroup .ui-btn-icon-notext,\n
 html body .ui-panel .ui-footer .ui-controlgroup .ui-btn-icon-notext {\n
   font-size: 100%;\n
 }\n
-\n
+/* content sections inside panels */\n
+html .ui-panel .ui-panel-inner .ui-content-section {\n
+  border: 0 none;\n
+  border-radius: 0;\n
+  -moz-box-shadow: none;\n
+  -webkit-box-shadow: none;\n
+  box-shadow: none;\n
+}\n
 /* handle listviews inside panels */\n
 html body .ui-listview .ui-li-divider {\n
   font-weight: 700;\n
@@ -1637,6 +1647,56 @@ html .ui-panel .ui-listview .ui-li-has-icon a {\n
   overflow: hidden;\n
   padding: 0.2em 0;\n
 }\n
+/* form elements inside panel */\n
+html .ui-panel .ui-panel-inner .ui-corner-all {\n
+  -webkit-border-radius: 0.3125em;\n
+  border-radius: 0.3125em;\n
+}\n
+/* clean controlgroup borders (not nice, should be ui-content) */\n
+html .ui-panel .ui-content-section .ui-controlgroup-controls > div:first-of-type .ui-btn {\n
+  -webkit-border-bottom-left-radius: 0;\n
+  -webkit-border-bottom-right-radius: 0;\n
+  border-bottom-left-radius: 0;\n
+  border-bottom-right-radius: 0;\n
+}\n
+html .ui-panel .ui-content-section .ui-controlgroup-controls > div:last-of-type .ui-btn {\n
+  -webkit-border-top-left-radius: 0;\n
+  -webkit-border-top-right-radius: 0;\n
+  border-top-left-radius: 0;\n
+  border-top-right-radius: 0;\n
+  border-top-color: transparent;\n
+}\n
+/* XXX: not generic!!! */ \n
+/* side by side buttons (normally this should be done by postion:abs, but requires another wrapper */\n
+html .ui-panel .ui-content-section .ui-controlgroup-controls > div:last-of-type {\n
+  display: inline-block;\n
+  vertical-align: top;\n
+  width: 81.25%; /* BAD! use wrapper & position */\n
+  padding: 0;\n
+}\n
+html .ui-panel .ui-content-section .ui-controlgroup-controls > div:last-of-type ~ button {\n
+  vertical-align: top;\n
+  display: inline-block;\n
+  margin-left: -4px; /* to remove space between elements */\n
+  -webkit-border-bottom-right-radius: .3125em;\n
+  border-bottom-right-radius: .3125em;\n
+  border-left-color: transparent;\n
+  border-top-color: transparent;\n
+  padding-bottom: .75em;\n
+}\n
+html .ui-panel .ui-content-section .ui-controlgroup-controls > div:last-of-type .ui-btn {\n
+  -webkit-border-bottom-right-radius: 0;\n
+  border-bottom-right-radius: 0;\n
+}\n
+/* element padding */\n
+html .ui-panel .ui-content-section .ui-controlgroup-controls > div .ui-btn {\n
+  padding: 4px 0;\n
+}\n
+/* nasty padding */ \n
+html .ui-controlgroup-controls ~.ui-controlgroup-controls {\n
+  padding: .5em 0;\n
+}\n
+  \n
 \n
 /*\n
    -------------------------------------------------------------------------\n
@@ -5124,7 +5184,7 @@ html .ui-panel .ui-content .ui-btn[class*="ui-icon-"]:after {\n
             </item>
             <item>
                 <key> <string>actor</string> </key>
-                <value> <string>cedric.le.ninivin</string> </value>
+                <value> <string>zope</string> </value>
             </item>
             <item>
                 <key> <string>comment</string> </key>
@@ -5138,7 +5198,7 @@ html .ui-panel .ui-content .ui-btn[class*="ui-icon-"]:after {\n
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>945.32762.57047.24388</string> </value>
+                <value> <string>947.4015.5592.23057</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -5156,7 +5216,7 @@ html .ui-panel .ui-content .ui-btn[class*="ui-icon-"]:after {\n
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1441376614.38</float>
+                        <float>1447356677.5</float>
                         <string>UTC</string>
                       </tuple>
                     </state>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_listbox_html.xml

@@ -135,7 +135,9 @@
         <h1 data-i18n="0 items selected" class="ui-title ui-override-theme">0 items selected</h1>\n
         <div class="ui-controlgroup ui-controlgroup-horizontal ui-btn-right">\n
           <div class="ui-controlgroup-controls">\n
-            <a data-i18n="sort" class="ui-responsive ui-btn ui-btn-icon-left ui-icon-sort-amount-desc ui-last-child ui-override-theme ui-disabled" href="#">Sort</a>\n
+            <form class="sort_form">\n
+             <button data-rel="Sort" type="submit" class="submit responsive ui-last-child ui-btn ui-icon-sort-amount-desc ui-btn-icon-left">Sort</button>\n
+            </form>\n
           </div>\n
         </div>\n
       </div>\n
@@ -269,7 +271,7 @@
             </item>
             <item>
                 <key> <string>actor</string> </key>
-                <value> <string>super_sven</string> </value>
+                <value> <string>zope</string> </value>
             </item>
             <item>
                 <key> <string>comment</string> </key>
@@ -283,7 +285,7 @@
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>939.51034.42464.64273</string> </value>
+                <value> <string>946.65186.57926.52411</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -301,8 +303,8 @@
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1419418783.77</float>
-                        <string>GMT</string>
+                        <float>1447174021.56</float>
+                        <string>UTC</string>
                       </tuple>
                     </state>
                   </object>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_listbox_js.xml

@@ -108,9 +108,10 @@
             <value> <string encoding="cdata"><![CDATA[
 
 /*jslint indent: 2, maxerr: 3, nomen: true */\n
-/*global window, document, rJS, URI, RSVP, UriTemplate */\n
-(function (window, document, rJS, URI, RSVP, UriTemplate) {\n
+/*global window, document, rJS, URI, RSVP, loopEventListener*/\n
+(function (window, document, rJS, URI, RSVP, loopEventListener) {\n
   "use strict";\n
+\n
 \n
   rJS(window)\n
     /////////////////////////////////////////////////////////////////\n
@@ -140,6 +141,7 @@
     .declareAcquiredMethod("getUrlFor", "getUrlFor")\n
     .declareAcquiredMethod("getUrlParameter", "getUrlParameter")\n
     .declareAcquiredMethod("getFieldTypeGadgetUrl", "getFieldTypeGadgetUrl")\n
+    .declareAcquiredMethod("renderEditorPanel", "renderEditorPanel")\n
     //////////////////////////////////////////////\n
     // initialize the gadget content\n
     //////////////////////////////////////////////\n
@@ -151,32 +153,63 @@
         document_table = gadget.props.element.querySelector(\'.document_table\'),\n
         th,\n
         length_table = field_json.column_list.length,\n
-        i;\n
+        tmp,\n
+        i,\n
+        j;\n
 \n
       gadget.props.field_json = field_json;\n
       gadget.props.extended_search = options.extended_search;\n
+      gadget.props.sort_list = [];\n
       if (field_json.show_anchor) {\n
         th = document.createElement("th");\n
         th.textContent = "Jump";\n
         th.setAttribute("data-i18n", "Jump");\n
         tr.appendChild(th);\n
       }\n
-      for (i = 0; i < length_table; i += 1) {\n
-        th = document.createElement("th");\n
-        th.textContent = field_json.column_list[i][1];\n
-        th.setAttribute("data-i18n", field_json.column_list[i][1]);\n
-        tr.appendChild(th);\n
+\n
+      //only display which is in listbox\'s column list\n
+      if (field_json.sort_column_list.length) {\n
+        field_json.sort_column_list = field_json.sort_column_list.filter(function (n) {\n
+          for (i = 0; i < field_json.column_list.length; i += 1) {\n
+            if (field_json.column_list[i][0] === n[0] && field_json.column_list[i][1] === n[1]) {\n
+              return true;\n
+            }\n
+          }\n
+          return false;\n
+        });\n
       }\n
       thead.appendChild(tr);\n
       return new RSVP.Queue()\n
         .push(function () {\n
           // XXX Fix in case of multiple listboxes\n
-          return gadget.getUrlParameter(field_json.key + \'_begin_from\');\n
+          return RSVP.all([\n
+            gadget.getUrlParameter(field_json.key + \'_begin_from\'),\n
+            gadget.getUrlParameter(field_json.key + \'_sort_list:json\')\n
+          ]);\n
         })\n
-        .push(function (result) {\n
+        .push(function (all_result) {\n
+          var result = all_result[0];\n
+          gadget.props.sort_list = all_result[1] || [];\n
           if (result === undefined) {\n
             result = \'0\';\n
           }\n
+          for (i = 0; i < length_table; i += 1) {\n
+            th = document.createElement("th");\n
+            th.textContent = field_json.column_list[i][1];\n
+            for (j = 0; j < gadget.props.sort_list.length; j += 1) {\n
+              tmp = gadget.props.sort_list[j].split(",");\n
+              if (tmp[0] === gadget.props.field_json.column_list[i][0]) {\n
+                if (tmp[1] === "ascending") {\n
+                  th.setAttribute("class", "ui-icon-arrow-up");\n
+                } else {\n
+                  th.setAttribute("class", "ui-icon-arrow-down");\n
+                }\n
+                break;\n
+              }\n
+            }\n
+            th.setAttribute("data-i18n", field_json.column_list[i][1]);\n
+            tr.appendChild(th);\n
+          }\n
           gadget.props.begin_from = parseInt(result, 10) || 0;\n
           return gadget.translateHtml(document_table.innerHTML);\n
         })\n
@@ -230,7 +263,8 @@
         "list_method_template": field_json.list_method_template,\n
         "query": query_string,\n
         "limit": [begin_from, lines + 1],\n
-        "select_list": select_list\n
+        "select_list": select_list,\n
+        "sort_on": gadget.props.sort_list\n
       }).push(function (result) {\n
         var promise_list = [result];\n
         counter = Math.min(result.data.total_rows, lines);\n
@@ -242,7 +276,8 @@
                 jio_key: result.data.rows[i].id,\n
                 selection_index: begin_from + i,\n
                 query: new URI(field_json.query).query(true).query + query_string,\n
-                list_method_template: field_json.list_method_template\n
+                list_method_template: field_json.list_method_template,\n
+                "sort_list:json": gadget.props.sort_list\n
               }\n
             })\n
           );\n
@@ -462,6 +497,24 @@
           return data;\n
         });\n
     })\n
+    .declareService(function () {\n
+      var gadget = this,\n
+        url,\n
+        options = {},\n
+        sort_form = gadget.props.element.querySelector(".sort_form");\n
+      return loopEventListener(\n
+        sort_form,\n
+        "submit",\n
+        false,\n
+        function () {\n
+          url = "gadget_erp5_sort_editor.html";\n
+          options.sort_column_list = gadget.props.field_json.sort_column_list;\n
+          options.sort_list = gadget.props.sort_list;\n
+          options.key = gadget.props.field_json.key + "_sort_list:json";\n
+          return gadget.renderEditorPanel(url, options);\n
+        }\n
+      );\n
+    })\n
 \n
     .allowPublicAcquisition("notifyInvalid", function () {\n
       return;\n
@@ -471,7 +524,7 @@
       return;\n
     });\n
 \n
-}(window, document, rJS, URI, RSVP, UriTemplate));
+}(window, document, rJS, URI, RSVP, loopEventListener));
 
 ]]></string> </value>
         </item>
@@ -608,7 +661,7 @@
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>946.56368.46897.8174</string> </value>
+                <value> <string>947.5035.37117.26743</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -626,7 +679,7 @@
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1446565852.84</float>
+                        <float>1447417728.47</float>
                         <string>UTC</string>
                       </tuple>
                     </state>

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_router_js.xml

@@ -145,6 +145,11 @@
   VALID_URL_COMMAND_DICT[COMMAND_SELECTION_NEXT] = null;\n
   VALID_URL_COMMAND_DICT[COMMAND_HISTORY_PREVIOUS] = null;\n
   VALID_URL_COMMAND_DICT[COMMAND_PUSH_HISTORY] = null;\n
+\n
+\n
+  function endsWith(str, suffix) {\n
+    return str.indexOf(suffix, str.length - suffix.length) !== -1;\n
+  }\n
 \n
   //////////////////////////////////////////////////////////////////\n
   // Change URL functions\n
@@ -215,6 +220,7 @@
     var result = "#" + PREFIX_COMMAND + (command || ""),\n
       prefix = "?",\n
       key,\n
+      tmp,\n
       tmp_dict;\n
     tmp_dict = gadget.props.options;\n
     for (key in tmp_dict) {\n
@@ -222,7 +228,11 @@
         if (tmp_dict[key] === undefined) {\n
           tmp_dict[key] = \'\';\n
         }\n
-        result += prefix + PREVIOUS_KEY + "." + encodeURIComponent(key) + "=" + encodeURIComponent(tmp_dict[key]);\n
+        tmp = tmp_dict[key];\n
+        if (endsWith(key, ":json")) {\n
+          tmp = JSON.stringify(tmp);\n
+        }\n
+        result += prefix + PREVIOUS_KEY + "." + encodeURIComponent(key) + "=" + encodeURIComponent(tmp);\n
         prefix = "&";\n
       }\n
     }\n
@@ -231,7 +241,11 @@
         if (options[key] === undefined) {\n
           options[key] = \'\';\n
         }\n
-        result += prefix + NEXT_KEY + "." + encodeURIComponent(key) + "=" + encodeURIComponent(options[key]);\n
+        tmp = options[key];\n
+        if (endsWith(key, ":json")) {\n
+          tmp = JSON.stringify(tmp);\n
+        }\n
+        result += prefix + NEXT_KEY + "." + encodeURIComponent(key) + "=" + encodeURIComponent(tmp);\n
         prefix = "&";\n
       }\n
     }\n
@@ -241,12 +255,17 @@
   function getDisplayUrlFor(jio_key, options) {\n
     var prefix = \'?\',\n
       result,\n
+      tmp,\n
       key;\n
     result = "#" + PREFIX_DISPLAY + (jio_key || "");\n
     for (key in options) {\n
       if (options.hasOwnProperty(key) && options[key] !== undefined) {\n
         // Don\'t keep empty values\n
-        result += prefix + encodeURIComponent(key) + "=" + encodeURIComponent(options[key]);\n
+        tmp = options[key];\n
+        if (endsWith(key, ":json")) {\n
+          tmp = JSON.stringify(tmp);\n
+        }\n
+        result += prefix + encodeURIComponent(key) + "=" + encodeURIComponent(tmp);\n
         prefix = \'&\';\n
       }\n
     }\n
@@ -392,6 +411,7 @@
     // selection_options.index = next_options.index;\n
     selection_options.query = next_options.query;\n
     selection_options.list_method_template = next_options.list_method_template;\n
+    selection_options["sort_list:json"] = next_options["sort_list:json"] || [];\n
     // Store selection in local DB\n
     return addSelection(gadget, selection_options)\n
       .push(function (id) {\n
@@ -432,7 +452,8 @@
         return gadget.jio_allDocs({\n
           "query": selection.query,\n
           "list_method_template": selection.list_method_template,\n
-          "limit": [parseInt(previous_options.selection_index, 10) + 1, 1]\n
+          "limit": [parseInt(previous_options.selection_index, 10) + 1, 1],\n
+          "sort_on": selection["sort_list:json"]\n
         })\n
           .push(function (result) {\n
             if (result.data.rows.length === 0) {\n
@@ -480,7 +501,8 @@
         return gadget.jio_allDocs({\n
           "query": selection.query,\n
           "list_method_template": selection.list_method_template,\n
-          "limit": [parseInt(previous_options.selection_index, 10) - 1, 1]\n
+          "limit": [parseInt(previous_options.selection_index, 10) - 1, 1],\n
+          "sort_on": selection["sort_list:json"]\n
         })\n
           .push(function (result) {\n
             if (result.data.rows.length === 0) {\n
@@ -698,6 +720,8 @@
         subhash,\n
         keyvalue,\n
         index,\n
+        key,\n
+        tmp,\n
         args = {};\n
       if (hash !== undefined) {\n
         split = hash.split(\'?\');\n
@@ -711,7 +735,12 @@
           if (subhash !== \'\') {\n
             keyvalue = subhash.split(\'=\');\n
             if (keyvalue.length === 2) {\n
-              args[decodeURIComponent(keyvalue[0])] = decodeURIComponent(keyvalue[1]);\n
+              key = decodeURIComponent(keyvalue[0]);\n
+              tmp = decodeURIComponent(keyvalue[1]);\n
+              if (endsWith(key, ":json")) {\n
+                tmp = JSON.parse(tmp);\n
+              }\n
+              args[key] = tmp;\n
             }\n
           }\n
         }\n
@@ -896,12 +925,6 @@
                       <persistent> <string encoding="base64">AAAAAAAAAAQ=</string> </persistent>
                     </value>
                 </item>
-                <item>
-                    <key> <string>processing_status_workflow</string> </key>
-                    <value>
-                      <persistent> <string encoding="base64">AAAAAAAAAAU=</string> </persistent>
-                    </value>
-                </item>
               </dictionary>
             </value>
         </item>
@@ -923,7 +946,7 @@
             </item>
             <item>
                 <key> <string>actor</string> </key>
-                <value> <string>romain</string> </value>
+                <value> <string>zope</string> </value>
             </item>
             <item>
                 <key> <string>comment</string> </key>
@@ -945,8 +968,8 @@
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1441962261.87</float>
-                        <string>GMT</string>
+                        <float>1447177687.37</float>
+                        <string>UTC</string>
                       </tuple>
                     </state>
                   </object>
@@ -990,7 +1013,7 @@
             </item>
             <item>
                 <key> <string>serial</string> </key>
-                <value> <string>947.3470.27048.19353</string> </value>
+                <value> <string>947.5039.722.46899</string> </value>
             </item>
             <item>
                 <key> <string>state</string> </key>
@@ -1008,7 +1031,7 @@
                     </tuple>
                     <state>
                       <tuple>
-                        <float>1447323762.19</float>
+                        <float>1447419956.3</float>
                         <string>UTC</string>
                       </tuple>
                     </state>
@@ -1020,61 +1043,4 @@
       </tuple>
     </pickle>
   </record>
-  <record id="5" aka="AAAAAAAAAAU=">
-    <pickle>
-      <global name="WorkflowHistoryList" module="Products.ERP5Type.patches.WorkflowTool"/>
-    </pickle>
-    <pickle>
-      <tuple>
-        <none/>
-        <list>
-          <dictionary>
-            <item>
-                <key> <string>action</string> </key>
-                <value> <string>detect_converted_file</string> </value>
-            </item>
-            <item>
-                <key> <string>actor</string> </key>
-                <value> <string>romain</string> </value>
-            </item>
-            <item>
-                <key> <string>comment</string> </key>
-                <value> <string></string> </value>
-            </item>
-            <item>
-                <key> <string>error_message</string> </key>
-                <value> <string></string> </value>
-            </item>
-            <item>
-                <key> <string>external_processing_state</string> </key>
-                <value> <string>converted</string> </value>
-            </item>
-            <item>
-                <key> <string>serial</string> </key>
-                <value> <string>0.0.0.0</string> </value>
-            </item>
-            <item>
-                <key> <string>time</string> </key>
-                <value>
-                  <object>
-                    <klass>
-                      <global name="DateTime" module="DateTime.DateTime"/>
-                    </klass>
-                    <tuple>
-                      <none/>
-                    </tuple>
-                    <state>
-                      <tuple>
-                        <float>1441962223.77</float>
-                        <string>GMT</string>
-                      </tuple>
-                    </state>
-                  </object>
-                </value>
-            </item>
-          </dictionary>
-        </list>
-      </tuple>
-    </pickle>
-  </record>
 </ZopeData>

bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_zuite/listbox_zuite.xml → bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_listbox_zuite.xml

@@ -14,7 +14,7 @@
         </item>
         <item>
             <key> <string>id</string> </key>
-            <value> <string>listbox_zuite</string> </value>
+            <value> <string>renderjs_ui_listbox_zuite</string> </value>
         </item>
         <item>
             <key> <string>title</string> </key>

bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_zuite/listbox_zuite/testEditNotIndexedDocument.xml → bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_listbox_zuite/testEditNotIndexedDocument.xml

@@ -183,28 +183,7 @@
   <td>2022-12-21</td>\n
 </tr>\n
 \n
-<tr>\n
-  <td>waitForElementPresent</td>\n
-  <td>//button[@data-i18n=\'Save\']</td>\n
-  <td></td>\n
-</tr>\n
-<tr>\n
-  <td>click</td>\n
-  <td>//button[@data-i18n="Save"]</td>\n
-  <td></td>\n
-</tr>\n
-\n
-<tr>\n
-  <td>pause</td>\n
-  <td>3000</td>\n
-  <td></td>\n
-</tr>\n
-\n
-<tr>\n
-  <td>waitForElementPresent</td>\n
-  <td>//button[@data-i18n=\'Save\']</td>\n
-  <td></td>\n
-</tr>\n
+<tal:block metal:use-macro="here/Zuite_CommonTemplateForRenderjsUi/macros/save" />\n
 \n
 <tr>\n
   <td>click</td>\n

bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_listbox_zuite/testSort.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>_text</string> </key>
+            <value> <unicode encoding="cdata"><![CDATA[
+
+<html xmlns:tal="http://xml.zope.org/namespaces/tal"\n
+      xmlns:metal="http://xml.zope.org/namespaces/metal">\n
+<head>\n
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">\n
+<title>Test RenderJS UI</title>\n
+</head>\n
+<body>\n
+<table cellpadding="1" cellspacing="1" border="1">\n
+<thead>\n
+<tr><td rowspan="1" colspan="3">Test RenderJS UI</td></tr>\n
+</thead><tbody>\n
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/init" />\n
+\n
+<!-- Clean Up -->\n
+<tr>\n
+  <td>open</td>\n
+  <td>${base_url}/bar_module/ListBoxZuite_reset</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>assertTextPresent</td>\n
+  <td>Reset Successfully.</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>open</td>\n
+  <td>${base_url}/foo_module/FooModule_createObjects</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>assertTextPresent</td>\n
+  <td>Created Successfully.</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/wait_for_activities" />\n
+\n
+\n
+\n
+<!-- Initialize -->\n
+<tr>\n
+  <td>open</td>\n
+  <td>${base_url}/web_site_module/renderjs_runner/</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//h3[@data-i18n=\'Other\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//h3[@data-i18n=\'Other\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//a[@data-i18n=\'Foos\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>link=Foos</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//form[@class=\'sort_form\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//form[@class=\'sort_form\']/button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//form[@class=\'plus\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//form[@class=\'plus\']//button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[1]</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//form[@class=\'plus\']//button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[2]</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>select</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[1]/div[2]//select</td>\n
+  <td>index=0</td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>select</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[2]/div[1]//select</td>\n
+  <td>index=1</td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//form[@class="submit"]//button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementNotPresent</td>\n
+  <td>link=Title 9</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>link=Title 0</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>verifyText</td>\n
+  <td>//tbody/tr[1]/th[2]/a</td>\n
+  <td>Title 0</td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>verifyText</td>\n
+  <td>//tbody/tr[2]/th[2]/a</td>\n
+  <td>Title 1</td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>verifyText</td>\n
+  <td>//tbody/tr[3]/th[2]/a</td>\n
+  <td>Title 2</td>\n
+</tr>\n
+\n
+</tbody></table>\n
+</body>\n
+</html>
+
+]]></unicode> </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>testSort</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_listbox_zuite/testSortItemAutoBuild.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>_text</string> </key>
+            <value> <unicode encoding="cdata"><![CDATA[
+
+<html xmlns:tal="http://xml.zope.org/namespaces/tal"\n
+      xmlns:metal="http://xml.zope.org/namespaces/metal">\n
+<head>\n
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">\n
+<title>Test RenderJS UI</title>\n
+</head>\n
+<body>\n
+<table cellpadding="1" cellspacing="1" border="1">\n
+<thead>\n
+<tr><td rowspan="1" colspan="3">Test RenderJS UI</td></tr>\n
+</thead><tbody>\n
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/init" />\n
+\n
+<!-- Clean Up -->\n
+<tr>\n
+  <td>open</td>\n
+  <td>${base_url}/bar_module/ListBoxZuite_reset</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>assertTextPresent</td>\n
+  <td>Reset Successfully.</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>open</td>\n
+  <td>${base_url}/foo_module/FooModule_createObjects</td>\n
+  <td></td>\n
+</tr>\n
+<tr>\n
+  <td>assertTextPresent</td>\n
+  <td>Created Successfully.</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/wait_for_activities" />\n
+\n
+\n
+<!-- Initialize -->\n
+<tr>\n
+  <td>open</td>\n
+  <td>${base_url}/web_site_module/renderjs_runner/</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//h3[@data-i18n=\'Other\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//h3[@data-i18n=\'Other\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//a[@data-i18n=\'Foos\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>link=Foos</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//form[@class=\'sort_form\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//form[@class=\'sort_form\']/button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//form[@class=\'plus\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//form[@class=\'plus\']/button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[1]</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//form[@class=\'plus\']/button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[2]</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>select</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[1]/div[2]//select</td>\n
+  <td>index=0</td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>select</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[2]/div[1]//select</td>\n
+  <td>index=1</td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//form[@class="submit"]//button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementNotPresent</td>\n
+  <td>link=Title 9</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>link=Title 0</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//form[@class=\'sort_form\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//form[@class=\'sort_form\']/button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>verifyValue</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[1]/div[1]//select</td>\n
+  <td>id</td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>verifyValue</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[1]/div[2]//select</td>\n
+  <td>ascending</td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>verifyValue</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[2]/div[1]//select</td>\n
+  <td>title</td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>verifyValue</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[2]/div[2]//select</td>\n
+  <td>descending</td>\n
+</tr>\n
+\n
+\n
+</tbody></table>\n
+</body>\n
+</html>
+
+]]></unicode> </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>testSortItemAutoBuild</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_listbox_zuite/testSortItemDelete.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>_text</string> </key>
+            <value> <unicode encoding="cdata"><![CDATA[
+
+<html xmlns:tal="http://xml.zope.org/namespaces/tal"\n
+      xmlns:metal="http://xml.zope.org/namespaces/metal">\n
+<head>\n
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">\n
+<title>Test RenderJS UI</title>\n
+</head>\n
+<body>\n
+<table cellpadding="1" cellspacing="1" border="1">\n
+<thead>\n
+<tr><td rowspan="1" colspan="3">Test RenderJS UI</td></tr>\n
+</thead><tbody>\n
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/init" />\n
+\n
+<!-- Clean Up -->\n
+<tr>\n
+  <td>open</td>\n
+  <td>${base_url}/bar_module/ListBoxZuite_reset</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>assertTextPresent</td>\n
+  <td>Reset Successfully.</td>\n
+  <td></td>\n
+</tr>\n
+<!-- should create in new ui instead of using script -->\n
+<tr>\n
+  <td>open</td>\n
+  <td>${base_url}/foo_module/FooModule_createObjects</td>\n
+  <td></td>\n
+</tr>\n
+<tr>\n
+  <td>assertTextPresent</td>\n
+  <td>Created Successfully.</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/wait_for_activities" />\n
+\n
+\n
+<!-- Initialize -->\n
+<tr>\n
+  <td>open</td>\n
+  <td>${base_url}/web_site_module/renderjs_runner/</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//h3[@data-i18n=\'Other\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//h3[@data-i18n=\'Other\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//a[@data-i18n=\'Foos\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>link=Foos</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//form[@class=\'sort_form\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//form[@class=\'sort_form\']/button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//form[@class=\'plus\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//form[@class=\'plus\']//button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[1]</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//form[@class=\'plus\']//button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[2]</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>focus</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[2]//button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[2]//button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementNotPresent</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[2]</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>focus</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[1]//button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[1]//button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementNotPresent</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[1]</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>verifyElementNotPresent</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[1]</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>verifyElementNotPresent</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[2]</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+\n
+</tbody></table>\n
+</body>\n
+</html>
+
+]]></unicode> </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>testSortItemDelete</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_listbox_zuite/testSortWithPager.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>_text</string> </key>
+            <value> <unicode encoding="cdata"><![CDATA[
+
+<html xmlns:tal="http://xml.zope.org/namespaces/tal"\n
+      xmlns:metal="http://xml.zope.org/namespaces/metal">\n
+<head>\n
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">\n
+<title>Test RenderJS UI</title>\n
+</head>\n
+<body>\n
+<table cellpadding="1" cellspacing="1" border="1">\n
+<thead>\n
+<tr><td rowspan="1" colspan="3">Test RenderJS UI</td></tr>\n
+</thead><tbody>\n
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/init" />\n
+\n
+<!-- Clean Up -->\n
+<tr>\n
+  <td>open</td>\n
+  <td>${base_url}/bar_module/ListBoxZuite_reset</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>assertTextPresent</td>\n
+  <td>Reset Successfully.</td>\n
+  <td></td>\n
+</tr>\n
+<!-- should create in new ui instead of using script -->\n
+<tr>\n
+  <td>open</td>\n
+  <td>${base_url}/foo_module/FooModule_createObjects</td>\n
+  <td></td>\n
+</tr>\n
+<tr>\n
+  <td>assertTextPresent</td>\n
+  <td>Created Successfully.</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/wait_for_activities" />\n
+\n
+<!-- Initialize -->\n
+<tr>\n
+  <td>open</td>\n
+  <td>${base_url}/web_site_module/renderjs_runner/</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//h3[@data-i18n=\'Other\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//h3[@data-i18n=\'Other\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//a[@data-i18n=\'Foos\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>link=Foos</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//form[@class=\'sort_form\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//form[@class=\'sort_form\']/button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//form[@class=\'plus\']</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//form[@class=\'plus\']/button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[1]</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>select</td>\n
+  <td>//div[@class=\'sort_item_container ui-controlgroup ui-corner_all\']/div[1]/div[2]//select</td>\n
+  <td>ascending</td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>//form[@class="submit"]//button</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementNotPresent</td>\n
+  <td>link=Title 9</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>link=Title 0</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>verifyText</td>\n
+  <td>//tbody/tr[1]/th[2]/a</td>\n
+  <td>Title 0</td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>verifyText</td>\n
+  <td>//tbody/tr[2]/th[2]/a</td>\n
+  <td>Title 1</td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>verifyText</td>\n
+  <td>//tbody/tr[3]/th[2]/a</td>\n
+  <td>Title 2</td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>link=Next</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>link=Next</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementNotPresent</td>\n
+  <td>link=Title 0</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>link=Title 3</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>verifyText</td>\n
+  <td>//tbody/tr[1]/th[2]/a</td>\n
+  <td>Title 3</td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>verifyText</td>\n
+  <td>//tbody/tr[2]/th[2]/a</td>\n
+  <td>Title 4</td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>verifyText</td>\n
+  <td>//tbody/tr[3]/th[2]/a</td>\n
+  <td>Title 5</td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>link=Next</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>link=Next</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementNotPresent</td>\n
+  <td>link=Title 3</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>link=Title 6</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>verifyText</td>\n
+  <td>//tbody/tr[1]/th[2]/a</td>\n
+  <td>Title 6</td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>verifyText</td>\n
+  <td>//tbody/tr[2]/th[2]/a</td>\n
+  <td>Title 7</td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>verifyText</td>\n
+  <td>//tbody/tr[3]/th[2]/a</td>\n
+  <td>Title 8</td>\n
+</tr>\n
+\n
+\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>link=Previous</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>click</td>\n
+  <td>link=Previous</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementNotPresent</td>\n
+  <td>link=Title 6</td>\n
+  <td></td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>waitForElementPresent</td>\n
+  <td>link=Title 3</td>\n
+  <td></td>\n
+</tr>\n
+\n
+\n
+<tr>\n
+  <td>verifyText</td>\n
+  <td>//tbody/tr[1]/th[2]/a</td>\n
+  <td>Title 3</td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>verifyText</td>\n
+  <td>//tbody/tr[2]/th[2]/a</td>\n
+  <td>Title 4</td>\n
+</tr>\n
+\n
+<tr>\n
+  <td>verifyText</td>\n
+  <td>//tbody/tr[3]/th[2]/a</td>\n
+  <td>Title 5</td>\n
+</tr>\n
+\n
+</tbody></table>\n
+</body>\n
+</html>
+
+]]></unicode> </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>testSortWithPager</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/TestTemplateItem/portal_components/test.erp5.testFunctionalRJSListbox.py

+##############################################################################
+#
+# Copyright (c) 2011 Nexedi SARL and Contributors. All Rights Reserved.
+#                     Kazuhiko <kazuhiko@nexedi.com>
+#                     Rafael Monnerat <rafael@nexedi.com>
+#
+# WARNING: This program as such is intended to be used by professional
+# programmers who take the whole responsability of assessing all potential
+# consequences resulting from its eventual inadequacies and bugs
+# End users who are looking for a ready-to-use solution with commercial
+# garantees and support are strongly adviced to contract a Free Software
+# Service Company
+#
+# This program is Free Software; you can redistribute it and/or
+# modify it under the terms of the GNU General Public License
+# as published by the Free Software Foundation; either version 2
+# of the License, or (at your option) any later version.
+#
+# This program is distributed in the hope that it will be useful,
+# but WITHOUT ANY WARRANTY; without even the implied warranty of
+# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+# GNU General Public License for more details.
+#
+# You should have received a copy of the GNU General Public License
+# along with this program; if not, write to the Free Software
+# Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA  02111-1307, USA.
+#
+##############################################################################
+import unittest
+
+from Products.ERP5Type.tests.ERP5TypeFunctionalTestCase import ERP5TypeFunctionalTestCase
+
+class TestRenderJSUIListbox(ERP5TypeFunctionalTestCase):
+  foreground = 0
+  run_only = "renderjs_ui_listbox_zuite"
+
+  def getBusinessTemplateList(self):
+    return (
+      'erp5_web_renderjs_ui',
+      'erp5_web_renderjs_ui_test',
+      'erp5_ui_test_core',
+    )
+
+def test_suite():
+  suite = unittest.TestSuite()
+  suite.addTest(unittest.makeSuite(TestRenderJSUIListbox))
+  return suite
\ No newline at end of file

bt5/erp5_web_renderjs_ui_test/TestTemplateItem/portal_components/test.erp5.testFunctionalRJSListbox.xml

+<?xml version="1.0"?>
+<ZopeData>
+  <record id="1" aka="AAAAAAAAAAE=">
+    <pickle>
+      <global name="Test Component" module="erp5.portal_type"/>
+    </pickle>
+    <pickle>
+      <dictionary>
+        <item>
+            <key> <string>default_reference</string> </key>
+            <value> <string>testFunctionalRJSListbox</string> </value>
+        </item>
+        <item>
+            <key> <string>description</string> </key>
+            <value>
+              <none/>
+            </value>
+        </item>
+        <item>
+            <key> <string>id</string> </key>
+            <value> <string>test.erp5.testFunctionalRJSListbox</string> </value>
+        </item>
+        <item>
+            <key> <string>portal_type</string> </key>
+            <value> <string>Test Component</string> </value>
+        </item>
+        <item>
+            <key> <string>sid</string> </key>
+            <value>
+              <none/>
+            </value>
+        </item>
+        <item>
+            <key> <string>text_content_error_message</string> </key>
+            <value>
+              <tuple/>
+            </value>
+        </item>
+        <item>
+            <key> <string>text_content_warning_message</string> </key>
+            <value>
+              <tuple/>
+            </value>
+        </item>
+        <item>
+            <key> <string>version</string> </key>
+            <value> <string>erp5</string> </value>
+        </item>
+        <item>
+            <key> <string>workflow_history</string> </key>
+            <value>
+              <persistent> <string encoding="base64">AAAAAAAAAAI=</string> </persistent>
+            </value>
+        </item>
+      </dictionary>
+    </pickle>
+  </record>
+  <record id="2" aka="AAAAAAAAAAI=">
+    <pickle>
+      <global name="PersistentMapping" module="Persistence.mapping"/>
+    </pickle>
+    <pickle>
+      <dictionary>
+        <item>
+            <key> <string>data</string> </key>
+            <value>
+              <dictionary>
+                <item>
+                    <key> <string>component_validation_workflow</string> </key>
+                    <value>
+                      <persistent> <string encoding="base64">AAAAAAAAAAM=</string> </persistent>
+                    </value>
+                </item>
+              </dictionary>
+            </value>
+        </item>
+      </dictionary>
+    </pickle>
+  </record>
+  <record id="3" aka="AAAAAAAAAAM=">
+    <pickle>
+      <global name="WorkflowHistoryList" module="Products.ERP5Type.patches.WorkflowTool"/>
+    </pickle>
+    <pickle>
+      <tuple>
+        <none/>
+        <list>
+          <dictionary>
+            <item>
+                <key> <string>action</string> </key>
+                <value> <string>validate</string> </value>
+            </item>
+            <item>
+                <key> <string>validation_state</string> </key>
+                <value> <string>validated</string> </value>
+            </item>
+          </dictionary>
+        </list>
+      </tuple>
+    </pickle>
+  </record>
+</ZopeData>

bt5/erp5_web_renderjs_ui_test/bt/template_path_list

+portal_tests/renderjs_ui_listbox_zuite
+portal_tests/renderjs_ui_listbox_zuite/**
 portal_tests/renderjs_ui_page_templates_zuite
 portal_tests/renderjs_ui_page_templates_zuite/**
 portal_tests/renderjs_ui_page_zuite

bt5/erp5_web_renderjs_ui_test/bt/template_test_id_list

@@ -2,3 +2,4 @@ test.erp5.testFunctionalRJSCore
 test.erp5.testFunctionalRJSPageTemplate
 test.erp5.testFunctionalRJSPage
 test.erp5.testFunctionalRJSRouter
+test.erp5.testFunctionalRJSListbox
\ No newline at end of file