Fix/improve js initialization of spreadsheet module

Author: hoogi91

.eslintrc.js

@@ -2,7 +2,8 @@ module.exports = {
     root: true,
     env: {
         browser: true,
-        node: true
+        node: true,
+        es6: true
     },
     parser: "babel-eslint",
     parserOptions: {

Resources/Private/Assets/JavaScript/main.js

@@ -2,6 +2,7 @@ import DSN from './dsn';
 import Renderer from './renderer';
 import Spreadsheet from './spreadsheet';
 import Selector from "./selector";
+import DocumentService from 'DocumentService';
 
 class SpreadsheetDataInput {
     constructor(element) {
@@ -125,7 +126,10 @@ class SpreadsheetDataInput {
 }
 
 // initialize all spreadsheet data inputs
-document.querySelectorAll('.spreadsheet-input-wrap').forEach((element) => {
-    new SpreadsheetDataInput(element);
+DocumentService.ready().then(() => {
+    document.querySelectorAll('.spreadsheet-input-wrap').forEach((element) => {
+        new SpreadsheetDataInput(element);
+    });
+}).catch(() => {
+    console.error('Failed to load DOM for processing spreadsheet inputs!');
 });
-

Resources/Public/JavaScript/SpreadsheetDataInput.js

@@ -37,11 +37,9 @@ module.exports = (env, argv) => ({
         filename: "[name].js",
         libraryTarget: "amd",
         path: path.join(__dirname, "/Resources/Public/JavaScript"),
-        publicPath: argv.mode !== "production" ? "/" : "../dist/",
-        umdNamedDefine: true
+        publicPath: argv.mode !== "production" ? "/" : "../dist/"
     },
     externals: {
-        // require("jquery") is external and available on the global var jQuery
-        "jquery": "jquery",
+        "DocumentService": "TYPO3/CMS/Core/DocumentService",
     }
 });