web_renderjs_ui: make error page a bit more readable

- indent the json representation of error
- if error is an XMLHttpRequest:
  - include the server side error response in an iframe
  - split response headers

/reviewed-on nexedi/erp5!981

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_launcher_js.js

@@ -120,9 +120,9 @@
     var error_list = [original_error],
       i,
       error,
+      error_response,
       error_text = "";
 
-
     // Do not break the application in case of errors.
     // Display it to the user for now,
     // and allow user to go back to the frontpage
@@ -144,6 +144,9 @@
         }
       }
       if (error instanceof XMLHttpRequest) {
+        if (error.getResponseHeader('Content-Type').indexOf('text/') === 0) {
+          error_response = error.response;
+        }
         error = {
           message: error.toString(),
           readyState: error.readyState,
@@ -151,14 +154,16 @@
           statusText: error.statusText,
           response: error.response,
           responseUrl: error.responseUrl,
-          response_headers: error.getAllResponseHeaders()
+          response_headers: (error.getAllResponseHeaders()
+                             ? error.getAllResponseHeaders().split('\r\n')
+                             : null)
         };
       }
       if (error.constructor === Array ||
           error.constructor === String ||
           error.constructor === Object) {
         try {
-          error = JSON.stringify(error);
+          error = JSON.stringify(error, null, '  ');
         } catch (ignore) {
         }
       }
@@ -185,9 +190,20 @@
       // Gadget has not yet been correctly initialized
       throw error;
     }
-
+    if (error_response && error_response.text) {
+      return error_response.text().then(
+        function (request_error_text) {
+          return gadget.changeState({
+            error_text: error_text,
+            request_error_text: request_error_text,
+            url: undefined
+          });
+        }
+      );
+    }
     return gadget.changeState({
       error_text: error_text,
+      request_error_text: error_response,
       url: undefined
     });
 
@@ -683,6 +699,7 @@
             var element = gadget.props.content_element,
               container = document.createElement("section"),
               paragraph,
+              iframe,
               link;
 
             paragraph = document.createElement("p");
@@ -731,6 +748,13 @@
             }
             element.appendChild(container);
 
+            // make an iframe to display error page from XMLHttpRequest.
+            if (gadget.state.request_error_text) {
+              iframe = document.createElement('iframe');
+              container.appendChild(iframe);
+              iframe.srcdoc = gadget.state.request_error_text;
+            }
+
             // reset gadget state
             gadget.state = JSON.parse(default_state_json_string);
           });

bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_launcher_js.xml

@@ -313,7 +313,7 @@
                           </tuple>
                           <state>
                             <tuple>
-                              <float>1469697401.26</float>
+                              <float>1469697401.27</float>
                               <string>UTC</string>
                             </tuple>
                           </state>

bt5/erp5_web_renderjs_ui_test/PathTemplateItem/portal_tests/renderjs_ui_zuite/testErrorPageFirstLoad.zpt

@@ -50,7 +50,7 @@
 
 <tr>
   <td>assertTextPresent</td>
-  <td>"status":404</td>
+  <td>"status": 404</td>
   <td></td>
 </tr>
 
@@ -60,6 +60,35 @@
   <td></td>
 </tr>
 
+<!-- when an action failed server side, the server side error is displayed in an ifame of the error page -->
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//div[@role="main"]//iframe</td>
+  <td></td>
+</tr>
+<tr>
+  <td>selectFrame</td>
+  <td>//div[@role="main"]//iframe</td>
+  <td></td>
+</tr>
+<tr>
+  <td>waitForTextPresent</td>
+  <td>Not Found</td>
+  <td></td>
+</tr>
+<tr>
+  <td>verifyTextPresent</td>
+  <td>gadget_erp5_page_foobar.html was not found on this server.</td>
+  <td></td>
+</tr>
+<tr>
+  <td>selectFrame</td>
+  <td>relative=top</td>
+  <td></td>
+</tr>
+
+
+
 <tr>
   <td>assertTextPresent</td>
   <td>#/?page=foobar</td>