[BUGFIX] Catch form errors and display speaking error message

When having a broken form configuration, the formEditor is not able to load because of JavaScript errors. These errors are not fixable for an editor as they most likely happen because of admins/integrators changing and breaking the form. Instead of displaying a loading indicator without a hint on the error that happened, a top level catch displaying a flash message has now been implemented. Resolves: #84595 Releases: master, 9.5 Change-Id: I44cf49d8e344629bc1a3250eade6267c7debdf00 Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/60598 Tested-by: TYPO3com <noreply@typo3.com> Tested-by: Mathias Brodala <mbrodala@pagemachine.de> Tested-by: Ralf Zimmermann <ralf.zimmermann@tritum.de> Reviewed-by: Mathias Brodala <mbrodala@pagemachine.de> Reviewed-by: Ralf Zimmermann <ralf.zimmermann@tritum.de>
TYPO3 · Apr 27, 2019 · 2081a5d · 2081a5d
1 parent cee5f57
commit 2081a5d
Show file tree

Hide file tree

Showing 3 changed files with 48 additions and 6 deletions.
diff --git a/typo3/sysext/form/Classes/Controller/FormEditorController.php b/typo3/sysext/form/Classes/Controller/FormEditorController.php
@@ -21,6 +21,7 @@
 use TYPO3\CMS\Core\Authentication\BackendUserAuthentication;
 use TYPO3\CMS\Core\Imaging\Icon;
 use TYPO3\CMS\Core\Localization\LanguageService;
+use TYPO3\CMS\Core\Page\PageRenderer;
 use TYPO3\CMS\Core\Site\Entity\Site;
 use TYPO3\CMS\Core\Site\Entity\SiteLanguage;
 use TYPO3\CMS\Core\Utility\ArrayUtility;
@@ -116,6 +117,8 @@ public function indexAction(string $formPersistenceIdentifier, string $prototype
         $this->view->assign('formEditorTemplates', $this->renderFormEditorTemplates($formEditorDefinitions));
         $this->view->assign('dynamicRequireJsModules', $this->prototypeConfiguration['formEditor']['dynamicRequireJsModules']);
 
+        $this->getPageRenderer()->addInlineLanguageLabelFile('EXT:form/Resources/Private/Language/locallang_formEditor_failSafeErrorHandling_javascript.xlf');
+
         $popupWindowWidth  = 700;
         $popupWindowHeight = 750;
         $popupWindowSize = \trim($this->getBackendUser()->getTSConfig()['options.']['popupWindowSize'] ?? '');
@@ -623,4 +626,14 @@ protected function getLanguageService(): LanguageService
     {
         return $GLOBALS['LANG'];
     }
+
+    /**
+     * Returns the page renderer
+     *
+     * @return PageRenderer
+     */
+    protected function getPageRenderer(): PageRenderer
+    {
+        return GeneralUtility::makeInstance(PageRenderer::class);
+    }
 }
diff --git a/...form/Resources/Private/Language/locallang_formEditor_failSafeErrorHandling_javascript.xlf b/...form/Resources/Private/Language/locallang_formEditor_failSafeErrorHandling_javascript.xlf
@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xliff version="1.0" xmlns:t3="http://typo3.org/schemas/xliff">
+    <file t3:id="1877653884" source-language="en" datatype="plaintext" original="messages" date="2019-04-27T03:38:32Z" product-name="form">
+        <header/>
+        <body>
+            <trans-unit id="formEditor.error.headline" xml:space="preserve">
+                <source>Oops! Something went wrong.</source>
+            </trans-unit>
+            <trans-unit id="formEditor.error.message" xml:space="preserve">
+                <source>Please contact your administrator.</source>
+            </trans-unit>
+            <trans-unit id="formEditor.error.technicalReason" xml:space="preserve">
+                <source>Technical Reason:</source>
+            </trans-unit>
+        </body>
+    </file>
+</xliff>
diff --git a/typo3/sysext/form/Resources/Public/JavaScript/Backend/FormEditor.js b/typo3/sysext/form/Resources/Public/JavaScript/Backend/FormEditor.js
@@ -15,15 +15,16 @@
  * Module: TYPO3/CMS/Form/Backend/FormEditor
  */
 define(['jquery',
-  'TYPO3/CMS/Form/Backend/FormEditor/Core'
-], function($, core) {
+  'TYPO3/CMS/Form/Backend/FormEditor/Core',
+  'TYPO3/CMS/Backend/Notification'
+], function($, core, Notification) {
   'use strict';
 
   /**
    * Return a static method named "getInstance".
    * Use this method to create the formeditor app.
    */
-  return (function(_core) {
+  return (function(_core, Notification) {
 
     /**
      * @private
@@ -1039,8 +1040,19 @@ define(['jquery',
           throw 'You can not run the app twice (1473200696)';
         }
 
-        _bootstrap();
-        _isRunning = true;
+        try {
+          _bootstrap();
+          _isRunning = true;
+        } catch(error) {
+          Notification.error(
+            TYPO3.lang['formEditor.error.headline'],
+            TYPO3.lang['formEditor.error.message']
+            + "\r\n"
+            + "\r\n"
+            + TYPO3.lang['formEditor.error.technicalReason']
+            + "\r\n"
+            + error.message);
+        }
         return this;
       };
 
@@ -1145,5 +1157,5 @@ define(['jquery',
         return _formEditorInstance;
       }
     };
-  })(core);
+  })(core, Notification);
 });