erp5_web_js_style: do not crash if style gadget can't be loaded

Try to support displaying web js site from google cache,
which can not access original gadget, due to cross origin ajax query forbidden.

Display original content instead and load the default CSS in such case.

bt5/erp5_web_js_style/SkinTemplateItem/portal_skins/erp5_web_js_style_ui/jsstyle.js.js

 /*globals window, document, RSVP, rJS, XMLHttpRequest, DOMParser, URL,
-          loopEventListener, history */
+          loopEventListener, history, console */
 /*jslint indent: 2, maxlen: 80*/
 (function (window, document, RSVP, rJS, XMLHttpRequest, DOMParser, URL,
-          loopEventListener, history) {
+          loopEventListener, history, console) {
   "use strict";
 
   // XXX Copy/paste from renderjs
@@ -110,11 +110,10 @@
   }
 
   function parseFormElement(form_element) {
-    var result;
     if (form_element !== null) {
       return form_element.outerHTML;
     }
-    return result;
+    return;
   }
 
   function parseStatusMessage(status_element, information_element) {
@@ -130,6 +129,7 @@
 
   function parsePageContent(body_element) {
     return {
+      original_content: body_element.innerHTML,
       html_content: body_element.querySelector('main').innerHTML,
       language_list: parseLanguageElement(
         body_element.querySelector('nav#language')
@@ -143,7 +143,7 @@
       portal_status_message: parseStatusMessage(
         body_element.querySelector('p#portal_status_message'),
         body_element.querySelector('p#information_area')
-      ),
+      )
     };
   }
 
@@ -315,20 +315,28 @@
         .push(function (result) {
           style_gadget = result;
           return style_gadget.render(parsed_content.html_content,
-                                     parsed_content);
-        })
-        .push(function () {
-          // Trigger URL handling
-          gadget.listenURLChange();
-
-          body.appendChild(style_gadget.element);
-          gadget.element.hidden = false;
-          scrollToHash(window.location.hash);
+                                     parsed_content)
+            .push(function () {
+              // Trigger URL handling
+              gadget.listenURLChange();
+
+              body.appendChild(style_gadget.element);
+              gadget.element.hidden = false;
+              scrollToHash(window.location.hash);
+            }, function (error) {
+              gadget.element.hidden = false;
+              throw error;
+            });
         }, function (error) {
-          gadget.element.hidden = false;
-          throw error;
+          console.warn('Cant load the style gadget', error);
+          return new RSVP.Queue(rJS.declareCSS("jsstyle.css", document.head))
+            .push(function () {
+              // Set again the page content after the css is loaded
+              // to prevent ugly rendering
+              gadget.element.innerHTML = parsed_content.original_content;
+            });
         });
     });
 
 }(window, document, RSVP, rJS, XMLHttpRequest, DOMParser, URL,
-  loopEventListener, history));
\ No newline at end of file
+  loopEventListener, history, console));
\ No newline at end of file

bt5/erp5_web_js_style_test/PathTemplateItem/portal_tests/js_style_zuite/testJsStyleDemoStyle.zpt

@@ -78,6 +78,12 @@
   <td></td>
 </tr>
 
+<tr>
+  <td>assertElementNotPresent</td>
+  <td>//head/link[@rel='stylesheet' and @href='jsstyle.css']</td>
+  <td></td>
+</tr>
+
 </tbody></table>
 </body>
 </html>
\ No newline at end of file

bt5/erp5_web_js_style_test/PathTemplateItem/portal_tests/js_style_zuite/testJsStyleNoStyle.zpt

@@ -38,6 +38,17 @@
   <td></td>
 </tr>
 
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//head/link[@rel='stylesheet' and @href='jsstyle.css']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>assertElementPresent</td>
+  <td>//head/link[@rel='stylesheet' and @href='jsstyle.css']</td>
+  <td></td>
+</tr>
+
 <tr>
   <td>assertElementPresent</td>
   <td>//nav[@id='sitemap']/a[text()='No Style']</td>

bt5/erp5_web_js_style_test/PathTemplateItem/portal_tests/js_style_zuite/testJsStyleNotLoadingStyle.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>testJsStyleNotLoadingStyle</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_js_style_test/PathTemplateItem/portal_tests/js_style_zuite/testJsStyleNotLoadingStyle.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 JS Style Demo Style</title>
+</head>
+<body>
+<table cellpadding="1" cellspacing="1" border="1">
+<thead>
+<tr><td rowspan="1" colspan="3">Test JS Style Demo Style</td></tr>
+</thead><tbody>
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/init" />
+
+<tr>
+  <td>open</td>
+  <td>${base_url}/ERP5Site_createWebJSStyleZuiteTestData?configuration=not_loading</td>
+  <td></td>
+</tr>
+<tr>
+  <td>assertTextPresent</td>
+  <td>Web Site created.</td>
+  <td></td>
+</tr>
+
+<tal:block metal:use-macro="here/Zuite_CommonTemplate/macros/wait_for_activities" />
+
+
+<!-- Initialize -->
+<tr>
+  <td>open</td>
+  <td>${base_url}/web_site_module/erp5_web_js_style_test_site/</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>assertElementPresent</td>
+  <td>//head/link[@rel='prerender' and @href='jsstyle_demo_not_loading.html']</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//head/link[@rel='stylesheet' and @href='jsstyle.css']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>assertElementPresent</td>
+  <td>//head/link[@rel='stylesheet' and @href='jsstyle.css']</td>
+  <td></td>
+</tr>
+
+
+<tr>
+  <td>waitForElementPresent</td>
+  <td>//nav[@id='sitemap']/a[text()='Not Loading Style']</td>
+  <td></td>
+</tr>
+<tr>
+  <td>assertElementPresent</td>
+  <td>//nav[@id='sitemap']/a[text()='Not Loading Style']</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>assertElementPresent</td>
+  <td>//nav[@id='language']//a[@hreflang='en']</td>
+  <td></td>
+</tr>
+
+<tr>
+  <td>assertElementPresent</td>
+  <td>//div[@class='input']/span[@class='headline' and text()='Not Loading Style']</td>
+  <td></td>
+</tr>
+
+</tbody></table>
+</body>
+</html>
\ No newline at end of file

bt5/erp5_web_js_style_test/SkinTemplateItem/portal_skins/erp5_web_js_style_test/ERP5Site_createWebJSStyleZuiteTestData.py

@@ -129,6 +129,10 @@ configuration_dict = {
     'configuration_style_gadget_url': "jsstyle_demo.html",
     'title': "Demo Style",
   },
+  'not_loading': {
+    'configuration_style_gadget_url': "jsstyle_demo_not_loading.html",
+    'title': "Not Loading Style",
+  },
   'favicon': {
     'title': 'Favicon',
     'configuration_favicon_url': "favicon.ico"